Aprender patrones de diseño de JavaScript, 2ª edición

Capítulo 14. Estructura de la aplicación para React.js

Este trabajo se ha traducido utilizando IA. Agradecemos tus opiniones y comentarios: [e-mail]

Cuando se construyen pequeños proyectos de hobby o se prueba un nuevo concepto o biblioteca, los desarrolladores pueden empezar a añadir archivos a una carpeta sin un plan ni una estructura organizativa. Estos pueden incluir CSS, componentes de ayuda, imágenes y páginas. Una única carpeta para todos los recursos se vuelve inmanejable a medida que el proyecto crece. Cualquier base de código de tamaño respetable debe organizarse en una estructura de carpetas de aplicación basada en criterios lógicos. La decisión sobre cómo estructurar tus archivos y componentes de la aplicación podría ser una elección personal/de equipo. En general, también dependería del dominio de la aplicación y de la tecnología utilizada.

Este capítulo se centra principalmente en las estructuras de carpetas para aplicaciones React.js, que podrían ayudarnos a gestionar mejor nuestros proyectos a medida que crecen.

Introducción

El propio React.js no proporciona a una directriz sobre la estructuración de proyectos, pero sí sugiere algunos enfoques de uso común. Veámoslos y comprendamos sus pros y sus contras antes de hablar de estructuras de carpetas para proyectos con complejidades añadidas y aplicaciones Next.js.

A alto nivel, puedes agrupar archivos en una aplicación React de dos formas:

Agrupar por función

Crea carpetas para cada módulo, ...