Skip to main content

Documentation Index

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

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

y2k-web is a single-page application (SPA) deployed as a set of static files. There is no server-side rendering or backend runtime — everything the browser needs is shipped as pre-built HTML, JavaScript, and CSS. The root index.html is the SPA entry point, the assets/ directory holds the Vite-compiled React bundle, the pages/ directory contains per-route HTML shells that bootstrap the correct hash route on direct navigation, and the components/ directory holds module-preload chunks that are split out of the main bundle for faster parallel loading.
y2k-web/
├── index.html          # Root HTML entry point
├── pages/              # Pre-rendered static HTML for each route
│   ├── About.html
│   ├── Blog.html
│   ├── CaseStudies.html
│   ├── Contact.html
│   ├── Projects.html
│   ├── Testimonials.html
│   └── Work.html
├── assets/
│   ├── main.js         # Bundled React application
│   └── main.css        # Compiled Tailwind + custom styles
└── components/
    ├── Primitives.js   # Reusable UI primitive components
    └── Guestbook.js    # Instant Messenger Guestbook component

Top-level files and directories

PathDescription
index.htmlThe root HTML shell that mounts the React app into <div id="root">. Loads assets/main.js as an ES module, module-preloads components/Primitives.js and components/Guestbook.js, and links assets/main.css.
pages/One minimal HTML file per route. Each file sets window.__STATIC_PAGE_ROUTE__ and redirects the hash so that when a user lands on pages/About.html directly (e.g., from a GitHub Pages permalink), the SPA boots on the /about route.
assets/main.jsThe entire React application compiled and bundled by Vite. Contains React 18, React Router v6 (hash history), Framer Motion, all page components, and the App root component.
assets/main.cssThe compiled output of Tailwind CSS (with a custom retro configuration) plus global CSS overrides — body font, checkered tile background, crosshair cursor, link colours, and custom scrollbar styles.
components/Primitives.jsA code-split chunk containing reusable UI primitives (e.g., Window, Marquee, CursorTrail, StatusBar). Declared as a <link rel="modulepreload"> so the browser fetches it in parallel with main.js.
components/Guestbook.jsA code-split chunk for the Instant Messenger Guestbook widget embedded on the home page and testimonials route. Also declared as a module preload.

Build output

Vite compiles the React TypeScript/JSX source into two output files:
  • assets/main.js — the full application bundle (React runtime, React Router, Framer Motion, all route components, and the App root). Loaded as <script type="module"> in every HTML file.
  • assets/main.css — the Tailwind utility stylesheet with the retro theme plus global CSS reset overrides. Loaded via <link rel="stylesheet"> in every HTML file.
The components/Primitives.js and components/Guestbook.js files are module preloads: they are separate chunks produced during the build that contain shared UI components. Declaring them with <link rel="modulepreload"> hints to the browser to fetch and parse them before they are dynamically imported at runtime, eliminating a waterfall.

The pages/ directory

Each file in pages/ is a minimal HTML shell for a specific route. Because the app uses hash-based routing (#/about, #/projects, etc.) and is deployed on a static file host, there is no server rewrite that can map /aboutindex.html. The pages/About.html file solves this by:
  1. Registering the intended route on window.__STATIC_PAGE_ROUTE__.
  2. Checking whether the browser already has the correct hash; if not, setting window.location.hash to the correct value.
  3. Then loading the same assets/main.js bundle, which reads the hash and renders the matching route.
<!-- pages/About.html -->
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>About | y2k-web</title>
    <script type="module" crossorigin src="../assets/main.js"></script>
    <link rel="modulepreload" crossorigin href="./components/Primitives.js">
    <link rel="modulepreload" crossorigin href="./components/Guestbook.js">
    <link rel="stylesheet" crossorigin href="../assets/main.css">
    <script>
  window.__STATIC_PAGE_ROUTE__ = "/about";
  if (!window.location.hash || window.location.hash === "#/" || window.location.hash === "#") {
    window.location.hash = "/about";
  }
</script>
</head>
  <body>
    <div id="root"></div>
  </body>
</html>
Every other page file in pages/ follows the identical pattern, differing only in the <title> tag and the window.__STATIC_PAGE_ROUTE__ / window.location.hash values.

Build docs developers (and LLMs) love