Scribd
Cargar
18 vistas75 páginas

Guía Completa de React y Redux

El documento aborda diversos aspectos de React y su ecosistema, incluyendo ReactNative, componentes reutilizables, manejo de estado, formularios, y navegación. También se discuten conceptos avanzados como Redux, creación de hooks, y el uso de TypeScript. Se mencionan buenas prácticas y consideraciones para evitar problemas de rendimiento y dependencias en la estructura del proyecto.

Cargado por

Alucard
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como DOCX, PDF, TXT o lee en línea desde Scribd
18 vistas75 páginas

Guía Completa de React y Redux

El documento aborda diversos aspectos de React y su ecosistema, incluyendo ReactNative, componentes reutilizables, manejo de estado, formularios, y navegación. También se discuten conceptos avanzados como Redux, creación de hooks, y el uso de TypeScript. Se mencionan buenas prácticas y consideraciones para evitar problemas de rendimiento y dependencias en la estructura del proyecto.

Cargado por

Alucard
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como DOCX, PDF, TXT o lee en línea desde Scribd

1.

Básico

También existe ReactNative para móviles.


2. Componentes reutilizables
3. Estado
4. Formularios
5. APIs
6. Context
7. Estructura proyecto
8. Diseño de componentes
9. Captura de eventos en el documento
10. Navegación

Se rerenderiza el componentes cada vez que el usuario utiliza las flecha adelante o atrás del
navegador.
La función navigate se utiliza para realizar navegaciones automáticas que no dependen
directamente de la interacción del usuario, también se utiliza para cambiar el comportamiento
de los tags <a> dentro dela aplicación.
11. Uso de createPortal
12. Ordenación en tablas
13. Creación de hooks
14. useReducer
15. Redux 1
Los slices son los que evitan tener que escribir todo este código extra que tenemos que escribir
al usa el hook useReducer.
Dentro de Redux se incluye el uso de la librería Immer.
Para modificar dos estados de diferentes slices se pueden seguir los siguientes pasos:

El problema de esta lógica es que se crea una dependencia entre dos slices diferentes.
Debido a esto es mejor crear una nueva acción independiente y usarla en los extraReducers de
cada slice:
La estructura mediante Features puede llevar a problemas de dependencias circulares en los
imports.
16. Redux 2

17. Redux data fetching


18. Typescript
19. React Router Dom
Anexo

En React el estado no se actualiza instantáneamente al usar la función setter, esto puede llevar
a algunos bugs en ciertas situaciones (clicks muy rápidos, por ejemplo). Para solucionarlo se
puede invocar la función setter de la siguiente forma:

Convención de nombres en componentes controlados:

Para saber el tiempo en el que se están renderizando ciertos componentes o ejecutando


eventos se puede utilizar la función [Link]() que almacena el tiempo que ha
pasado desde que se ha cargado la página. El tiempo se puede almacenar en [Link],
[Link], etc. Más info en el vídeo 20 de la unidad 12.

También podría gustarte