mofa-site

Scaffold static websites and lesson sites from content using multiple template families.

11|12|Updated Feb 28, 2026
One-click install
npx skills add https://github.com/mofa-org/mofa-skills --skill mofa-site
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mofa-site
Source: https://github.com/mofa-org/mofa-skills/tree/main/mofa-site
Command: npx skills add https://github.com/mofa-org/mofa-skills --skill mofa-site

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

The mofa-site Skill automates the generation of static websites and lesson sites from content or references, reducing manual scaffolding time and ensuring consistency across templates.

Core Features & Use Cases

  • End-to-end scaffolding for Quarto lessons, Astro sites, Next.js apps, and React/Vite shells.
  • Deterministic templates sourced from reference patterns to accelerate site production.
  • Studio-backed preview and live file tree to inspect and customize the scaffold.

Quick Start

Run the bootstrap script to generate a starter site scaffold from your content.

Frequently Asked Questions about mofa-site

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I scaffold a static website from existing content automatically?▼

You can scaffold a static website from content by running a bootstrap script that generates a starter site structure. The process automates file tree creation and template application to produce a ready-to-customize site preview.

Can I use this to generate a Quarto lesson site or an Astro documentation site?▼

Yes, you can generate both Quarto lesson sites and Astro sites. The scaffolding supports multiple template families including Quarto-lesson, astro-site, nextjs-app, and react-vite pipelines to match your specific framework.

What is the best way to build a Next.js app shell from reference patterns?▼

The best way to build a Next.js app shell is using deterministic templates sourced from reference patterns. This accelerates site production by applying proven structures directly to your content generation workflow.

Do I need to manually configure preview routing for my generated Next.js or Astro site?▼

No, you do not need to manually configure preview routing. The scaffolding process automatically handles preview routing under the /sites/<site-slug>/ path for end-to-end delivery of your generated site.

What artifacts are generated when scaffolding a React-Vite website?▼

Scaffolding a React-Vite website produces artifacts like a site-plan and a content overview. These artifacts support end-to-end delivery by providing a structured blueprint of your generated site architecture.

How does the Studio-backed preview work when building lesson sites?▼

The Studio-backed preview provides a live file tree to inspect and customize the scaffold. It allows you to view and modify the generated static site files directly before final deployment.