My Updated Next.js Setup
Published ....
Last modified ....
Share this post on BlueskySee discussion on Bluesky
This is an update to one of my previous blog posts published in January of 2022 here
I've been tinkering with the Layouts features and functionality within Next for quite some time now, and even had the time to refactor this personal site to use the new features. With all that tinkering I figured I would share some of the things that I'm generally doing with my Next.js apps.
Some of this is still a bit rough around the edges, and I’m sure I’ll be re-thinking some of these ideas in the future as well, but I’ll aim to post updates as I make them.
On Directories:
I used to really like the src/ directory functionality within Next, it let me colocate all my things into a single place, making the codebase a bit easier to look at. However since originally the app directory functionality within Next (aka Layouts) didn’t support the same setup, I’ve decided to drop that paradigm.
I’ve now centered around the following directories (roughly):
app/- for pages and layoutslib/- for shared functionality like hooks or other logicstyles/- for styles, see On Styles below for more detailsui/- for shared components within the applicationscripts/- for shared project scripts, these are usually.mjsfiles