Curso React.js ⚛️ desde cero - Crea una aplicación paso a paso - CSS Grid, Infinite Scroll y Tests en nuestra app de React

Hoy vamos a seguir con nuestra aplicación de Gifs en React para pasar a usar CSS Grid en nuestras búsquedas. Además, vamos a hacer que nuestra app tenga infinite scroll usando React y le añadiremos algunos tests para ver cómo funcionan. ¡Si te gusta dale LIKE 👍 y SUSCRÍBETE! 👇 https://www.youtube.com/c/midudev?sub_confirmation=1 SEGMENTOS 00:00 - Presentación 03:22 - CSS Grid 06:31 - grid-template 08:20 - unidad fractions (fr) 10:00 - utilidad repeat 11:00 - grid-gap y gap 18:45 - Usando auto-fit 20:00 - minmax 24:40 - Centrando elementos con align-items 26:05 - Usando masonry experimental con Firefox 34:30 - Infinite Scroll 37:50 - Añadir externalRef a useNearScreen 44:50 - Arreglando el loop infinito en el useEffect 45:45 - Usando debounce 51:00 - Añadiendo propiedad once a useNearScreen 59:00 - ¡Infinite Scroll conseguido! 01:01:47 - Explicando useCallback de React 01:14:40 - Testing con react-testing-library. 01:18:29 - Test básico: que tu app no pete! 01:28:08 - ¿Por qué la lógica en Javascript puro? 01:29:12 - ¿React Router vs. React lazy para code splitting? 01:31:49 - Pruebas unitarias sobre rutas que se cargan async 01:38:10 - waitForElement en testing-library 01:40:00 - Testeando eventos y formulario 01:52:37 - Despedida y agradecimientos Repositorio de código: https://github.com/midudev/react-live-coding #reactjs #frontend #css #cssGrid -~-~~-~~~-~~-~- ¡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 -~-~~-~~~-~~-~-