mcpField
A
astroflare

astroflare

github.com/siviter-xyzDevelopment2281 installsUpdated 32w ago
Repository

About astroflare

astroflare is an agent skill offering technical guidance for TypeScript, Tailwind, and Astro web development targeting Cloudflare Workers. It emphasizes static output, server islands, and native web components, with reference guides for common development areas.

Key features

  1. 01Astro and TypeScript guidance
  2. 02Tailwind styling patterns
  3. 03Cloudflare Workers deployment guidance
  4. 04Component and routing conventions
  5. 05References for forms, SEO, and testing

Use cases

  1. 01Build Astro components and pages
  2. 02Develop forms and server actions
  3. 03Prepare a Cloudflare Workers deployment

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/siviter-xyz/dot-agent --skill astroflare

After installing, type/astroflarein Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

references/
components.md
deployment.md
forms.md
routing.md
seo.md
styling.md
testing.md

Details

From the project README

Astroflare

Expert guidance for TypeScript, Tailwind, and Astro framework for scalable web development on the Cloudflare platform.

Key Principles

  • Write concise, technical responses with accurate Astro examples
  • Prioritize static generation and server-side islands with minimal JavaScript
  • Use descriptive variable names and follow Astro's naming conventions
  • NEVER change the site output without explicit user confirmation - issues are likely elsewhere in configuration, environment variables, or build process
  • Organize files using Astro's file-based routing system
  • Native over frameworks: Prefer native HTML elements (<dialog>, <form>) and web components over framework-specific solutions when possible. Use framework features only when they provide clear value.

Project Architecture

Deployment Target
  • Cloudflare Workers with output: 'static' and component server islands for server-side rendering
  • Use server:defer directive for server islands to optimize performance
  • Cloudflare adapter configured with platformProxy for forms/server actions
  • Trailing slashes always (trailingSlash: 'always') to match Cloudflare Workers behavior
Project Structure
src/
  ├── components/       # Astro components and custom web elements
  │   ├── core/         # Reusable core components
  │   ├── forms/        # Form components with client-side logic
  │   ├── modals/       # Modal dialogs
  │   └── animations/   # Animated components
  ├── layouts/          # Page layouts
  ├── pages/            # File-based routing
  ├── actions/          # Server actions (forms, API endpoints)
  ├── utils/            # Utility code
  └── styles/           # Global styles

Component Development

  • Create .astro files for all components - this is the default and preferred approach
  • Use components/core/ for reusable components
  • Prefer custom web components over React islands for interactivity
  • Use native HTML elements (<dialog>, <form>) when possible

Package Management

  • Use pnpm as the package manager
  • Node version: 24.x
  • pnpm version: >=10

References

For detailed guidance, see:

  • references/components.md - Component patterns and Starwind UI
  • references/routing.md - Routing and pages
  • references/forms.md - Forms and server actions
  • references/styling.md - Tailwind CSS patterns
  • references/seo.md - Comprehensive SEO guide
  • references/testing.md - Testing patterns
  • references/deployment.md - Build and deployment

Comments

Markdown supported