skills.rest
sreejithraman
sreejithramanCOMMUNITY
Explore all skills by this author →
GitHub

astro

Guide Astro islands architecture, hydration directives, and view transitions.

Updated Aug 23, 2026
Search Tags:#astro#hydration#islands#client-directives#view-transitions
One-click install
npx skills add https://github.com/sreejithraman/shayna --skill astro
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: astro
Source: https://github.com/sreejithraman/shayna/tree/main/.claude/skills/astro
Command: npx skills add https://github.com/sreejithraman/shayna --skill astro

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Astro projects benefit from clear component isolation and hydration strategies. This Skill guides islands architecture, hydration directives, and view transitions.

Core Features & Use Cases

  • Zero JS by Default: Ship HTML/CSS unless interactivity is needed
  • Islands Architecture: Hydrate only interactive components
  • Hydration Directives: client:load, client:visible, etc.
  • Use Case: Build a static content site with interactive islands only where necessary.

Quick Start

Use client:visible for interactive islands, and set up a view transition lifecycle on navigation.