Skip to main content

Documentation Index

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

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

This guide walks you through everything you need to get the Aurora Borealis portfolio running on your machine — from obtaining the source files to understanding the project structure, navigating all seven routes, and deploying the ready-made static bundle to any host.

​
Prerequisites

Aurora Borealis ships as a pre-built static bundle — there is no build step and no package.json. All JavaScript, CSS, and HTML files are already compiled and ready to serve. The only things you need are:
  • Git — to clone the repository
  • A way to serve static files locally — a browser (for direct file opening) or a simple static file server
The easiest way to spin up a local static server without installing anything globally is npx serve . (requires Node.js) or Python’s built-in server: python3 -m http.server 8080. Either will serve the files correctly with proper MIME types and module resolution.

​
Running Locally

1

Clone the repository

Download the project source from GitHub and move into the project directory:
git clone https://github.com/apursley2012/aurora-borealis.git
cd aurora-borealis
2

Serve the files

Because the project is a pre-built static bundle, you do not need to install dependencies or run a build command. Simply start a local static file server from the project root:
npx serve .
With npx serve, the portfolio will be available at http://localhost:3000 (or the port shown in your terminal). With Python’s server it will be at http://localhost:8080.Alternatively, you can open index.html directly in your browser — most modern browsers handle ES module preloads correctly when loading from the local file system, though a static server is recommended to avoid any CORS restrictions on module imports.
3

Open the portfolio in your browser

Navigate to the URL shown by your server (e.g. http://localhost:3000). You should see the aurora gradient background and star field canvas load immediately, followed by the constellation navigation bar across the top. Use the navigation links to move between the seven portfolio pages.
Because the project uses hash-based routing, every URL includes a # fragment (for example http://localhost:3000/#/about). Direct navigation to http://localhost:3000/about will redirect automatically to the hash equivalent via the inline script in each HTML entry point.

​
Project Structure

aurora-borealis/
├── index.html                 # Root entry point (hash router)
├── assets/
│   ├── main.js               # Application bundle (all pages + routes)
│   ├── main.css              # Compiled Tailwind styles
│   ├── jsx-runtime.js        # React JSX runtime
│   └── proxy.js              # Re-exports (Framer Motion, React Router)
├── components/
│   ├── AuroraBackground.js   # Animated aurora gradient layers
│   ├── StarField.js          # Canvas star & shooting-star renderer
│   └── ConstellationNav.js   # Navigation bar + React Router + Framer Motion
├── pages/
│   ├── Home.html
│   ├── About.html
│   ├── Projects.html
│   ├── Skills.html
│   ├── Writing.html
│   ├── CaseStudies.html
│   └── Contact.html
└── useScreenInit.js          # React 18 production bundle
Each file under pages/ is a complete HTML document with its own <script> block that sets window.__STATIC_PAGE_ROUTE__ to the page’s canonical hash route. This tells the React app which route to render when the page is loaded directly — for example, loading pages/About.html sets window.__STATIC_PAGE_ROUTE__ = "/about" and redirects the browser to #/about before React mounts.
The three component files are loaded as ES module preloads by every HTML entry point, so they are parsed and executed before the main application bundle runs — keeping aurora and star-field rendering nearly instantaneous on first paint.

​
Available Routes

The portfolio exposes seven hash routes, each mapped to a thematic page title drawn from the night-sky design language:
RoutePage TitleDescription
/HomeHero page with developer introduction and stats
/aboutAbout — ObservatoryCareer journey and the Observatory panel
/projectsProjects — Mission CatalogInteractive project cards on a star map layout
/skillsSkills — Star ChartConstellation skill chart with proficiency bars
/writingWriting — Flight LogBlog post archive and article index
/case-studiesCase Studies — Transmission ArchiveDeep-dive project breakdowns
/contactContact — Signal TransmitterAnimated contact form with social links
Page transitions between routes use a Framer Motion AnimatePresence pattern. Each page enters with opacity: 0, y: 20, scale: 0.9, and filter: blur(10px), then animates to its natural state. On exit, it scales back to 0.95 and re-applies a blur(5px) — creating the sensation of drifting between star fields.

​
Deploying the Portfolio

The project is already a fully compiled static bundle — no build step is required before deployment. To publish the portfolio, copy the entire project directory (all HTML, JS, and CSS files) to any static hosting provider:
  • GitHub Pages — push the repository and enable Pages from the root or docs/ branch
  • Netlify / Vercel — drag-and-drop the project folder or connect the repository; set the publish directory to the project root
  • Cloudflare Pages — connect the repository and leave the build command empty
  • S3 / any CDN — upload all files, preserving the directory structure
Because each page under pages/ is a self-contained HTML entry, you can deploy individual pages to separate paths on your static host and direct navigation will work correctly without any redirect rules, thanks to the window.__STATIC_PAGE_ROUTE__ mechanism.

Build docs developers (and LLMs) love

Get started for freeTalk to us