Structure

For the front-end of our architecture we keep our structure simple and consistent. On this page you'll find everything you need to know!

Folders

All of the following folders will be inside the frontend folder:

/components -> custom components in the project (like Button.js / Button.module.scss)

/context -> optional folder when using React Context

/hooks -> optional folder when using custom hooks

/pages -> default folder for all pages in Next.js

/public -> default folder for static assets (images, fonts, SVGs etc)

/sections -> default folder for all sections used with hydrate

/styles -> optional folder for general styling (resets, color definitions etc)

/utils -> optional folder for utilities that are not hooks

Additional folders are alowed and ideas to improve this structure are welcome!