Esta es el arreglo más acertada que te podemos dar, pero primero obsérvala pausadamente y valora si es compatible a tu proyecto.
Solución:
Creo que esa no sería la mejor práctica. El nombre del archivo debe ser el mismo que el del componente React y debe estar escrito en PascalCase.
Por ejemplo: Navigation.jsx exportaciones Navigation
Lectura adicional sobre convenciones de nomenclatura:
- Hackernoon en Medium
- Pregunta de desbordamiento de pila
Prima: Estructuración de archivos y carpetas en un proyecto de React:
-
¡Hurra, Hackernoon otra vez!
-
Publicación de Alexis Mangin
-
Probablemente no necesites leer esto si no usas redux, pero tiene una buena comparación entre función-primero y primera función técnicas de agrupación. Publicación de Alex Moldovan
Editar: Del sitio web oficial de nextjs
Next.js servirá cada archivo en
/pagesbajo un nombre de ruta que coincida con el nombre del archivo.Por ejemplo,
/pages/about.jsse sirve ensite.com/about.
Por lo tanto, en el caso de Nextjs, querían separar los archivos de componentes y de página, ya que los archivos de página se utilizan para el enrutamiento.
Creo que es lo mismo que todos los marcos de javascript, eso debería ser
- Los componentes de presentación y contenedor se mantienen en src/components Componentes de grupo por módulo/característica.
- Mantenga los componentes genéricos dentro de src/components/UI Mantenga las pantallas simples, con una estructura y un código mínimos.
- Elemento de la lista Agrupe las pantallas de acuerdo con la definición de la ruta. Para una ruta /usuario/lista tendríamos una pantalla ubicada en /src/screens/User/List.jsx.
algo como esto Finalmente, nuestra aplicación quedaría estructurada así
aquí hay un recurso valioso para tomar como referencia
Sección de Reseñas y Valoraciones
Si para ti ha resultado de ayuda este artículo, sería de mucha ayuda si lo compartes con más juniors así nos ayudas a dar difusión a este contenido.