B.
Back to projects

Portfolio Website

Overview

A fast, responsive personal portfolio built with Astro. It has role-based routes and a custom project gallery/filtering system. Built with a custom CI/CD pipeline (using GitHub Actions) to lint and validate my code before deploying to Cloudflare Pages.

Key Technical Points

  • Fast page loaf: Used Astro to statically generate content and pages with minimal client-side JavaScript for fast load times
  • Role-based routing: Built dynamic routes using Astro content collections and a structured profile data file so each role gets its own tailored page title, copy, CV link and featured projects list.
  • Custom project filtering: Built a custom category and skill filtering system using vanilla JavaScript
  • Responsive & Accessible UI: Designed a modern and responsive neo-brutal site using Tailwind CSS
  • Reusable content model: Used Astro’s Content API to generate project pages from Markdown files and to generate role specific pages from JSON notation.
  • Serverless from preocessing: Created a custom serverless form processing system using Cloudflare Pages, Turnstiles and Resend
  • Automated CI/CD Pipeline: Configured a GitHub Actions workflow to run ESLint, Astro type checking and automated builds before deploying to Cloudflare Pages

Tech Stack

Framework: Astro, TypeScript, Tailwind CSS
DevOps: GitHub Actions, Cloudflare Pages, CI/CD