LogoLogoLogoLogo

Folder Structure

Learn how the PaceKit project is organized by features

Ever spend time hunting for a file you know exists? PaceKit is structured to avoid that problem. The project is organized around features, not random folders, so related code lives together.

This makes it easier to understand the codebase, navigate quickly, and focus on building instead of searching.

Below is a high level view of how the project is laid out.

image-generations.tsx
...
...
...
package.json

Key Directories & Files

Root Level

  • content/docs: This is where all your markdown files for documentation lives. It's set up to work with Fumadocs, allowing you to easily create beautiful docs for your users or team.
  • public: A standard directory for static assets like images, fonts, and favicons. Anything placed here is served directly.
  • scripts/reset: Contains a handy script for seeding your database and storage with test data. Perfect for quickly resetting your local environment during development.

Source Directory

This is the heart of your application code.

  • src/components: Holds all your reusable UI components (e.g., SignIn, Form) that are shared across pages and features.
  • src/features: This is where the core modular logic lives. Each feature is designed to be self-contained.
    • auth: Handles everything related to user authentication like sign-in/up pages, session management, password reset flows, and API routes.
    • database: Contains your Drizzle ORM schema, migration files, and any database helper functions.
    • docs: Contains components and logic specifically for rendering the documentation pages from the content/docs folder.
    • storage: Contains the logic for handling file uploads and interacting with your S3 compatible storage services.
  • src/lib: A library for your helper functions and utility code that can be used anywhere in the app (e.g., date formatting, string manipulation).
  • src/routes or src/app: This is where file-system Based Routing works its magic. The folder and file structure here directly maps to the URL routes in your application.
  • src/styles: Your global stylesheets, Tailwind CSS configuration, and any other styling related files go here.

Config Files

  • drizzle.config.ts: The configuration file for Drizzle ORM. This tells Drizzle how to connect to your database for generating and running migrations.
  • source.config.ts: The configuration file for Fumadocs, which powers your documentation pages.

On this page