astro-framework

Agent Skills for building with Astro

Instalación
CLI
npx skills add https://github.com/delineas/astro-framework-agents --skill astro-framework

Instala esta habilidad con la CLI y comienza a usar el flujo de trabajo SKILL.md en tu espacio de trabajo.

Última actualización 4/22/2026

Astro Framework Agents

Agent Skills for building with Astro. Compatible with Claude Code, Cursor, Cline, OpenAI Codex, and other agents supporting the Agent Skills specification.

Agent Skills
License: MIT


Subscribe to Web Reactiva Newsletter — Weekly insights on web development, AI tools, and modern frameworks.


Why Astro?

Astro made me fall in love with web development again.

After years of complexity, heavy frameworks, and JavaScript fatigue, Astro reminded me that the web can be simple, fast, and beautiful. It embraces HTML as a first-class citizen. It ships zero JavaScript by default. It lets you use React, Vue, Svelte, or Solid—or none of them—without judgment.

Astro is plural: it welcomes every developer, every framework, every approach. Astro is universal: it works for blogs, docs, e-commerce, and everything in between. Astro is honest: it doesn't pretend the web is something it's not.

This repository is my way of sharing that love with the AI tools we use every day.

Dani Primo


Available Skills

Skill Description Install
astro-framework Comprehensive Astro framework development guide for islands architecture, content collections, SSR, and view transitions npx skills add delineas/astro-framework-agents/astro-framework
learning-astro Interactive tutorial to learn Astro by building a personal blog — 3 guided lessons with concepts, reflections, and hands-on code npx skills add delineas/astro-framework-agents/learning-astro

Quick Start

Install a Single Skill

npx skills add https://github.com/delineas/astro-framework-agents --skill astro-framework
npx skills add https://github.com/delineas/astro-framework-agents --skill learning-astro

Manual Installation

Clone the repository and copy the desired skill folder to your agent's skills directory:

git clone https://github.com/delineas/astro-framework-agents.git
cp -r astro-framework-agents/skills/astro-framework ~/.claude/skills/
cp -r astro-framework-agents/skills/learning-astro ~/.claude/skills/

Repository Structure

astro-framework-agents/
├── README.md
├── LICENSE
└── skills/
    ├── astro-framework/        # Astro framework reference skill
    │   ├── SKILL.md            # Main skill instructions
    │   ├── AGENTS.md           # Compiled guidelines
    │   ├── references/         # Detailed reference docs (14 files)
    │   └── rules/              # Context-specific rules (9 files)
    └── learning-astro/         # Interactive Astro tutorial skill
        ├── SKILL.md            # Tutoring protocol and lesson structure
        ├── guides/             # Step-by-step lesson guides (3 lessons)
        ├── reflect/            # Reflection moments between parts (9 files)
        ├── concepts/           # Deep dives on Astro fundamentals (4 files)
        └── help/               # Common errors and verification procedures

Skills Overview

astro-framework

A reference skill for experienced developers building with Astro. Covers islands architecture, content collections, SSR adapters, view transitions, server islands, sessions, actions, i18n, and more. Designed to be consulted while writing Astro code — it provides decision frameworks, code patterns, and rules for Astro 5+/6+.

learning-astro

An interactive tutorial skill that teaches Astro from scratch by building a personal blog. Designed for beginners and developers coming from other frameworks.

3 lessons (~45 min each):

  1. Your First Astro Site — Pages, components, layouts, styling
  2. Content & Dynamic Routes — Content collections, blog posts, RSS
  3. Interactivity & Launch — Islands, view transitions, deployment

How it works:

  • Adapts to the user's experience level (beginner / knows other frameworks / knows Astro)
  • Follows a Discover → Build → Reflect rhythm
  • Uses the astro-framework skill for technical accuracy
  • Queries the Astro docs MCP for questions beyond the tutorial

Creating a New Skill

  1. Create a new directory under skills/:
mkdir -p skills/my-new-skill
  1. Create the required SKILL.md with frontmatter:
---
name: my-new-skill
description: Description of what this skill does and when to use it.
license: MIT
metadata:
  author: your-name
  version: "1.0.0"
---

# My New Skill

Instructions for the agent...
  1. (Optional) Add supporting files:

    • references/ - Detailed reference documentation
    • rules/ - Context-specific rules with glob patterns
  2. Update this README to include your new skill in the table.

Skill Format Specification

Each skill follows the Agent Skills Specification:

Required Files

  • SKILL.md - Main skill file with YAML frontmatter and instructions

Required Frontmatter

---
name: skill-name          # Must match directory name
description: "..."        # What it does and when to use it
---

Optional Frontmatter

---
license: MIT
metadata:
  author: your-name
  version: "1.0.0"
  category: framework
  tags: tag1, tag2
compatibility: Requires Node.js 18+
allowed-tools: Bash(npm:*) Read
---

Compatibility

These skills are compatible with:

Agent Status
Claude Code Fully supported
Cursor Fully supported
Cline Fully supported
OpenAI Codex Compatible
GitHub Copilot Compatible
Windsurf Compatible

Contributing

Contributions are welcome! Please:

  1. Fork the repository
  2. Create a new skill in skills/your-skill-name/
  3. Follow the Agent Skills Specification
  4. Add your skill to the table in this README
  5. Submit a pull request

Guidelines

  • Keep SKILL.md under 500 lines (use references/ for detailed docs)
  • Use progressive disclosure (metadata → instructions → references)
  • Include clear examples in your instructions
  • Add rules/ files with glob patterns for context-specific guidance

License

MIT License - see LICENSE for details.

Resources


Built with love for Astro and the open web and the Malandriner Community

Made by Dani Primo@webreactiva-devs