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.