← Back to Blog
development

Navigating Your New Project

After cloning the template, you'll see a lot of files. Here's a map of what's where and what each piece does.

Root Files

FilePurpose
package.jsonRoot workspace config (Bun workspaces)
bunfig.tomlBun isolated linker for version-split deps
.gitignoreGit ignore rules
.env.exampleEnvironment variable template
plan.mdFull architecture and project plan
monorepo-docs.mdDeveloper documentation
deployment-reference.mdCloudflare deployment guide

The apps/ Directory

Each app has a standard Astro structure:

apps/<name>/
├── src/
│   ├── components/    # Vue SFCs and Astro components
│   ├── layouts/       # Astro layout components
│   ├── lib/           # Shared utilities
│   ├── pages/         # Route pages and API routes
│   └── styles/        # Global CSS
├── public/            # Static assets
├── astro.config.mjs   # Astro configuration
├── wrangler.jsonc     # Cloudflare Pages config
├── tsconfig.json      # TypeScript config
└── package.json       # App dependencies

The packages/ Directory

Shared code between apps:

  • keystatic-config/ — Collection schemas. Edit these to add/remove content types.
  • site-config/ — Typed configuration. Edit index.ts to change site settings.

The content/ Directory

All your website content lives here as Markdoc files:

content/
├── blog/          # Blog posts (.mdoc)
├── pages/         # Freeform pages
├── services/      # Service listings
├── portfolio/     # Portfolio entries
├── team/          # Team member profiles
├── testimonials/  # Client testimonials
├── faqs/          # Frequently asked questions
└── clients/       # Client logos/names

The .ai/ Directory

AI development tooling — rules, specs, contracts, and session memory. Used by AI agents to assist with development. You can ignore this directory if you're not using AI-assisted development.

Next: how to author content with Keystatic.