Type: Self-Initiated Project
Tools: Gatsby, React, WordPress (Headless), GraphQL, Netlify
Role: Full-Stack Developer (via GG Dev)

URL: https://affectionate-rosalind-abc7cc.netlify.app/

Overview

This headless CMS portfolio was originally built using Gatsby and React, with WordPress powering the backend content. The goal was to showcase development projects in a performant, modern, and fully decoupled environment — combining the speed of a static site with the flexibility of a CMS.

🔧 What I Built

✅ Gatsby Frontend

• Leveraged static site generation for lightning-fast load times
• Custom React components for layout, cards, and project views
• Routed content dynamically via Gatsby’s file-based routing system

✅ WordPress Backend

• Used as a headless CMS to manage portfolio entries and images
• Structured with custom post types and fields to support extensible project data

✅ Netlify Deployment

• Optimized for Jamstack delivery with smooth CI/CD via GitHub
• Set up redirects and fallbacks to handle clean navigation

✅ Responsive + Accessible Design

• Focused on keyboard navigation and color contrast
• Custom SCSS for modular styles with semantic HTML

💡 Why I Rebuilt It

As my freelance work scaled through GG Dev, I transitioned to a fully native WordPress theme and React block architecture to allow for easier client updates and flexible content editing — something not easily achieved in the headless workflow.

The Gatsby version is still viewable here, and the full source code is available on GitHub.

📊 Results

Demonstrated ability to build and deploy decoupled CMS systems

Served as the foundation for my evolving design system and block components

Informed the architecture of my current WordPress theme + block plugin stack