The official LibreFit website — a fully static Astro site deployed on Cloudflare Pages, with serverless Pages Functions handling contact forms, donations, and supporter code rewards.
| Layer | Technology |
|---|---|
| Frontend | Astro (static output) |
| Styling | Tailwind CSS v4 + Material Design 3 tokens |
| Backend | Cloudflare Pages Functions (TypeScript) |
| Database | PostgreSQL via Hyperdrive |
| Resend + Turnstile bot protection |
├── src/
│ ├── pages/ # .astro pages, all sharing the BaseLayout (header/footer/SEO)
│ ├── components/ # Header, Footer, SeoHead
│ ├── layouts/ # BaseLayout.astro
│ ├── scripts/ # Client-side TypeScript
│ └── styles/ # global.css — single Tailwind entry + MD3 design tokens
├── functions/ # Cloudflare Pages Functions (backend API)
├── templates/ # Plain HTML templates for worker-rendered pages + their Tailwind entry
├── public/ # Static assets (logo, fonts, PGP key, robots.txt, build artifacts)
└── astro.config.ts
The build emits flat .html files (privacy.html, 404.html,
contact-result/contact-success.html, …), preserving the exact URL structure of the
previous pure-HTML site so no legacy link breaks. A sitemap is generated automatically
on every build (noindex transactional pages excluded).
Prerequisites: Node.js 22 (see .nvmrc).
# 1. Install dependencies
npm install
# 2. Frontend-only development server
npm run dev
# 3. Full site preview (frontend + backend functions)
# Required to test the contact form and other API routes locally.
npm run preview:cf
npm run preview:cfbuilds the site, then servesdist/through the Wrangler Pages dev server together with the functions.
| Command | Purpose |
|---|---|
npm run dev |
Astro dev server (frontend only) |
npm run build |
Production build (site + worker-template CSS) |
npm run preview |
Preview the static build without backend functions |
npm run preview:cf |
Build + serve with backend functions via Wrangler |
npm run check:functions |
Type-check the Pages Functions |
Styling is Tailwind CSS v4 (CSS-first, no tailwind.config.js) with the
Material Design 3 token system:
src/styles/global.css— the single design-system entry. It imports Tailwind, maps every MD3 color/elevation/shape/motion token into Tailwind's@themenamespaces (text-primary,bg-surface-container,shadow-elev-*,ease-emphasized, custom breakpointssm:600 px /lg:900 px), defines typography utilities (md-typescale-*) and the shared MD3 component classes (.md-filled-button,.md-text-field, …) in@layer components.templates/app.css— a second Tailwind entry for the worker-rendered pages (/status.html,/error.htmlunder templates). It importsglobal.cssand compiles topublic/styles.cssso those pages share the exact same design system.public/styles.cssis a build artifact, regenerated bynpm run build:templates-cssas part of everynpm run build.
Pages use Tailwind utilities directly in markup. Only primitives reused across pages —
MD3 buttons/chips, the typography scale, and the reveal/animate-hero animations —
stay as component classes, since they rely on state layers/ripples that don't map 1:1
to utilities.
Pages Functions provide the dynamic endpoints:
/contact— contact form: Turnstile verification, PGP-encrypted message delivery via Resend, optional public key attachment./donations/*— donation creation, status, and payment-provider webhooks./contributors/*and/translators/*— login, status, and webhook endpoints backed by PostgreSQL (through theHYPERDRIVEbinding, see wrangler.toml).
Secrets and bindings are configured in the Cloudflare dashboard, not in this repository.
LibreFit is licensed under the GNU General Public License v3.0 (GPL-3) and is subject to these additional terms.
In short, this means you are free to use, modify, and distribute the code, but you must:
- Share your changes: if you distribute a modified version, you must also license it under the GPLv3.
- Give credit: keep the original copyright notice and attribute the original work to LibreFit.
- Mark your changes: clearly indicate that your version is a modification of the original.
- Do not use the brand: you cannot use the name "LibreFit" or its logo to promote your modified version.
The "LibreFit" name and logos are trademarks. All Rights Reserved.
Their use is governed by the Trademark Policy and applies to the
relevant files in public/assets.