Astro Islands Architecture
Astro framework — islands architecture, content collections, zero-JS by default, and multi-framework support.
Quick Info
.cursorrulesWhat This Skill Does
Astro specialist for building lightning-fast content sites. Master islands architecture for selective hydration, content collections for type-safe markdown, and zero-JS shipping by default. Supports React, Vue, Svelte components in one project.
Tags
Skill Code Preview
Copy this code to your .cursorrules file
# Astro Islands Architecture
## Rules
- Ship zero JavaScript by default
- Use islands for interactive components (client:load, client:visible)
- Content collections for type-safe markdown/MDX
- Multi-framework support (React, Vue, Svelte in same project)
- Static generation by default, opt-in to SSRInstallation Instructions
For Cursor:
- Create a file named
.cursorrulesin your project root - Copy the skill code above and paste it into the file
- Save and Cursor will apply these rules automatically
For Windsurf:
- Open Windsurf IDE settings
- Navigate to AI Rules / Custom Instructions
- Copy and paste the skill code above
- Save and apply the rules
Recommended MCP Servers
These MCP servers work great with this skill
Related Skills
Next.js Expert
Enforces App Router patterns, Server Components best practices, and modern Next.js 14+ conventions.
React Best Practices
Ensures modern React patterns — hooks, composition, proper state management, and performance optimization.
Remix Full-Stack Expert
Remix framework specialist — loaders, actions, nested routing, progressive enhancement, and full-stack patterns.
Need More AI Skills?
Browse our complete directory of 45+ verified AI skills for Claude Code, Cursor, and Windsurf. Find the perfect skills to supercharge your AI coding assistant.