Logo de Beunicoos
midudev
Crea una app con React usando create-react-app
¡UPS! Para ver vídeos en la web debes estar registrado, es totalmente gratuito.

1.390 visualizaciones

Ahora que ya sabemos qué es React ⚛️, vamos a crear una pequeña aplicación desde cero para poner en práctica lo que sabemos, hacer un fetching de datos, tener un entorno de desarrollo y añadirle rutas.

Repositorio con el código:
https://github.com/midudev/react-live-coding

Mi curso gratuito de React en Udemy:
https://www.udemy.com/course/aprendiendo-react/

No está actualizado, pero hablo de muchos conceptos que siguen vigentes. Y bueno, ¡es gratis! 😜

¡Si te gusta dale LIKE 👍 y SUSCRÍBETE! 👇
https://www.youtube.com/c/midudev?sub_confirmation=1

SEGMENTOS 📹

00:00 - Bienvenida y presentación
01:42 - Qué es create-react-app
05:45 - npx create-react-app giffy
09:30 - Repasando la estructura de directorios y dependencias
14:20 - Ventajas de create-react-app
15:09 - Giphy API
18:48 - Utilizando useState
28:17 - Utilizando useEffect
36:35 - Llamada a API en React con fetch
39:33 - Mostrando un montón de gifs de pandas 🐼
42:08 - Extrayendo lógica a un servicio
49:37 - Creando nuestros primeros componentes
51:33 - Usando key para lista de elementos
54:43 - Creando componente ListOfGifs
59:05 - Las dependencias del useEffect
01:04:05 - Añadiendo algo de estilos
01:07:40 - Añadiendo rutas con wouter
01:18:35 - Conseguir que sea una SPA sin recargas
01:22:48 - Usando state de loading
01:25:11 - Guardando un objeto en el state del componente
01:30:09 - Scripts de nuestro proyecto: build
01:34:23 - Despedida y cierre 👋

#aprenderReactJS #reactjs #frontend #midudev

-~-~~-~~~-~~-~-
¡No te pierdas mi último vídeo! "Variables de entorno con archivos ENV y actualizaciones en tiempo real con Firestore"
https://www.youtube.com/watch?v=8ZA2p1SBssk
-~-~~-~~~-~~-~-