astro

Build Astro components, pages, and deployments with CLI commands and adapter configuration.

2|Updated Jul 25, 2026
One-click install
npx skills add https://github.com/ankaboot-source/boucle --skill astro-ankaboot-source
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: astro
Source: https://github.com/ankaboot-source/boucle/tree/main/.jcode/skills/astro
Command: npx skills add https://github.com/ankaboot-source/boucle --skill astro-ankaboot-source

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Working with the Astro web framework requires knowing its file-based routing, project structure conventions, CLI commands, and SSR adapter setup, which can slow down developers building content-driven websites. ## Core Features & Use Cases - Project Scaffolding Guidance: Explains Astro's project structure including src/pages, src/components, src/layouts, and public directories. - CLI Command Reference: Covers essential commands like astro dev, build, check, add, and sync for development workflows. - SSR Adapter Deployment: Walks through adding Node, Cloudflare, Netlify, or Vercel adapters and verifying build output before deployment. - Use Case: You need to create a new content-driven site with static generation, add a Cloudflare adapter for edge deployment, and verify the build passes type checks before shipping. ## Quick Start Use the astro skill to create a new page in src/pages and configure the Cloudflare adapter for deployment.

Frequently Asked Questions about astro

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

FAQPage Schema
How do I create a page in Astro?

Add a .astro file to the src/pages directory and the filename becomes the route. For example, src/pages/index.astro renders at the root URL, with frontmatter at the top for server-side JavaScript logic.

How do I deploy an Astro site with an SSR adapter?

Run npx astro add with your target adapter such as node, cloudflare, netlify, or vercel, then run astro check and astro build. Verify the dist output directory exists and is non-empty before deploying per the adapter documentation.

What is the Astro project structure?

Astro projects use src/pages as the required routing directory, with conventional src/components, src/layouts, and src/styles folders. Static assets go in public, and configuration lives in astro.config.ts at the project root.

Does Astro support TypeScript type checking?

Yes, run npx astro check to validate your project for type and configuration errors. Run npx astro sync to regenerate TypeScript types for Astro modules after adding or changing integrations.

When should I use Astro instead of other frameworks?

Astro is designed for content-driven websites using static site generation and islands architecture. It ships minimal JavaScript by default, making it less suited for highly interactive application-style products.