Cadamsmith.dev
Personal portfolio site built with Astro + Svelte 5
cadamsmith.dev
Personal portfolio site built with Astro + Svelte 5, deployed on Cloudflare Pages.
Stack
- Astro — static site generation, file-based routing, content collections
- Svelte 5 — interactive islands (skills widget, timeline, music player, map)
- Leaflet — interactive location map
- Cloudflare Pages — hosting and deployment
- TypeScript — throughout
Architecture
All pages are prerendered at build time (static output). Interactive components are mounted as Svelte islands with client:visible.
Site content is driven by Astro content collections in src/content/:
| Collection | Description |
|---|---|
skills/ |
Tech skills shown in the skills widget |
timeline/ |
Work and education history with location + coordinates |
songs/ |
Music player playlist (YouTube embeds) |
blurbs/ |
Hero and contact section copy |
heroTags/ |
Info tags shown in the hero section |
Local Setup
git clone https://github.com/cadamsmith/cadamsmith.dev.git
cd cadamsmith.dev
npm install
npm run dev
Commands
npm run dev # Start development server
npm run build # Build for production (static output to dist/)
npm run preview # Preview production build
npm run test # Run Vitest unit tests
npm run lint # Run Prettier + ESLint checks
npm run format # Auto-format with Prettier
npm run check # Astro type checking
