Printer Logo


2. Suggested Structure

In general, I suggest storing components in the “components” folder. Furthermore, each core feature or page is structured in it's own folder inside components as well too. A trivial example would be a profile page consisting of several pages.

λ Store components for displaying a profile based on page nomenclature
λ printer component components/profile/edit/banner
λ printer component components/profile/edit/bio

λ Use absolute page paths for extra clarity
λ printer component components/profile/[username]/banner
λ printer component components/profile/[username]/bio

While styled-components are available for code generation with Printer. I still suggest writing pure SCSS. Or bringing in a templating system to your project. SCSS is optimal for preloading for both SSG and SSR compared to styled-components.

λ Debug SSG SCSS with the yarn scss command
λ yarn scss

Furthermore, assets such as images, videos and other forms of media should stay in the public/assets folder. I've found that preloading assets (with XHR) and managing loading states on components is far more optimal.

λ /public/assets/image
λ /public/assets/video
λ ...