16. La estructura de una app construida con React

Cada día noto más ese golpe en las costillas que te dan los sistemas modernos de creación de aplicaciones.

Es suave, pero continuado. Pero me siento bien por ello. 😉

Aparte de este presunto gusto por el dolor, vayamos al grano: React es un framework no dogmático en su estructura.

Puedes crear tu aplicación siguiendo la configuración que te de la gana. Es más flexible, pero para los que venimos de plataformas donde no tienes que pensar en eso porque te lo dan hecho, se hace difícil acertar.

Lo correcto es empezar a pensar en hacerlo bien.

He repasado varios artículos al respecto, me quedo con este: How to better organize your React applications?.

Te advierto que lo recomiendo, pero luego he hecho lo que me ha dado la gana 😎

Aquí tienes la estructura:

Se parece en algo a lo que veíamos en el día 11, pero ya hemos incorporado más cosas. Es lo que tiene ir aprendiendo, que es un cambio constante:

• He colocado en services todo lo que se pueda reaprovechar desde los componentes. La conexión con la API es esencial en ese punto.
• En screens puedes ver las pantallas que están enlazadas en el Router (ver código)
• En components hay una amalgama de responsabilidades, pero al menos tengo eso como "campo base" para ir creciendo a medida que vaya creciendo la aplicación. Está pidiendo a gritos una carpeta common para asuntos como Header.js que es el componente de la barra de navegación.
• Probablemente App.js merezca estar dentro de src.

Desde luego el tema de los opinionated framework es un buen tema para un podcast, libre o premium. ¿Verdad?

Y tú, ¿cómo organizas tus aplicaciones? Cualquier comentario es bienvenido.