Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/apursley2012/cosmic-developer/llms.txt

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

Cosmic Developer is a fully animated, space-themed developer portfolio built with React, Framer Motion, and Tailwind CSS. It combines immersive visual effects — procedural starfields, aurora borealis glows, orbiting project cards — with a clean single-page application architecture deployable to any static host.

Get Started

Clone the repo, install dependencies, and launch your portfolio in minutes.

Architecture

Understand the component structure, routing model, and design system.

Components

Explore every cosmos component — from starfields to the custom cursor.

Customization

Swap colors, fonts, and animations to match your personal brand.

What’s Inside

Cosmic Developer ships nine portfolio pages, seven reusable cosmos components, and a comprehensive Tailwind design system built around a deep-space color palette.

Starfield

Procedurally generated animated star canvas

Aurora

Multi-color glow blobs with blur and animation

Custom Cursor

Magnetic cursor that reacts to interactive elements

Teletype Text

Character-by-character monospace text reveal

Page Transitions

Framer Motion AnimatePresence page wrappers

Navigation

Full-screen overlay menu with animated links

Quick Start

1

Clone and install

git clone https://github.com/apursley2012/cosmic-developer.git
cd cosmic-developer
npm install
2

Start the dev server

npm run dev
Open http://localhost:5173 to see the portfolio.
3

Customize your content

Edit the page components in src/ to replace placeholder projects, skills, work history, and contact details with your own.
4

Deploy

Run npm run build and deploy the dist/ folder to GitHub Pages, Netlify, Vercel, or any static host. See the Deployment guide for details.

Design Philosophy

Cosmic Developer is designed to make a bold first impression while keeping the underlying code clean and maintainable. Every visual effect is a contained React component — swap or remove any of them without touching page logic.
The portfolio is built around three principles:
  • Performance first — Framer Motion animations are GPU-accelerated transforms. The starfield runs on a <canvas> element to avoid DOM overhead.
  • Modular cosmos layer — All visual effects live in components/cosmos/. Pages import only what they need.
  • Static-first deployment — React Router’s hash-based routing means the built dist/ folder works on any CDN or static host with zero server configuration.

Build docs developers (and LLMs) love