BeClaude

publishing-astro-websites

New
24Community RegistryDocumentationby Richard Hightower

Comprehensive guidance for building and deploying static websites with the Astro framework. This skill should be used when asked to create astro site, deploy astro to firebase, set up content collections, add mermaid diagrams to astro, configure astro i18n, build static blog, or astro markdown setup. Covers SSG fundamentals, Content Collections, Markdown/MDX, partial hydration, islands architecture, and deployment to Netlify, Vercel, GitHub Pages, or GCP/Firebase.

Community PluginView Source

Overview

A comprehensive Claude Code skill for building and deploying static websites with the Astro framework.

Overview

This skill provides guidance for Astro static site generation (SSG), covering:

  • Content Collections - Legacy patterns, Content Layer API (Astro 5.0), Custom Loaders
  • Syntax Highlighting - Shiki configuration, Transformers, Expressive Code
  • Diagram Integration - Mermaid, PlantUML, dark mode theming strategies
  • Client-Side Search - Pagefind (granular controls, weighting), Fuse.js comparison
  • Versioned Documentation - Starlight framework, multi-version patterns
  • Internationalization - i18n routing, fallback logic for missing translations
  • Common Patterns - Pagination, tag archives, RSS feeds, forms, JSON-LD, dark mode
  • Performance - Prefetching, Critical CSS (astro-critters), partial hydration
  • Testing - Vitest component testing, Playwright E2E, link checking
  • Deployment - Firebase, Netlify, Vercel, GitHub Pages, GCS + Cloud CDN

Installation

Clone this repository into your Claude Code skills directory:

bash
cd ~/.claude/skills
git clone https://github.com/SpillwaveSolutions/publishing-astro-websites-agentic-skill.git

Or add as a Git submodule to your existing skills:

bash
git submodule add https://github.com/SpillwaveSolutions/publishing-astro-websites-agentic-skill.git

Usage

Once installed, Claude Code will automatically use this skill when you ask about:

  • "Create an Astro site"
  • "Deploy Astro to Firebase"
  • "Set up content collections"
  • "Add Mermaid diagrams to Astro"
  • "Configure Astro i18n"
  • "Build a static blog"
  • "Astro markdown setup"

Structure

code
publishing-astro-websites-agentic-skill/
├── .claude-plugin/
│   └── marketplace.json
├── publishing-astro-websites/
│   ├── SKILL.md
│   └── references/
│       ├── deployment-platforms.md
│       └── markdown-deep-dive.md
├── .gitignore
└── README.md

Requirements

  • Claude Code CLI
  • Node.js 18+ (for Astro projects)

License

MIT

Author

Richard Hightower - SpillwaveSolutions

Install & Usage

1
Create the skills directory
mkdir -p .claude/skills
2
Download the skill file
mkdir -p .claude/skills && curl -o .claude/skills/publishing-astro-websites.md https://raw.githubusercontent.com/SpillwaveSolutions/publishing-astro-websites-agentic-skill/main/SKILL.md
3
Invoke in Claude Code
/publishing-astro-websites
View source on GitHub
deployment

Frequently Asked Questions

What is publishing-astro-websites?

Comprehensive guidance for building and deploying static websites with the Astro framework. This skill should be used when asked to create astro site, deploy astro to firebase, set up content collections, add mermaid diagrams to astro, configure astro i18n, build static blog, or astro markdown setup. Covers SSG fundamentals, Content Collections, Markdown/MDX, partial hydration, islands architecture, and deployment to Netlify, Vercel, GitHub Pages, or GCP/Firebase.

How to install publishing-astro-websites?

To install publishing-astro-websites, create the .claude/skills directory in your project, then run the curl command to download the skill file. Once installed, invoke it in Claude Code with /publishing-astro-websites.

What is publishing-astro-websites best for?

publishing-astro-websites is a community categorized under Documentation. It is designed for: deployment. Created by Richard Hightower.