NextJS folders structure

user_14701145 0
Viewed 3387

I'm migrating ReactJS to NextJS because of the need for SEO, in my project I was organizing my files by the context of example pages.

    src
    _ components
    _ _ Footer
    _ _ _ index.js
    _ _ _ Footer.modules.scss
    _ _ Header
    _ _ _ index.js
    _ _ _ Header.module.scss
    _pages
    _ _ Home
    _ _ _ components
    _ _ _ _ Banner
    _ _ _ _ _ index.js
    _ _ _ _ _ Banner.module.scss
    _ _ _ _ More...
    _ _ _ index.js
    _ _ _ Home.module.scss
    _ _ More...

But in NextJS the routing is done on the basis of organizing the files into pages, and components can no longer be together with pages. how do I organize my components referring to their pages? maintaining this concept of an organization that brings together everything that is part of a context.

I've researched a lot about it but I haven't found anything and in every example, I see all the components are together in the same components folder in the root of src.

I read about Next Right Now they talk about it, but I don't know if I'm on the right path.

Sorry for the English, "google translator".

next.js reactjs
1 Answers

I'm doing like this:

    src
    _ modules
    _ _ common
    _ _ about
    _ _ contact-us
    _ _ photos
    _ _ _ PhotosPage.js
    _ _ _ PhotosPage.messages.js
    _ _ _ PhotosPage.module.scss
    _ pages
    _ _ about.js // refers to '../modules/about/AboutPage.js
    _ _ contact-us.js
    _ _ photos.js // refers to '../modules/photos/PhotosPage.js
user_9211930
Related