Web Weaver is a React single-page application that serves as a developer portfolio with a distinctive dark, mystical aesthetic. It combines animated UI components, hash-based routing, and a cohesive visual language of teal, ink, and parchment — pairing Cormorant Garamond serif with JetBrains Mono to create a spellbound developer identity.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/apursley2012/web-weaver/llms.txt
Use this file to discover all available pages before exploring further.
Introduction
Learn what Web Weaver is, how it’s structured, and the tech stack powering it.
Getting Started
Clone the repo, install dependencies, and spin up a local dev server in minutes.
Pages & Routes
Explore every page of the portfolio — from the Hero landing to the Contact form.
UI Components
Browse all animated components: EmberCursor, TarotCard, Cauldron, and more.
What’s Inside
Web Weaver ships with nine distinct pages and eleven custom React components. The site deploys as a static site (GitHub Pages–ready) using Vite, with each route pre-built as a standalone HTML file for direct deep linking.Animated Ambient FX
Glowing ember cursor trail, scrolling fog layer, and a wandering black cat — all rendered on every page.
Moon-Phase Projects
Filter your projects by lifecycle: New, Waxing, Full (live), or Waning (deprecated).
Tarot Blog Posts
Blog entries styled as tarot cards — hover to flip and reveal the excerpt.
WaxSeal Case Studies
Case study scrolls sealed with a clickable wax seal that animates open to reveal details.
Candle Work History
An interactive timeline where clicking a candle illuminates your selected work experience.
Familiar Testimonials
Testimonials from your “familiars” — each paired with an animated animal avatar.
Tech Stack
Web Weaver is built entirely with modern, widely-adopted frontend tooling:| Technology | Purpose |
|---|---|
| React 18 | Component model and UI rendering |
| React Router v6 | Hash-based client-side routing |
| Framer Motion | Declarative animations and transitions |
| Tailwind CSS | Utility-first styling with custom design tokens |
| Vite | Build tool and dev server |
Customize your content
Edit the data arrays in
assets/main.js to swap in your own projects, skills, work history, and blog posts.