Project Structure
Learn how to navigate the codebase of the starter kit.
Achromatic uses Turborepo and pnpm workspaces to enforce a modern monorepo structure.
About Turborepo Turborepo is a high-performance build tool for monorepos, boosting speed with smart caching, parallel builds and incremental compilation. It simplifies managing multiple apps and packages and enables task workflows. Owned and maintained by Vercel, it ensures seamless integration with Next.js.
Workspaces
The monorepo is divided into three main workspaces:
packages:
- "apps/*"
- "packages/*"
- "tooling/*"- Apps: Applications, such as the marketing website or dashboard.
- Packages: Shared packages, basically all your libraries.
- Tooling: Configurations for ESLint, Prettier, Tailwind and TypeScript.
Folders
- apps
- packages
- tooling
- turbo
App workspace
| Directory | Purpose |
|---|---|
/apps | Applications (everything that can be executed) |
/apps/dashboard | Main web application |
/apps/marketing | Marketing pages |
/apps/prisma-studio | Visual Database Editor from Prisma |
/apps/react-email-preview | To preview the React Email templates |
/apps/requirements-check | Script to make sure you have min versions installed |
Packages workspace
| Directory | Purpose |
|---|---|
/packages | Packages (everything that can be installed into your apps) |
/packages/api-keys | Generate and consume api keys for a public API |
/packages/auth | Auth.js configuration, organizations and invitations |
/packages/billing | Logic to handle the billing and payments |
/packages/common | Tiny library for shared errors and type guards |
/packages/database | Contains your Prisma schema, client and migrations |
/packages/email | Logic to send emails and resolve the right provider |
/packages/email-templates | React Email templates |
/packages/image-processing | Resizing and conversion of images using the sharp library |
/packages/markdown | Helpers to render markdown to HTML and the other way around |
/packages/rate-limit | Rate limiters to protect your application from brute-force |
/packages/routes | Common route object to be able to link dashboard and marketing together type-safe |
/packages/ui | The design system based on shadcn/ui (components, hooks, styles) |
/packages/webhooks | Helpers to send webhooks |
Tooling workspace
| Directory | Purpose |
|---|---|
/tooling | Configurations for your monorepo |
/tooling/eslint-config | Linting rule-sets using ESLint |
/tooling/prettier-config | Formatting rules using Prettier |
/tooling/tailwind-config | Shared tailwind config |
/tooling/typescript-config | Typescript presets for different use-cases |
Namespace prefix
The namespace prefix is @workspace/*. This is the same as in the shadcn monorepo setup.
Turborepo uses @repo/* in their docs. This is also a good choice, we opted for @workspace/* like shadcn instead. If you want, you can also use your project name such as @acme/* as the namespace prefix.