Skip to main content
Independent training resource — Not an official FAA or U.S. government website.
Flight Desk

Publish

GitHub Pages website

Develop, validate, and deploy the Astro learning site through GitHub Actions.

The repository includes a static Astro website styled with Tailwind CSS. It renders the curated Markdown library and provides browser-based study-card and mock-exam workflows. Learner state remains in the browser's localStorage; the site has no server, account system, analytics, or data upload.

Implementation follows Astro's official GitHub Pages deployment guide and Tailwind CSS's official Vite integration.

Local development

Requirements: Node.js 20 or newer and npm.

npm ci
npm run dev

Astro serves the site at /, matching the custom-domain deployment. Use the URL printed by Astro without appending a repository-name path.

Run a production build and preview:

npm run build
npm run validate:site
npm run preview

The generated site is written to the ignored site-dist/ directory. CLI output is separately written to dist-cli/.

Run the complete source, type, build, and static-link suite with npm run check. After installing Playwright Chromium once (npx playwright install chromium), run browser interaction tests with npm run test:e2e.

Deployment

The workflow at .github/workflows/deploy-pages.yml validates the CLI, curriculum, mock exams, and Astro build before uploading the static artifact. It runs on pull requests for validation and deploys pushes to main.

In the GitHub repository:

  1. Open Settings → Pages.
  2. Set Source to GitHub Actions.
  3. Set Custom domain to faadroneoperator.com and enable Enforce HTTPS.
  4. Push or merge to main, or run the workflow manually.
  5. Visit https://faadroneoperator.com/ after deployment.

The workflow sets Astro's site to the custom domain and its base to /. The public/CNAME file preserves the domain declaration in the static artifact; all internal links and bundled assets are generated from the domain root.

Site architecture

  • web/layouts/ contains the document shell.
  • web/components/ contains small reusable navigation, content, form, progress, and quiz components.
  • web/pages/ contains static routes.
  • web/lib/documents.ts curates and renders source Markdown at build time.
  • web/scripts/quiz-app.ts owns accessible browser quiz/exam state.
  • web/styles/global.css defines Tailwind design tokens and document typography.
  • tools/validate-site.ts verifies production routes, assets, base paths, and quiz payloads.

Quiz behavior and privacy

  • Study mode filters by ACS Area/topic/count and reveals explanations after an answer.
  • Exam mode uses fixed Forms A/B, a 120-minute timer, and delays explanations until submission.
  • Both modes use the existing deterministic seeded answer ordering.
  • Active sessions and the last 50 summary results are saved only on the current device. Clearing site data removes them.
  • Keyboard shortcuts are 1–4 for answers, arrow keys for navigation, and F to flag a question.

The web application consumes the same canonical JSON as the CLI. Do not edit generated question data by hand; rebuild it through the existing tools and run the complete validation suite.

USWDS theme

The site installs the official @uswds/uswds package and imports its compiled styles before project-level Tailwind tokens. Shared components adapt USWDS typography, colors, focus indicators, buttons, forms, cards, navigation, prose, and identifier patterns to the Part 107 learning workflow.

Because faadroneoperator.com is an independent .com educational site, it must not display the official U.S. government banner or imply FAA endorsement. The layout instead presents an explicit independent-resource disclosure above the header and repeats the ownership statement in the footer identifier.