dvxb.io — Devkumar Banerjee

Personal portfolio featuring a browser-based x86 virtual machine, retro terminal UI, and interactive shell with 36 commands.

Features

• Interactive terminal — Built with xterm.js. Supports 36 commands (whoami, neofetch, cat, ls, vm, echo, clear, history, crt, noise, weather, hn, md, about, fortune, cowsay, matrix, ai, etc.) with ANSI truecolor output, tab completion, command auto-correction, and a virtual filesystem.
• x86 VM in browser — Uses the v86 WebAssembly emulator to boot a Buildroot Linux image. Runs in the terminal with full serial console. Type vm to start.
• Neofetch-style dashboard — Displays ASCII art (pixel portrait), system info, resume highlights (education, research, work, skills, certs), and a 16-color block palette on boot and via neofetch / cv.
• Portfolio AI assistant — Type ai <prompt> to query the assistant via a Cloudflare Worker proxy to a Groq-hosted cloud model (default), with optional local ONNX models switchable through ai-model. Network access is required in both modes. ai-models lists available models.
• Thought orbs — Dotted 3D marks on a plain 2D canvas, ported from thinking-orbs (MIT). A scan-sweeping globe shows while an ai model downloads, then an undulating ribbon tumbles while it generates; the mark in front of dvxb.io in the nav bar is a lattice sphere that scrambles and clicks back to solved. Both pause offscreen and fall back to a static frame under prefers-reduced-motion.
• Hacker News reader — hn fetches and displays the top 30 HN stories with scores and comment counts in a formatted ANSI table.
• Weather forecast — weather fetches your location (browser geolocation or IP fallback) and displays current conditions from Open-Meteo. -f for Fahrenheit.
• Markdown viewer — md <url> opens any markdown URL in a fullscreen rendered viewer (marked + DOMPurify, dark theme, GFM).
• CRT / noise overlays — crt toggles scanline overlay, noise toggles SVG turbulence grain texture for a retro CRT feel.
• Buildroot Linux VM — Boots a real Linux kernel inside the terminal. Networking via HTTP fetch backend (no raw TCP). 9p virtio filesystem mounts /mnt from a static rootfs.
• 3D particle background — Three.js GPU-accelerated particle system with connection lines, mouse interaction, and shader-based rendering.
• Scroll animations — Anime.js powers section reveals on scroll, social link hover effects, skill bar fill animations, and magnetic text.
• Aura orbs — Floating blurred radial gradients that drift behind content sections via CSS animations.
• Projects section — 4 spotlight cards (TheAggieMap, PCPG Analyzer, Doctor-Robot/TIDALHack, Neural-Networks-From-Scratch) with 3D tilt hover, shimmer sweep, and "View More on GitHub" links.
• Generated resume pages — /resume, /cv, and /man/ (a man-page styled resume plus the dvxb.io(7) site manual) are built in CI from the private Full-CV TeX source via a custom LaTeX→HTML parser. assets/resume.pdf and assets/cv.pdf are compiled with Tectonic — nothing resume-related is committed.
• Contact section — GitHub, LinkedIn, Keybase, resume/CV (HTML + PDF), and GPG public key download.
• Responsive design — CSS token-based design system with mobile breakpoints.

Architecture

Project Structure

├── index.html              Main page
├── css/
│   ├── tokens.css          Design tokens (colors, spacing, typography)
│   ├── base.css            Reset, global styles
│   ├── components.css      Section styles (hero, projects, contact, etc.)
│   ├── layout.css          Grid, sidebar, footer
│   ├── terminal.css        Terminal container, xterm overrides
│   ├── doc.css             Generated resume/man page styles
│   └── responsive.css      Media queries
├── js/
│   ├── main.js             Entry point — initializes all modules
│   ├── terminal.js         xterm.js setup, mode switching (local/v86)
│   ├── shell.js            Virtual filesystem, command handler, neofetch, ASCII art
│   ├── v86-launcher.js     v86 config, boot/stop VM, serial I/O
│   ├── three-particles.js  Three.js particle system
│   ├── animations.js       Anime.js scroll reveals, hover effects, skill bars
│   ├── orb.js              Dotted thought-orb marks (nav bar + AI status)
│   └── nav.js              Section navigation, scroll spy, mobile menu
├── tools/
│   ├── tex2html.mjs        Custom LaTeX → HTML parser (throws on unknown macros)
│   ├── roff2html.mjs       Man page (roff) → HTML renderer
│   ├── build.mjs           Generates resume.html, cv.html, man/ from Full-CV
│   └── build-pdf.mjs       Compiles assets/*.pdf with Tectonic
├── templates/
│   ├── shell.html          Themed page template (particles + glass nav)
│   └── man.html            Terminal-style template for man pages
├── assets/
│   ├── resume.pdf          Generated by build-pdf.mjs (not committed)
│   ├── cv.pdf              Generated by build-pdf.mjs (not committed)
│   ├── gpg.asc             GPG public key
│   └── v86/
│       ├── v86_all.js      v86 emulator library
│       ├── v86.wasm        v86 WebAssembly binary
│       ├── seabios.bin     BIOS firmware
│       ├── vgabios.bin     VGA BIOS firmware
│       ├── buildroot-bzimage.bin  Buildroot Linux kernel + initrd
│       ├── 9p-rootfs/      9p virtio shared filesystem
│       │   ├── src/        Source files for rootfs
│       │   ├── out/        Generated fs.json + .bin blobs
│       │   └── rebuild.sh  Regenerate out/ from src/
│       └── cors-proxy-worker.js  Cloudflare Worker for VM HTTP networking
└── dvxb.io.7               Man page source for /man/dvxb.io.7

Generated Pages (tools/, templates/)

resume.html, cv.html, man/index.html, and man/dvxb.io.7.html are generated from the private aptitudepi/Full-CV repo and committed nowhere — they exist only inside the Pages artifact.

• tools/tex2html.mjs parses the Full-CV macros (\resumeItem, \resumeSubheading, \section, inline math, itemize, …). It throws a TexParseError on anything it can't render, which lets CI detect content the parser has grown out of sync with.
• tools/roff2html.mjs renders dvxb.io.7 into a terminal-styled man page.
• tools/build.mjs wraps each body in templates/shell.html (particles + glass nav) or templates/man.html (terminal theme). FULL_CV_DIR points at the checkout.
• tools/build-pdf.mjs strips the pdfTeX-only lines (\pdfgentounicode, \input{glyphtounicode}) and compiles assets/resume.pdf/assets/cv.pdf with Tectonic.

Terminal Shell (js/shell.js)

• Virtual filesystem — A Map of paths to content strings (e.g., /home/db/about.txt). Supports cat and ls.
• Commands (36): whoami, hostname, date, uptime, pwd, uname, cat, ls, echo, clear, neofetch, resfetch, about, fortune, cowsay, help, history, crt, noise, weather, hn, md, cv, matrix, vm, ai, ai-models
• Neofetch — Renders ASCII art alongside system and resume info lines. The art is a 52-row pixel portrait with per-pixel ANSI true color.
• Boot sequence — On page load, prints simulated kernel messages, then runs neofetch and shows the prompt.
• Auto-correction — Mistyped commands are caught with Levenshtein distance ≤ 2 and suggest the closest match.
• Tab completion — Tab cycles through command names, VFS paths, and ./-prefixed files. Bell on no match.
• Command history — Up/down arrows cycle through previous commands. history prints the full list.

x86 VM (js/v86-launcher.js)

• Uses the V86 constructor with WASM, a 64MB heap, NE2000 network via fetch backend, 9p filesystem from a static JSON manifest, and BIOS/VGA BIOS/kernel images.
• Serial I/O: serial0-output-byte callback writes to xterm, serial0-input sends keystrokes (including control characters) from the terminal.
• Ctrl+C, Ctrl+D, and other control codes pass through to the VM's serial port.
• The 9p host9p on /mnt boot message is cosmetic — the mount succeeds despite the duplicate-attempt warning. Inside the guest, re-mount idempotently: mountpoint -q /mnt || mount -t 9p host9p /mnt (a bare re-mount prints Device or resource busy).

Networking

• The VM uses the v86 fetch network backend, which proxies HTTP/HTTPS through the browser's fetch() API.
• A Cloudflare Worker (cors-proxy-worker.js) deployed at 0.supernovadkb.workers.dev acts as a CORS proxy, restricted by origin allowlist (dvxb.io, *.dvxb.io, localhost:*).
• Only HTTP/HTTPS is supported — raw TCP (telnet, SSH) is not available due to browser fetch() limitations.

3D Particles (js/three-particles.js)

• Renders 600 particles with velocity, age, and seed attributes per vertex in a custom BufferGeometry.
• Two shader programs: update (position/velocity integration) and render (smooth circles with fading).
• Mouse hover creates a repulsion/attraction force. Connection lines drawn between nearby particles.
• Uses a GPU transformFeedback pattern for all computation on the GPU — no CPU physics loop.

Animations (js/animations.js)

• reveal elements fade up in a staggered cascade via IntersectionObserver.
• Skill bars animate from 0 to target width with Anime.js scale transforms.
• Social links spring-scale on hover.
• Magnetic text — Section headings subtly shift toward cursor with lerped spring physics via requestAnimationFrame.
• Aura orbs — Per-section ::before/::after radial gradients with filter: blur(60px) and slow CSS drift animation.
• Galaxy button circle-morph — Contact buttons morph from circle to full-width on click with Anime.js.
• MagicCard 3D tilt — Project cards rotate toward cursor with spring physics, sibling dimming, and shimmer sweep.

CSS Architecture

Token-based design: tokens.css defines color palette (slate-gray, blue, violet, green), spacing scale (4px base), font stack, and breakpoints. Component styles import these tokens via CSS custom properties.

Running Locally

python3 -m http.server 8000
# Open http://localhost:8000

No build step required for the main page — the site uses ES module <script type="module"> natively.

To regenerate the resume/CV pages locally (needs a Full-CV checkout beside this repo):

bun tools/build.mjs

This writes resume.html, cv.html, and man/ (all gitignored). The PDF build additionally needs tectonic on the PATH:

VM Filesystem

The 9p rootfs is compiled from assets/v86/9p-rootfs/src/. After modifying source files:

cd assets/v86/9p-rootfs
./rebuild.sh

This regenerates out/fs.json and out/*.bin (content-addressed blobs).

Deployment

Deployed via GitHub Pages from the main branch with a custom domain (dvxb.io) and CNAME record. The Pages artifact is built entirely in CI — static.yml checks out aptitudepi/Full-CV (needs the FULL_CV_PAT secret, a fine-grained PAT with Contents: Read on that repo only), runs the generators, and uploads the result. A daily schedule rebuilds so the resume/CV track Full-CV changes without a site push.

After each successful deploy, CI generates sitemap.xml from tools/site-urls.mjs, publishes an IndexNow key file from the INDEXNOW_KEY secret, and POSTs that same URL list to api.indexnow.org (Bing, Yandex, and other partners — not Google). Committed robots.txt points crawlers at the generated sitemap for every engine, including Google.

---

Built with v86, xterm.js, Three.js, Anime.js, and Cloudflare Workers.

The terminal sparkline command draws the commit-activity chart with lightweight-charts, loaded lazily from jsDelivr only when the command runs (never at page load). Powered by TradingView Lightweight Charts™.