Project Bootstrap

How to start a new project from scratch (not cloning the template).

---

Install

npm create astro@latest <project-name>
# Choose: Empty template, TypeScript strict, install deps
cd <project-name>

npm install @tailwindcss/vite @astrojs/sitemap
npm install -D @tailwindcss/typography
npm install @fontsource/inter @fontsource/plus-jakarta-sans

---

astro.config.mjs

import { defineConfig } from "astro/config";
import tailwindcss from "@tailwindcss/vite";
import sitemap from "@astrojs/sitemap";

export default defineConfig({
  site: "https://<production-domain>",
  integrations: [sitemap()],
  vite: { plugins: [tailwindcss()] },
});

Set site to the production domain on day one. This is used for canonical URLs and the sitemap.

---

src/styles/global.css

@import "@fontsource/inter/400.css";
@import "@fontsource/inter/500.css";
@import "@fontsource/inter/600.css";
@import "@fontsource/plus-jakarta-sans/600.css";
@import "@fontsource/plus-jakarta-sans/700.css";
@import "@fontsource/plus-jakarta-sans/800.css";
@import "tailwindcss";
@plugin "@tailwindcss/typography";

@theme {
  --color-brand-50: #f0fdf4;
  --color-brand-100: #dcfce7;
  --color-brand-200: #bbf7d0;
  --color-brand-300: #86efac;
  --color-brand-400: #4ade80;
  --color-brand-500: #22c55e;
  --color-brand-600: #16a34a;
  --color-brand-700: #15803d;
  --color-brand-800: #166534;
  --color-brand-900: #14532d;
  --color-brand-950: #052e16;

  --font-sans: "Inter", system-ui, sans-serif;
  --font-display: "Plus Jakarta Sans", "Inter", sans-serif;
}

---

wrangler.toml (project root)

name = "<project-slug>"
compatibility_date = "2025-06-23"
pages_build_output_dir = "dist"

---

public/robots.txt

User-agent: *
Allow: /
Disallow: /checkout
Disallow: /payment-return
Disallow: /thank-you

Sitemap: https://<production-domain>/sitemap-index.xml

---

public/_redirects

https://www.<domain>/* https://<domain>/:splat 301

---

Initial file structure

src/
  layouts/Layout.astro
  components/Nav.astro
  components/Footer.astro
  pages/
    index.astro
    about.astro
    contact.astro
    thank-you.astro
    privacy-policy.astro
    terms.astro
    404.astro
    services/
      web-design.astro
      seo.astro
      hosting.astro
    blog/
      index.astro
      [slug].astro
  content/
    blog/
  styles/
    global.css

functions/
  api/payment/
    create-order.ts
    verify.ts

public/
  _headers
  _redirects
  robots.txt
  favicon.svg
  og-image.jpg
  logo.svg

wrangler.toml
astro.config.mjs
package.json

---

Git setup

git init
git add .
git commit -m "feat: initial project scaffold"

Create the repo on GitHub, push, then connect in Cloudflare Pages.