Code structure

Code structure

The codebase is based on monorepo project structure. It comes with code modularity both solo makers and tech teams can benefit from.

For instance, you can create a reusable design system package that can be used in multiple apps (e.g. web, docs, or Chrome extension). This will make sure you avoid writing repetitive code.

Apps and Packages

There are two main folders in the root of the codebase - apps and packages.

- apps
  -- web
- packages
  -- database
  -- es-lint-config-custom
  -- tailwind-config
  -- tsconfig
  -- ui

Apps Folder

  • web: a Next.js app (the main one, used for demo purposes)

The codebase provides you with the Next.js app as a starting point but you can use other React-based frameworks too and still benefit from the codebase - packages are either Javascript/Typescript libraries (e.g. database or emailing) or React things (e.g. ui). Simply use the web app as a guide when creating your own apps.

Packages Folder

The packages folder contains a collection of reusable and ready-to-use packages used throughout the monorepo: