Crea una app con React usando create-react-app
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
-~-~~-~~~-~~-~-
Видео Crea una app con React usando create-react-app канала midudev
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
-~-~~-~~~-~~-~-
Видео Crea una app con React usando create-react-app канала midudev
Показать
Комментарии отсутствуют
Информация о видео
Другие видео канала
Creando Custom Hooks y usando Context para conseguir un estado global en ReactJSCurso REACT JS ⚛️ - Aprende desde CERO 📈 Componentes, State, JSX (Tutorial Desde Cero en Español)Creando la página Home y configurando ESLINT y PRETTIER en nuestro proyecto¿Qué es React.js y cómo funciona?NextJS: Login en GitHub con Firebase y más Styled JSXCrea tu primera app en React.jsUn SUPERORDENADOR con 165.888 NÚCLEOSArquitectura frontend y productividad - Entrevista con Jason Lengstorf (JavaScript)💯 Aprendiendo Node.JS y Express para crear una API 📶 - Bootcamp FullStack GratuitoCrea un NUEVO PROYECTO con Svelte 3 desde cero 🚀 - CURSO de SVELTE 🔶Aprendiendo NextJS, el framework de React con Server Side RenderingReact ⚛️: Estado del componente, Renderizado Condicional y Eventos - Bootcamp FullStack GratuitoReact Native, Curso para Principiantes (usando Expo)Aprende Webpack paso a pasoCSS en JS y Styled Components con Emotion y ReactReact 16 - Crea tu Primera Aplicación Web en 1 horaReact Hooks Tutorial🧑⚖️ ¡Tu web a juicio! - Revisando proyectos y portfolios de la comunidadReact Navbar Tutorial - Beginner React JS Project