citec-astro-routing

Guides creation and review of Astro routes, layouts, and page components for the CITEC frontend.

Updated Jun 9, 2026
One-click install
npx skills add https://github.com/TOBIASpuchito/Citec --skill citec-astro-routing-tobiaspuchito
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: citec-astro-routing
Source: https://github.com/TOBIASpuchito/Citec/tree/main/citec-frontend/.codex/skills/citec-astro-routing
Command: npx skills add https://github.com/TOBIASpuchito/Citec --skill citec-astro-routing-tobiaspuchito

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? It enforces consistent Astro architecture in the CITEC frontend so routes, layouts, and page-owned components follow project conventions instead of drifting into duplicated shells, accidental public routes, or misplaced components. ## Core Features & Use Cases - Route and layout conventions: Keeps src/pages thin, centralizes metadata and shell logic in BaseLayout, and preserves trailing-slash and sitemap-friendly link behavior. - Component organization: Places page-owned components under src/page-modules/<page>/components and reserves React islands for stateful or browser-dependent UI. - Static-friendly dynamic routes: Uses typed getStaticPaths and typed Astro.props with data from src/data or integration adapters. - Use Case: When adding a new institutional page such as an eventos or directorio section, apply this skill to compose the route from existing sections, wire BaseLayout props correctly, and validate with bun run check and bun run build. ## Quick Start Use the citec-astro-routing skill to create a new Astro route for the CITEC agenda section with proper layout props and page-owned components.

Frequently Asked Questions about citec-astro-routing

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

FAQPage Schema
How do I structure Astro routes in the CITEC frontend?▼

Keep route files in src/pages thin: import data, declare getStaticPaths when needed, set BaseLayout props, and compose sections. Put page-owned components under src/page-modules/<page>/components so they do not become public routes.

When should I use React islands instead of Astro components?▼

Use .astro components for static or mostly static UI. Reserve React islands for state, hooks, browser APIs, or complex client interaction, and never place ordinary presentational components in src/islands.

How do I create dynamic routes with getStaticPaths in Astro?▼

Declare a typed getStaticPaths function in the route file and type Astro.props, sourcing data from src/data or integration adapters in src/lib. This keeps dynamic routes static-friendly and compatible with the build output.

Does this project require trailing slashes in internal links?▼

Yes, internal links should generally end with a trailing slash to preserve the configured trailing slash behavior. This keeps links consistent with the sitemap and canonical URL strategy.

How do I validate Astro route and layout changes?▼

Run bun run check after route, prop, layout, or integration changes. Run bun run build after visible UI, SEO, sitemap, motion, or layout changes to confirm the site compiles correctly.