Ahora con todo eso en este módulo, aprendiste mucho sobre cómo construir aplicaciones reales con React Native.
Aprendiste mucho sobre los componentes integrados, aprendiste mucho sobre
el estilo y cómo diseñar las cosas de la manera que quieras y cómo
diseñar las
cosas de la manera que quieras, también cómo el estilo difiere entre algunos componentes, por ejemplo que para los componentes de texto,
el estilo en cascada hasta cierto
punto, por lo que los estilos se heredan en estilos anidados allí, algo que estamos aprovechando en
el juego en la pantalla aquí, pero que en todos los demás componentes, como la vista, los estilos que se le aplican realmente solo
se aplica a esa vista y no se conecta en cascada, no se comparte con ninguna vista secundaria anidada.
También aprendió cómo puede compartir estilos comunes, por ejemplo con componentes personalizados, como nuestro texto del cuerpo que configura
una familia de fuentes general para que podamos usar el texto del cuerpo en lugar del texto incorporado si
queremos texto con esa familia de fuentes.
Por supuesto, ese es un concepto que puede usar para cualquier estilo compartido que
desee, como también lo estamos haciendo para el tipo de tarjeta, donde tenemos una vista preestilizada para darnos esta bonita apariencia
de tarjeta con un poco de sombra.
También aprendió cómo puede configurar algunos temas con constantes que puede importar en diferentes archivos, tanto para colores
aquí como también si lo necesita, para estilos de texto o para cualquier otro estilo que desee compartir entre componentes para
que no lo haga ' No tiene que reescribirlo todo el tiempo, especialmente útil para casos en los que
no desea o donde no puede crear componentes separados como lo estamos
haciendo para la familia de fuentes, por ejemplo.
Entonces, si eso no es posible, lo que en el caso de los colores
hubiera sido difícil porque necesitamos colores en todo tipo de lugares, entonces tales estilos compartidos o constantes compartidas son una excelente
manera y, en general, espero que tengan una idea de cómo componga interfaces de usuario con componentes integrados
y con sus propios componentes personalizados que luego se acumulan en los componentes integrados y cómo,
por lo tanto, puede crear buenas aplicaciones React Native.
Echamos un vistazo a algunos componentes básicos y, por lo tanto, también quiero darle un resumen rápido sobre
lo que aprendió sobre estos componentes aquí.
Probablemente el componente más importante es la vista, que es un contenedor que envuelve otros
componentes para luego colocar esos componentes o agregar ciertos estilos de contenedor, como sombras, bordes, color de fondo,
cosas por el estilo. Casi igual de
importante es el componente de texto que utiliza para generar texto.
También puede anidar texto en texto donde incluso se comparte algún estilo y, en general, puede controlar cómo se
debe generar el texto, si debe ajustarse, que es el valor predeterminado o si solo debe generar
una o dos
líneas y ahí es donde el componente de texto realmente le ayuda a enviar esa valiosa información a sus usuarios.
Ahora a veces no solo desea generar información, sino también obtener información y para esto,
la entrada de texto puede ser útil.
Ahora profundizaremos en la obtención de la entrada del usuario más adelante en el curso, pero ya vio por primera vez
cómo puede diseñarlo y cómo puede configurarlo y cómo puede asegurarse de obtener la entrada correcta y validando la
entrada y realmente solo está trabajando con la entrada que necesita. Ahora, hablando de la entrada del usuario, el botón,
por supuesto, también es un componente crucial, ya sea
el botón incorporado o su propio botón que puede construir con los componentes táctiles que
también son muy importantes y en
los casos en que necesita generar listas de datos, aprendiste sobre FlatList y sobre la vista de desplazamiento,
donde la principal diferencia es que FlatList está optimizado para listas muy largas o listas donde realmente
no sabes cuánto durarán, pero potencialmente son muy largas, mientras que
la vista de desplazamiento es ideal para cualquier otro contenido desplazable que no sea infinitamente largo, donde ciertamente irá más allá
de los límites de la pantalla pero no será demasiado contenido adicional porque si todo ese contenido adicional se
procesa sin ser utilizado, sin que sea visible para para el usuario, entonces está desperdiciando el rendimiento y
ahí
es donde entra FlatList porque
eso solo representa lo que el usuario realmente puede ver.
Hablando de lo que el usuario puede ver, en este módulo, también aprendió cómo agregar sus propias fuentes personalizadas
y, a veces, no necesita una fuente sino una imagen, también
aprendió cómo hacerlo, cómo incluir tanto local como red imágenes y cómo puede diseñar estas imágenes para que se vean bien.
Hablando de estilo, para esto estamos usando la hoja de estilo que no es un componente sino
una clase o un objeto
proporcionado por React Native y la ventaja de usar esta hoja de estilo no es solo que obtendrá
sus estilos del código jsx que desea ser relativamente delgado y breve y conciso, pero que también obtiene una validación automática
de sus estilos y React Native le dice cuándo está utilizando un estilo incorrectamente y que en
el futuro, también podría obtener optimizaciones de rendimiento adicionales. Y con eso, solo podemos alentarlo a que tenga
en cuenta
esta sección, tal vez lo revise por segunda vez y lo use como base para el progreso de su curso
en el que utilizaremos todos estos componentes con los que trabajamos, donde escribiremos más estilos, donde construiremos interfaces
de usuario más complejas y donde realmente necesitará estos fundamentos que aprendió en el segundo y en
este módulo del curso para luego construir increíbles aplicaciones React Native.
Así que sigamos adelante.