Overview
This website is a living project. It started as a fork of Astro Sphere, an open-source Astro portfolio template that had not been updated in two years. Rather than find a different starting point, the decision was made to extend and improve it, adding new content collections, fixing limitations in the original design, and deploying it as a continuously evolving personal platform.
The site also serves as a hands-on companion to the Astro Publish project. Both demonstrate the same core idea: Astro as a framework produces fast, portable, zero-cost static sites that are trivially easy to maintain because all content lives in plain markdown files.
What Was Done
- Forked Astro Sphere and resolved accumulated issues from two years without upstream maintenance, including broken builds, outdated dependencies, and missing mobile fixes
- Added a full Accomplishments content collection, a new markdown-driven section with its own page, tags, filtering, and search integration that did not exist in the original template
- Extended the search system (Fuse.js) to index accomplishments alongside projects and blog posts, with tuned scoring weights to surface more relevant results
- Built project link buttons for Demo, Repository, and a configurable Explainer link on each project page, used here to link to the Astro overview video
- Added a featured content system where projects and blog posts marked as featured are pinned to the top of their section pages in a distinct card layout, with deduplication logic that removes them from the searchable list below so they do not appear twice
- Built an image carousel for project galleries so projects with multiple screenshots present them in a slideshow rather than a static stack
- Added animated star field backgrounds on article and project detail pages using a canvas effect that responds to the active color theme
- Implemented a toast notification system with theme-aware messages that vary between light and dark mode
- Tuned SEO and Open Graph metadata across all routes so link previews and search indexing reflect accurate page-level content
- Configured Cloudflare Pages as the deployment target, so every push to main triggers a build and global CDN deployment with no manual steps
Outcome
The result is a portfolio that is fast by default. Astro compiles every page to plain HTML at build time, shipping zero JavaScript to the browser unless a component explicitly needs it. Lighthouse scores reflect this, and pages load near-instantly even on slower connections. All content (work history, projects, blog posts, accomplishments) is a markdown file, which means adding or updating content requires no code changes and no deployment beyond a git push.
The site also serves as a tangible example of the kind of work found elsewhere on it: extended open-source software, self-hosted or free-tier infrastructure, and systems designed to stay maintainable over time.
Stack
Astro · TypeScript · Tailwind CSS · SolidJS · Fuse.js · Cloudflare Pages · Markdown/MDX