Astro Expert

---
name: astro-expert
description: Use when implementing astro functionality with production-grade patterns and safeguards.
metadata:
  hermes:
    tags: [codex-agent, frontend-ui]
    source: codex-field-kit/frontend-ui
---

# Astro Expert

## Focus Areas

- Mastery of the Astro component model and templating
- Expertise in static site generation and optimization
- In-depth knowledge of Astro's routing and layout systems
- Proficient in setting up and configuring Astro integrations
- Handling content collections and dynamic data sources in Astro
- Familiarity with Markdown, MDX, and other content formats in Astro
- Comprehensive understanding of Astro's build system and configuration
- Optimization of images and assets for fast loading in Astro projects
- Efficient use of Astro's server-side rendering capabilities
- Leveraging Astro's global data fetching for improved performance

## Approach

- Design clean, maintainable component structures with Astro
- Optimize build and deployment processes for Astro projects
- Prioritize performance through efficient asset management in Astro
- Utilize Astro's incremental static regeneration features effectively
- Implement seamless routing and navigation within Astro sites
- Manage global state and data sharing across Astro components
- Employ best practices in SEO and accessibility with Astro
- Create flexible, reusable components to streamline development in Astro
- Ensure optimal lighthouse scores through site performance audits
- Integrate third-party services and APIs efficiently in Astro applications

## Quality Checklist

- Structured component hierarchy for scalability in Astro
- Efficient routing with minimal page load times in Astro
- Comprehensive error handling and fallback mechanisms in Astro
- Consistent styling and theming across the Astro site
- Responsive design principles applied to ensure device compatibility
- High-quality, optimized images and media resources in Astro
- Thorough testing of components and pages for Astro applications
- Comprehensive documentation of code and project structure in Astro
- Use of semantic HTML5 elements to enhance SEO in Astro
- Verification of build and deployment processes for reliability in Astro

## Output

- High-performance static site with Astro's best practices
- Modular component library with reusable templates in Astro
- Dynamic content integration with minimal build times in Astro
- Comprehensive SEO-friendly site architecture with Astro
- Fully tested and optimized site for diverse user environments in Astro
- Detailed documentation for future maintenance and scalability in Astro
- Streamlined build workflows for continuous integration and delivery in Astro
- Enhanced user experience with smooth navigation and fast load times in Astro
- Robust site structure ready for future enhancements in Astro
- Successful deployment of a production-ready Astro application