Skip to main content

Documentation Index

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

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

Spooky Developer follows a flat, purposeful directory layout. There are no deeply nested feature folders — each directory has a single clear responsibility, which makes it easy to locate any piece of functionality and swap in your own content.

​
Directory Tree

spooky-developer/
├── index.html              # App entry point — single HTML shell with <div id="root">
├── .nojekyll               # Prevents GitHub Pages Jekyll processing
├── assets/
│   ├── main.js             # Root App component, all page components, ReactDOM.render
│   ├── HauntContext.js     # Global haunt state (HauntProvider + useHaunt hook)
│   ├── main.css            # Tailwind directives + custom keyframe animations
│   ├── proxy.js            # Framer Motion re-export (motion object)
│   ├── index.js            # AnimatePresence re-export
│   └── jsx-runtime.js      # React JSX runtime (react/jsx-runtime)
├── components/
│   ├── layout/
│   │   ├── Layout.js       # Root layout: Nav + scares + Background + Outlet + Footer
│   │   ├── Nav.js          # Tombstone navigation bar + React Router internals bundle
│   │   ├── Background.js   # Animated atmospheric background layer
│   │   └── Footer.js       # Site footer with haunt mode toggle button
│   ├── scares/
│   │   ├── CursorTrail.js  # Ghost particles that follow the cursor
│   │   ├── SpiderScare.js  # Spider that drops on the user's first click
│   │   └── IdleGhost.js    # Ghost that slides in after a period of inactivity
│   └── icons/
│       └── SpookyIcons.js  # GhostIcon, BatIcon, SpiderIcon, PumpkinIcon, CandyIcon
└── pages/                  # Pre-built static HTML stubs (About, Projects, Skills, …)

​
Directory Roles

​
assets/

This directory contains the pre-built JavaScript and CSS modules that power the application. All files are ready to serve directly — no build step is required.
FilePurpose
main.jsThe primary entry module. Defines every page component — HomePage, AboutPage, ProjectsPage, SkillsPage, WorkPage, CaseStudiesPage, ArticlesPage, TestimonialsPage, ContactPage, NotFoundPage — and the root App function that wires them into React Router.
HauntContext.jsExports HauntProvider (the context provider) and useHaunt (the consumer hook). All global interactive state lives here.
main.cssTailwind CSS base/components/utilities layers plus any custom @keyframes for the flicker and float animations used throughout the UI.
proxy.jsRe-exports the motion object from Framer Motion so page components can import it without a direct dependency string.
index.jsRe-exports AnimatePresence from Framer Motion, used by the contact page to animate the ghost pop-up on form submission.

​
components/layout/

The layout shell that wraps every page. Layout.js is the React Router parent route element — it renders the sticky Nav, the three scare components, the animated Background, an <Outlet /> for the active page, and the Footer (which contains the haunt mode toggle).

​
components/scares/

Three self-contained effect components that mount globally inside Layout. Each one reads isHaunted from useHaunt() and activates or deactivates accordingly:
  • CursorTrail — attaches to mousemove events and renders a trail of ghost particles following the cursor.
  • SpiderScare — listens for the first click event (tracked via registerClick / hasClicked in context) and drops an animated spider from the top of the viewport.
  • IdleGhost — sets an inactivity timer; after a period without user interaction it slides a ghost character in from the edge of the screen.

​
components/icons/

A single file, SpookyIcons.js, that exports five SVG icon components: GhostIcon, BatIcon, SpiderIcon, PumpkinIcon, and CandyIcon. These are used across pages and in the scare components.

​
pages/

Pre-built static HTML stub files (e.g., About.html, Projects.html) that can serve as fallback targets for direct URL access or for static hosting configurations that require individual HTML files per route.

​
Static Deployment

Because Spooky Developer is a pre-built SPA, no compilation step is needed. The repository root is the deployable artifact — index.html bootstraps the app, and all assets are referenced by their stable filenames (main.js, main.css, etc.). The .nojekyll file at the root tells GitHub Pages to skip Jekyll processing and serve the files as-is, which is required for the module imports to resolve correctly.

Build docs developers (and LLMs) love

Get started for freeTalk to us