Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/apursley2012/guest-portfolio.dev/llms.txt

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

This guide walks you through getting a local copy of guest-portfolio.dev running, swapping in your own content, and shipping it to production. The whole process takes under ten minutes.
The site has no backend and no build step required — it ships as pre-compiled static files (index.html, assets/main.js, assets/main.css). There is nothing to configure server-side, no environment variables to set, and no database to provision. If you can serve a folder of HTML/CSS/JS, you can host this portfolio.
1

Clone the repository

Fork or clone the repository from GitHub, then move into the project directory:
git clone https://github.com/apursley2012/guest-portfolio.dev.git
cd guest-portfolio.dev
The repository contains pre-built static files — index.html bootstraps the React tree, and all compiled JavaScript lives in assets/main.js. There is no package.json, no node_modules, and no build step required to run the site. A single index.html at the root is all you need to open in a browser.
2

Preview locally

Because the site uses ES modules (type="module" scripts), you must serve it from a local HTTP server rather than opening index.html directly as a file:// URL. Any static file server works:
# Python 3 (no install needed)
python3 -m http.server 8080
Then open http://localhost:8080 in a browser. You should see the BIOS boot sequence, followed by the guest@portfolio.dev login: guest prompt, and then the live terminal.
Alternatively use any other static server you have available, such as npx serve ., npx http-server ., or VS Code’s Live Server extension — whichever you prefer.
3

Customize your content

All personalizable content lives in a small set of JavaScript source files. Edit these directly; the changes are reflected immediately the next time you reload the page in your browser.

​
Filesystem structure — utils/fileSystem.js

This is the single source of truth for every path the ls, cd, and cat commands can navigate. Each node in the object tree carries Unix-style metadata (permissions, size, date) and, for files, a content key. Add or rename directories and files here to change what appears when a visitor runs ls:
// utils/fileSystem.js
const fileSystem = {
  "~": {
    name: "~",
    type: "dir",
    children: {
      "about.md":     { name: "about.md",    type: "file", ... },
      "skills.sh":    { name: "skills.sh",   type: "exec", ... },
      "projects":     { name: "projects",    type: "dir",  children: { ... } },
      "blog":         { name: "blog",        type: "dir",  children: { ... } },
      "references.log": { name: "references.log", type: "file", ... },
      "case-studies": { name: "case-studies", type: "dir", children: { ... } },
    }
  }
};

​
Bio — components/outputs/AboutOutput.js

whoami (and cat about.md) renders this component. Replace the neofetch-style key/value pairs and the prose paragraphs with your own details:
// components/outputs/AboutOutput.js
// Edit the grid rows to reflect your own stats:
<span>OS:</span>       <span>Arch Linux x86_64 (btw)</span>
<span>Uptime:</span>   <span>28 years, 4 months, 12 days</span>
<span>Languages:</span><span>TypeScript, Python, Rust, Go</span>

​
Skills — components/outputs/SkillsOutput.js

./skills.sh animates progress bars for an array of skill objects. Add, remove, or re-score entries and reorganize them into your own categories (the component groups automatically by the category field):
// components/outputs/SkillsOutput.js
const skills = [
  { name: "TypeScript", percent: 90, category: "Languages" },
  { name: "React",      percent: 95, category: "Frameworks" },
  { name: "Docker",     percent: 75, category: "Tools" },
  // Add your own entries here
];

​
Career history — components/outputs/GitLogOutput.js

git log renders a styled commit-log view driven by a static array of job entries. Each entry maps to a fake commit hash, author line, date, and a multi-line commit message:
// components/outputs/GitLogOutput.js
const commits = [
  {
    hash:    "a1b2c3d",
    author:  "guest <guest@portfolio.dev>",
    date:    "Mon Oct 24 09:00:00 2023 -0400",
    message: `feat(career): Senior Frontend Engineer at TechCorp\n\n- Led migration from Vue to React\n- Reduced bundle size by 40%`,
  },
  // Add one object per role
];

​
Case studies — components/outputs/ManOutput.js

man [page] looks up a page name in an object of React elements formatted as Unix manual pages (NAME, SYNOPSIS, DESCRIPTION, CHALLENGES sections). Add a new key matching the filename you placed in case-studies/ in the filesystem:
// components/outputs/ManOutput.js
const pages = {
  "migration-to-k8s": (
    <>
      <div className="font-bold mb-2">NAME</div>
      <div className="ml-8 mb-4">migration-to-k8s – Moving a monolith to Kubernetes</div>
      {/* SYNOPSIS, DESCRIPTION, CHALLENGES ... */}
    </>
  ),
  // Add your own case study here:
  "my-new-project": ( ... ),
};
4

Deploy to production

Because the repository is already a compiled static site, deployment is simply a matter of serving the files from any static host — no build command needed.

​
Deploy to GitHub Pages

The repository includes a .nojekyll file so GitHub Pages doesn’t process the files through Jekyll. Push your changes to a branch and enable GitHub Pages → Deploy from branch in your repository settings, pointing at the branch root (/).

​
Deploy to Netlify (drag-and-drop)

  1. Open app.netlify.com/drop.
  2. Drag the entire project folder (the one containing index.html) onto the drop zone.
  3. Netlify assigns a live URL instantly — no account required for a one-off deploy.

​
Deploy to Vercel

Import your fork in the Vercel dashboard and set the Framework Preset to Other (not Vite) and the Output Directory to . (the repo root). Vercel will serve index.html and the assets/ folder directly.
For a deeper look at every customizable surface — CRT effects, color themes, boot sequence copy, Command Palette entries, and the contact form — see the Customization section of the docs.

Build docs developers (and LLMs) love

Get started for freeTalk to us