Astro Site

The public RuForge site in website/ is Astro 5 static output, deployed to Cloudflare Pages.

Astro owns the landing page, changelog, roadmap, legal markdown pages, and docs routes. Most layout is .astro components; interactive bits (header mega-menu, hero underline) hydrate as React islands with client:visible or client:load.

Docs IA is data-driven. sitePages.ts registers template pages; built-with tools add a dedicated route at website/src/pages/docs/built-with/[tool].astro that reads copy from builtWithPages.ts. Section indexes under [section]/index.astro list siblings from the same registry.

Built-with pages pull live repo snippets at build time: readCodeSnippet.ts slices real source from one directory up (repo root), Shiki highlights them, and CodeSnippetPanel renders collapsible blocks. No hand-copied code in markdown.

Build output is static HTML/CSS/JS (astro build). No server on Pages. The site version badge tracks app semver but the site can ship on its own cadence.

In the repo

// @ts-check
import { defineConfig } from 'astro/config';
import react from '@astrojs/react';
import tailwindcss from '@tailwindcss/vite';
import sitemap from '@astrojs/sitemap';
import { qrcode } from 'vite-plugin-qrcode';

// https://astro.build/config
export default defineConfig({
  site: 'https://ruforge.app',
  integrations: [
    react(),
    sitemap({
      changefreq: 'weekly',
      priority: 0.7,
      lastmod: new Date(),
      filter: (page) => !page.includes('/m/'),
    }),

---
import BaseLayout from '../../../layouts/BaseLayout.astro';
import BuiltWithPageTemplate from '../../../components/BuiltWithPageTemplate.astro';
import {
  findBuiltWithPage,
  getBuiltWithNavContextForSlug,
  getBuiltWithStaticPaths,
} from '../../../lib/builtWithPages';

export function getStaticPaths() {
  return getBuiltWithStaticPaths().map(({ tool }) => ({
    params: { tool },
  }));
}

const slug = Astro.params.tool!;
const page = findBuiltWithPage(slug);

if (!page) {
  return Astro.redirect('/docs/built-with');
}
---

<BaseLayout
  title={page.title}
  description={page.lead}
  builtWithNav={getBuiltWithNavContextForSlug(slug)}
>
  <BuiltWithPageTemplate page={page} />
</BaseLayout>

function withCodeExamples(page: Omit<BuiltWithPage, 'codeExamples'>): BuiltWithPage {
  const examples = builtWithCodeExamples[page.slug];
  return examples?.length ? { ...page, codeExamples: examples } : page;
}

Where it shows up

website/astro.config.mjs with @astrojs/react and Tailwind Vite plugin
website/src/pages/ including docs/built-with/[tool].astro
BuiltWithPageTemplate.astro, ContentPageTemplate.astro, BaseLayout.astro
website/src/lib/builtWithPages.ts page copy and snippet registry