About This Project
A technical showcase of Astro's capabilities for modern web development.
Tech Stack
- Framework: Astro 6.x (Island Architecture)
- Styling: Tailwind CSS v4
- Islands: React, Vue, Svelte
- Content: Astro Content Collections
- Deployment: Cloudflare Pages
- Icons: astro-icon (Iconify MDI)
Architecture
This site uses Astro's default static rendering โ pages are pre-rendered to HTML at build time.
Only the Edge demo page opts into server-side rendering for dynamic Cloudflare features via
export const prerender = false.
Interactive components use Astro's Island Architecture: framework components hydrate independently
using directives like client:visible and
client:load.
Goals
- โ Demonstrate multi-framework islands on a single page
- โ Achieve 100/100 Lighthouse on static pages
- โ Ship zero JavaScript where not needed
- โ Showcase View Transitions API
- โ Demonstrate Cloudflare Edge SSR