Skip to main content

Documentation Index

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

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

sys-core ships as a pre-built static site — the repository contains the compiled output ready to serve directly. There is no package.json, no npm install step, and no Vite dev server to start. All portfolio content lives in plain JavaScript data modules under /data/, so customizing the site means editing those files and redeploying to GitHub Pages, or swapping in your own source and build process if you want to extend the components.
1

Clone the repository

Clone sys-core from GitHub and navigate into the project directory.
git clone https://github.com/apursley2012/sys-core.git
cd sys-core
2

Serve the site locally

Because sys-core is a pre-built static site, you can preview it immediately by serving the files with any static file server. The simplest option requires no installation:
npx serve .
Open the URL printed by serve (typically http://localhost:3000) in your browser. You should see the animated starfield, nebula background, and HudNav bar appear immediately. The site uses hash-based routing, so navigating to the About section resolves as http://localhost:3000/#/about.Alternatively, open index.html directly in a browser — though some browsers restrict local ES module loading, so a static server is recommended.
3

Customize your data

All portfolio content is defined in the /data/ directory. You do not need to modify any component files to change what appears on the site — update the data modules and redeploy.The most important file to start with is data/projects.js. Each entry in the exported array maps to a project card on the Projects page and a plotted point on the OrbitalDiagram on the Home page.
{
  id: "p1",
  name: "NEXUS_CORE",
  tagline: "Real-time telemetry dashboard",
  description: "A high-performance dashboard for monitoring distributed systems. Features real-time WebSocket data streaming, custom WebGL visualizations, and an alerting engine.",
  stack: ["React", "TypeScript", "WebGL", "Node.js", "WebSockets"],
  demoUrl: "#",
  sourceUrl: "#",
  dataSource: "LIVE",       // "LIVE" | "MOCKED" | "SAMPLE" — shown as a status badge
  coordinates: { x: 20, y: 30 }  // position on the OrbitalDiagram (0–100 scale)
}
Replace the five placeholder projects (NEXUS_CORE, AETHER_SYNC, STELLAR_ROUTER, VOID_CANVAS, PULSAR_UI) with your own work. The coordinates field controls where each project appears as an orbital marker on the home screen map — spread them across the grid for a balanced star-chart layout.The other data modules follow a similar pattern. See the Data Layer section of the Architecture page for a full description of each file.
4

Deploy to GitHub Pages

When you are ready to publish, push your customized files to GitHub and deploy to GitHub Pages.Since the repository already contains compiled static output, you can deploy it directly using the gh-pages CLI without any build step:
npx gh-pages -d .
This publishes the current directory to the gh-pages branch of your repository. GitHub Pages will then serve the site at https://<your-username>.github.io/sys-core/ (or your custom domain if configured in GitHub Pages settings).
If you plan to extend or modify the components themselves rather than just the data files, you will need to set up your own Vite build environment separately — the cloned repository contains the compiled dist output, not the original source. Fork the repo and add a package.json and vite.config.js to establish a full development workflow.

​
What to Customize First

The fastest way to make the portfolio yours is to work through the content data modules and the site sections together. Start with projects and skills — they appear on the most-visited pages and feed the home screen’s orbital map.

Projects Section

How the Projects page renders project cards, stack badges, and the OrbitalDiagram from data/projects.js.

Projects Data Module

Full field reference for data/projects.js — names, stacks, coordinates, data-source status, and link types.
The space metaphor extends all the way to personalization. Open data/timeline.js and replace the placeholder stardates and career milestones with your own story — from your first line of code to your current orbit. The About page renders this data as a chronological mission log, so the more specific and candid the entries, the more memorable the page becomes.

Build docs developers (and LLMs) love

Get started for freeTalk to us