Personal portfolio website for Francis Sabado, a Senior Software Engineer with experience at Lyft, Amazon Web Services, and Sandia National Laboratories.
Live site: fsabado.com
| Layer | Technology |
|---|---|
| Framework | Astro 4 (static output) |
| Styling | Tailwind CSS 3 |
| Language | TypeScript |
| Search | Fuse.js (client-side fuzzy search) |
| PWA | @vite-pwa/astro |
| Hosting | GitHub Pages |
| CI/CD | GitHub Actions (push to master → deploy) |
npm install
npm run dev # dev server at localhost:4321
npm run build # production build → dist/
npm run preview # preview dist/ locallyThe predev hook syncs project data automatically before the dev server starts.
Project images: The CI pipeline copies projects/ into public/projects/ at build time. For local preview, copy images manually:
cp -r projects/<slug>/ public/projects/<slug>/Content is managed with Astro Content Collections (src/content/).
Add a blog post: Create src/content/blog/YYYY-MM-DD-slug.md with the required frontmatter (title, description, publishDate, category, tags).
Add a project: Create src/content/projects/slug.md with required frontmatter, then add images to projects/slug/.
- Architecture — project structure, component inventory, build pipeline, and performance notes