Libro Patrones Avanzados En React JS

Pasa al siguiente nivel de Seniority en React por medio de la guía más completa e interactiva.

Patrones avanzados react js

Para desarrolladores de React JS ⚛️

Con este libro te Ayudo a acelerar tu carrera profesional para que puedas:

🚀

Subir tu nivel de Seniority en nivel técnico.

🤓

Estar más preparado para un mejor trabajo y nuevos retos.

🤑

Aumentar tu sueldo al tener mayores conocimientos.

Vas a Aprender lo siguiente

Primero veremos un ejemplo de un problema a resolver, luego lo resolveremos sin el patrón y después aplicaremos el patrón para ilustrar las diferencias. Todo por medio de lo siguiente:

SOLID en React JS

Aplicar los principios S.O.L.I.D 🧐

Para poder crear componentes realmente reutilizables y extensibles.

Proceso de abstraccion

Aprender a Abstraer 🧠

Te muestro el proceso mental paso a paso al momento de analizar un problema de la vida real

Proceso de abstraccion

Usar los Hooks de manera avanzada ⚛️

Los hooks abren nuevos caminos y patrones únicos que sólo podemos aplicar en esta biblioteca.

Proceso de abstraccion

Los tipos de patrones y uso de la vida real 👩‍💻 🧑‍💻

Vas a dominar las dos categorías de patrones: de UI y de lógica.

Contenido del libro 📖

Este libro ha sido creado después de varios meses de un minucioso trabajo y edición para poder entregar la mayor calidad en cada línea de cada página, removiendo el relleno y la paja innecesaria.

Es el producto de lograr comprimir años de experiencia en React JS en ambientes profesionales de trabajo, de modo que puedas aprender rápido y fácil lo equivalente a este tiempo, pero en mucho menos tiempo.

A lo largo de las secciones del libro vas a tener acceso al código fuente de los ejemplos de cada patrón con la posibilidad de poder ejecutarlo y editarlo para que consolides mejor tu aprendizaje.

Índice

  • ¿Quién debería de leer este libro?
  • Mi promesa hacia ti
  • Introducción
  • Sobre los patrones en React
  • Patrones en React y principios SOLID
  • Custom Hooks Pattern
  • High Order Component (HOC)
  • Extensible Styles
  • Compound Component Pattern
  • Render Props Pattern
  • Control Props Pattern
  • Props Getters Pattern
  • State Initializer Pattern
  • State Reducers Pattern
  • Siguientes pasos

Porque el tiempo es importante, el contenido del eBook ha sido revisado varias veces para garantizar que contenga puro contenido de valor. Sin nada de paja o elementos repetitivos.

Custom hook pattern

⚛️ Custom Hook Pattern

Los custom hooks consisten en la posibilidad de crear nuestros propios hooks para poder reusar lógica de estado entre componentes, esto de una manera que antes no se podía hacer con los componentes solamente.

High Order Component pattern

⚛️ High Order Component (HOC) Pattern

El patrón High Order Component (componente de orden superior en español) nos provee de una manera de reusar comportamiento entre componentes y desde luego, su existencia es posible por la naturaleza composicional de React.

Exensible Styles pattern

⚛️ Extensible Styles

Los estilos son una parte inherente en el desarrollo frontend y con React no es la excepción.

Al momento de desarrollar nuestros componentes, además de asegurarnos de que sean reusables sin necesidad de cambiar su código, también debemos preguntarnos si sus estilos también son reusables y abiertos al cambio.

Compound Component Pattern

⚛️ Compound Component Pattern

Este patrón aprovecha al máximo la composición para que podamos implementar componentes muy flexibles que comparten un estado común pero haciendo que se comuniquen internamente sin necesidad de pasar props.

Render props pattern

⚛️ Render Props Pattern

“Un componente con una render prop toma una función que devuelve un elemento de React y lo llama en lugar de implementar su propia lógica de representación.”

Lo anterior puede ser reformulado a: delegar la responsabilidad de hacer el render usando una función que el componente recibe por props.

Control Props

⚛️ Control Props Pattern

Este patrón está inspirado en la manera en que funcionan los formularios controlados.

Imagina poder replicar esta lógica pero en cualquier componente, no solo en formularios. En esto consiste este patrón.

Props Getters

⚛️ Props Getters Pattern

El patrón props getters consiste en una manera de proveer un conjunto de props a los usuarios de tus componentes que van a necesitar en su implementación.

State Initializer Pattern

⚛️ State Initializer Pattern

Este es un patrón muy sencillo de implementar y consiste en proveer una manera para que el usuario de nuestro componente pueda definir el estado inicial y una vía para poder reiniciarlo.

State Reducers Pattern

⚛️ State Reducers Pattern

Este patrón consiste en otorgar al usuario el máximo control de cómo se debe actualizar el estado interno de un componente.

Sobre el autor 👋

Conoce un poco sobre mi.

SOLID en React JS

Juan Correa es un ingeniero de Software, autodidacta, curioso y muy bueno trabajando con equipos multidisciplinarios con 7 años de experiencia al momento de publicar este contenido.

Su principal actividad es la de trabajar en proyectos de alcance internacional, con equipos remotos al rededor del mundo.

Es editor de Ebooks, instructor en Udemy y YouTube así como bloguero utilizando principalmente su marca "Developero". Ha trabajado en SAAS y startups de Estados Unidos - México.

Garantía 👍

SOLID en React JS

Si en 30 días el libro no alcanza tus expectativas te regresamos el 100% de tu dinero.

Cuido mucho mi reputación y mi comunidad, por lo que puedes sentirte seguro de que si no cumplo con tus expectativas, puedas tener tu dinero de regreso.

Precio 👌

¡Tu compra es 100% segura! utilizo Gumroad, una plataforma que regula el proceso del pago y entrega del producto.

react patrones avanzados ebook

React JS Avanzado

1 Libro

De $30.00 USD

A $5.99 USD

  • ✅ Acceso digital al libro Patrones Avanzados en React JS en PDF.
  • ✅ Acceso al canal privado para resolver dudas.
  • ✅ Actualizaciones gratuitas.
  • ❌ Acceso digital al libro Introducción al testing en JavaScript en PDF.
  • ❌ Acceso digital al libro Introducción al Testing en React JS con Jest, React Testing Library y Cypress en PDF.
Comprar
ebooks react js pro

React JS Profesional

3 Libros

De $45.00 USD

A $8.99 USD

  • ✅ Acceso digital al libro Patrones Avanzados en React JS en PDF.
  • ✅ Acceso digital al libro Introducción al testing en JavaScript en PDF.
  • ✅ Acceso digital al libro Introducción al Testing en React JS con Jest, React Testing Library y Cypress en PDF.
  • ✅ Acceso al canal privado para resolver dudas.
  • ✅ Actualizaciones gratuitas.
Comprar

Preguntas frecuentes

¿Aprenderé a programar en React desde cero?

No, este libro es para personas que ya tengan experiencia trabajando con React y quieran pasar al siguiente nivel.

¿Qué tan extenso es el libro?

El libro Patrones Avanzados en React JS tiene 114 páginas dividido en los diferentes patrones avanzados, incluyendo links para hacer ediciones de código fuente como práctica. El libro de Introducción al Testing en JavaScript consta de 100 páginas que se dividen en herramientas de análisis estático de código, Jest y Mocks con Jest. El libro Introducción al Testing en React JS tiene 95 páginas dividido en Unit, Integration y e2e testing en React JS, usando Jest, Testing Library y Cypress. En total tenemos 309 páginas de contenido cuidadosamente resumido y de calidad para evitar el relleno sin sentido.

¿Este libro se quedará obsoleto si se actualiza React JS?

Un Rotundo no. Voy a tener el contenido actualizado en base a la versión estable de React dominante e incluso, conforme salgan más patrones, los voy a ir incluyendo y vas a tener estas actualizaciones completamente de por vida.

¿En este libro se hace una app completa o un proyecto?

No. En cambio, haremos mini apps para ver casos de uso comunes de aplicaciones.

El enfoque es ver ejemplos concretos y fáciles de aterrizar.

Haciendo una app completa nos desviaríamos mucho del objetivo principal por temas triviales al propósito del libro (como el setup, el BackEnd, etc).

¿Son estos patrones aplicables para otras bibliotecas o frameworks frontend?

Conceptualmente, los patrones están fundamentados por uno o varios de los principios SOLID, que son independientes de la tecnología. Pero los patrones que vemos en este libro son sólo posibles debido a que usamos las características de React JS, por lo que no son aplicables a otras bibliotecas como Vue JS o Angular.

¿Qué pasa si tengo dudas durante la lectura?

La compra del libro incluye el acceso a un grupo exclusivo de la comunidad para resolver dudas donde con gusto te apoyaré.