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.

The projects.js module exports an array p of project objects that power the Projects section of the portfolio. Each entry supplies the project card with its name, tagline, description, technology stack, and external links. The coordinates field is read exclusively by the OrbitalDiagram component to position the project node on the interactive orbital map; the dataSource field communicates whether the live demo is connected to real infrastructure, simulated data, or a placeholder.

​
Data Shape

interface Coordinates {
  x: number; // Horizontal position on the OrbitalDiagram, 0–100 (percent)
  y: number; // Vertical position on the OrbitalDiagram, 0–100 (percent)
}

interface Project {
  id: string;           // Unique identifier, e.g. "p1"
  name: string;         // All-caps display name, e.g. "NEXUS_CORE"
  tagline: string;      // One-line summary shown on the project card
  description: string;  // Full paragraph description
  stack: string[];      // Technology tags displayed on the card
  demoUrl?: string;     // Link to live demo (omit if unavailable)
  sourceUrl?: string;   // Link to source repository (omit if unavailable)
  readmeUrl?: string;   // Link to standalone readme (omit if unavailable)
  dataSource: "LIVE" | "MOCKED" | "SAMPLE"; // Demo data status indicator
  coordinates: Coordinates;
}
demoUrl, sourceUrl, and readmeUrl are all optional. Omit any key that doesn’t apply — the card hides its corresponding button automatically. Note that readmeUrl is present on p2 (AETHER_SYNC) and p5 (PULSAR_UI) but not on other entries; demoUrl is absent from those same two projects.

​
Current Entries

IDNameTaglineStackdataSource
p1NEXUS_COREReal-time telemetry dashboardReact, TypeScript, WebGL, Node.js, WebSocketsLIVE
p2AETHER_SYNCConflict-free offline storageTypeScript, IndexedDB, CRDT, WebRTCMOCKED
p3STELLAR_ROUTERIntelligent API gatewayRust, Cloudflare Workers, RedisSAMPLE
p4VOID_CANVASInfinite collaborative whiteboardReact, Canvas API, Socket.io, ZustandLIVE
p5PULSAR_UIComponent design systemReact, Tailwind CSS, Radix UI, StorybookSAMPLE

​
OrbitalDiagram Coordinates

Each project’s coordinates object maps to a percentage-based position on the orbital diagram canvas (origin at top-left, 100 × 100 grid).
IDNamexy
p1NEXUS_CORE2030
p2AETHER_SYNC6020
p3STELLAR_ROUTER8060
p4VOID_CANVAS3070
p5PULSAR_UI5050

​
Adding New Entries

  1. Open data/projects.js.
  2. Append a new object to the array before the export statement.
  3. Choose a unique id following the p{n} convention (e.g. "p6").
  4. Set dataSource to "LIVE", "MOCKED", or "SAMPLE" as appropriate.
  5. Pick coordinates that place the node in an unoccupied region of the orbital diagram — check the table above to avoid overlap.
  6. Save the file; the Projects section and OrbitalDiagram will both update automatically.
// data/projects.js  — add the new object inside the array
{
  id: "p6",
  name: "QUANTUM_LEDGER",
  tagline: "Immutable audit-log service",
  description:
    "An append-only event store built on Postgres logical replication. "
    + "Provides tamper-evident history for any microservice with a single SDK call.",
  stack: ["Node.js", "PostgreSQL", "TypeScript", "gRPC"],
  sourceUrl: "https://github.com/you/quantum-ledger",
  dataSource: "LIVE",
  coordinates: { x: 70, y: 80 },
}
Spread projects evenly across the 100 × 100 coordinate grid so the orbital diagram nodes don’t cluster. Aim for at least 15 units of separation between any two x or y values.

​
Field Reference

​
id
string
required
Unique identifier for the project. Follow the p{n} pattern (e.g. "p1", "p2") so that internal links and any future routing logic stays consistent.
​
name
string
required
Display name rendered as the card heading. Convention is ALL_CAPS_SNAKE_CASE to match the terminal/space-ops aesthetic of the portfolio.
​
tagline
string
required
A short, punchy phrase (aim for under 40 characters) shown beneath the name on the project card.
​
description
string
required
A full-paragraph description of the project. Used in the expanded card or modal view. Should cover what the project does, why it exists, and any interesting technical detail.
​
stack
string[]
required
Array of technology names rendered as tag chips on the card. Keep each entry short (one word or a short abbreviation) for readable wrapping.
​
demoUrl
string
URL to the live demo. Use "#" as a placeholder while a demo is not yet deployed, or omit the key entirely to hide the Demo button on the card.
​
sourceUrl
string
URL to the source code repository. Omit the key for private or proprietary projects — the Source button will not be rendered.
​
readmeUrl
string
Optional link to a standalone README or documentation site, separate from the main repository URL.
​
dataSource
"LIVE" | "MOCKED" | "SAMPLE"
required
Communicates the fidelity of the demo environment to visitors:
  • LIVE — The demo is connected to a real, production-grade API or backend. Data shown reflects actual system state.
  • MOCKED — The demo runs against fabricated data designed to look realistic. Suitable for portfolio display when a live backend is not cost-effective to maintain.
  • SAMPLE — The project is a placeholder entry. The demo or source link may not yet be available.
​
coordinates.x
number
required
Horizontal placement of the project node on the OrbitalDiagram, expressed as a percentage (0 = left edge, 100 = right edge).
​
coordinates.y
number
required
Vertical placement of the project node on the OrbitalDiagram, expressed as a percentage (0 = top edge, 100 = bottom edge).

Build docs developers (and LLMs) love

Get started for freeTalk to us