APRENDE REACT CON 100 EJERCICIOS PARA

¿Qué es React? .............................................................. 14
Programación funcional y orientada a objetos ........... 16
El editor de código ....................................................... 18
Profundizando en Visual Studio Code ......................... 20
Instalación de NodeJS y Git ......................................... 22
Creación de nuestra primera aplicación ...................... 24
Estructura de la aplicación recién creada ..................... 26
Ejecutar nuestra aplicación .......................................... 28
JSX ................................................................................ 30
Ejemplos de JSX ........................................................... 32
Ejemplos de JSX. Eventos y arrays ............................... 34
Recogida de datos ......................................................... 36
Ejercicio useRef. Euros ................................................. 38
Ejercicio useRef. Grados ............................................... 40
Ejercicio useRef. Superficie rectángulo ........................ 42
Estados ......................................................................... 44
Ejercicios useState ........................................................ 46
Ejercicio useState. Grados ............................................ 48
Ejercicio useState. Calcular superficie .......................... 50
Recoger valor con estados en lugar de con useRef ....... 52
Componentes ............................................................... 54
Ejercicios componentes. Euros a dólares ..................... 56
Ejercicios componentes. Grados .................................. 58
Props ............................................................................. 60
Enviar props del componente hijo al padre ................ 62
Ejercicios props. Componente Post ............................. 64
Renderizado condicional ............................................. 66
Ejercicio props con renderizado condicional .............. 68
Ejercicio Viaje ............................................................... 70
Arrays ........................................................................... 72
Estilos ........................................................................... 74
Styled components ...................................................... 76
Styled components. Hover, herencia y atributos ........ 78
Styled components. Mediaqueries, estilos del body .... 80
Aplicación para memorizar un speech .......................... 82
Botones para avanzar y retroceder párrafos ................. 84
useEffect ....................................................................... 86
Aplicación de rutinas deportivas ................................. 88
Aplicación de rutinas deportivas. Carga del primer título 90
Aplicación de rutinas deportivas. Mostrar imágenes... 92
Aplicación de rutinas deportivas. Styled components 94
Aplicación de rutinas deportivas. Destacando la imagen . 96
Aplicación de rutinas deportivas. Cambiar de workout 98
Hacer un trivial .......................................................... 100
Hacer un trivial. Preguntas, respuestas y variaciones 102
Hacer un trivial. Respuesta correcta........................... 104
Hacer un trivial. Styled components ......................... 106
Hacer un trivial. Mostrar popups ............................... 108
Hacer un trivial. Randomizar preguntas y respuestas 110
Cuento interactivo ..................................................... 112
Cuento interactivo. Fichero de datos ........................ 114
Cuento interactivo. Cargar la primera escena ........... 116
Cuento interactivo. Cargar la imagen ....................... 118
Cuento interactivo. Styled components .................... 120
Cuento interactivo. Añadiendo puertas .................... 122
React Router ............................................................... 124
React Router. Enlaces a páginas ................................. 126
React Router. Envío y recepción de parámetros ........ 128
Fetch API ..................................................................... 130
Fetch API Comprobación de errores ........................... 132
Axios ........................................................................... 134
Aplicación de chistes .................................................. 136
Aplicación de chistes Mostrando las categorías ......... 138
Consultando la API de Star Wars ............................... 140
Consultando la API de Star Wars. Mostrando datos . 142
Consultando la API de Star Wars. Ir a la página de perfil 144
Consultando la API de Star Wars. Procesar parámetros 146
Consultando la API de Star Wars. Página de perfil .... 148
Consultando la API de Star Wars. Styled components . 150
Consultando la API de Star Wars. Estilos en el perfil ...... 152
Consultando la API de Star Wars. Paginación ........... 154
Consultando la API de Star Wars. Procesar paginación 156
Context API ................................................................ 158
Context API. Mostrar estados .................................... 160
Redux ......................................................................... 162
Redux. La Store y los Reducers ................................... 164
Redux. Actions y Componentes ................................ 166
Redux. Añadiendo propiedades y entidades .............. 168
Redux. Ejercicios ........................................................ 170
Estructura correcta de un componente de React ....... 172
Firebase ....................................................................... 174
Firebase. Crear un proyecto ....................................... 176
Firebase. Configuración de la base de datos .............. 178
Firebase. Autentificación ............................................ 180
Firebase. Conexión desde React a Firebase ................ 182
Firebase. Operación de alta ........................................ 184
Firebase. Consulta y modificación ............................. 186
Firebase. Borrado ........................................................ 188
Autentificación con Auth0 ........................................ 190
Autentificación con Auth0. Aplicación de React ....... 192
Autentificación con Auth0. Personalización ............. 194
NextJS ......................................................................... 196
NextJS. Navegación .................................................... 198
Publicación ................................................................. 200
Publicación de un proyecto que utiliza React Router 202
React Native ............................................................... 204
Arrancar nuestro proyecto con Expo ......................... 206
React Native. Componentes básicos .......................... 208
React Native. Compilar con Expo .............................. 210
¿Y ahora qué? ............................................................. 212

Si le interesa ampliar su conocimiento en Javascript, React es la mejor tecnología para aprender. La relación entre el esfuerzo destinado a aprenderla y lo que podrá hacer después con ella es muy positiva. Además, React está ampliamente extendida y es demandada en infinidad de puestos de trabajo. Gracias a los 100 ejercicios prácticos que encontrará en este libro: o Comprenderá los fundamentos imprescindibles de React y se capacitará para posteriormente aplicarlos en sus propios desarrollos. o Creará componentes reutilizables que podrá guardar en su propia colección para reducir los tiempos de desarrollo de sus aplicaciones. o Realizará aplicaciones que recuperarán información de un servicio externo y la mostrarán en pantalla aplicando estilos para obtener el diseño deseado. o Practicará con decenas de ejercicios que le permitirán asimilar la materia estudiada. o Utilizará programación funcional en sus desarrollos: a pesar de no contar con tanta documentación como la programación orientada a objetos en React, es la solución recomendada por Facebook. Además, en la parte inferior de la primera página, encontrará el código de acceso que le permitirá disfrutar de forma gratuita de todas las soluciones y los recursos necesarios para realizar los ejercicios propuestos en el libro. Todos estos contenidos adicionales están disponibles en www.marcombo.info. Es el momento de aprender y practicar para realizar todas las aplicaciones con React que siempre había imaginado.