Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/apursley2012/groovy/llms.txt

Use this file to discover all available pages before exploring further.

Groovy Portfolio is a personal developer portfolio site styled after 1970s psychedelic design. Built with React, Vite, and Framer Motion, it features nine fully-animated pages — from vinyl record project cards to a daisy-flower contact form — all wired together through hash-based React Router for zero-config static hosting.

Introduction

Understand the project structure, tech stack, and what makes it groovy

Getting Started

Clone, install, run, and customize the portfolio in minutes

Pages & Sections

Explore every route — Home, About, Projects, Skills, Work, and more

Components

Deep-dive into VinylRecord, DaisyForm, WallPoster, and every other animated component

What’s Inside

Groovy Portfolio is made up of nine distinct pages, each built around a unique interactive component that reinforces the 70s theme.

Vinyl Records

Project cards that slide open like an album sleeve on click

Record Crate

Flip through blog posts stacked in an interactive 3D wooden crate

Peace Timeline

Career history displayed on a spring-animated peace-sign timeline

Wall Posters

Case studies as tilted wall posters that expand into full modals

Daisy Form

A contact form shaped like a daisy — petals are the input fields

Groovy Bubbles

Floating speech bubble testimonials with looping y-animations

Tech Stack

React + Vite

Built with React 18 and bundled by Vite for fast HMR and optimised static output

Framer Motion

Every transition, hover, and entrance animation is powered by Framer Motion

React Router (Hash)

Hash-based routing keeps the SPA deployable on any static host without server config

Tailwind CSS

Custom Tailwind config with groovy colour tokens: magenta, teal, yellow, and violet

Build docs developers (and LLMs) love