Skillz's Computer

March 1, 2026 · View on GitHub

A personal portfolio website disguised as a fully interactive Windows XP desktop, built with React.

Try it live

Features

Desktop Environment

  • Draggable, resizable windows with minimize, maximize, and close
  • Start menu with nested submenus mirroring real XP structure
  • Taskbar with running app buttons, system tray clock, and volume control
  • Desktop icons with click-to-select and drag-to-select (rubber band)
  • Window focus and z-ordering (click to bring to front)
  • Global volume control with mute, persisted to localStorage

Boot & Login Sequence

  • Animated boot screen with XP loading bar
  • Login screen with two user accounts (Skillz and Administrator)
  • Welcome screen with transition to desktop
  • Log Off and Turn Off Computer dialogs with Switch User support
  • Shutdown/restart animation (grayscale fade) and reboot loop
  • BSOD triggered by any unhandled JS error, with the real error in the stop code

Applications

AppDescription
Internet ExplorerIn-app browser with address bar, navigation history, back/forward, and toolbar. Loads any URL in an iframe.
MinesweeperFully playable with Beginner, Intermediate, and Expert difficulties. Flag/question marks, chord clicking, timer, and mine counter.
My ComputerNavigable mock file explorer with folders, back/forward/up navigation, sidebar details, and address bar.
NotepadText editor with File (New/Open/Save), Edit (Time/Date), Format (Word Wrap), and cursor position tracking.
WinampReal Winamp 2.x player via the webamp library with a 5-track playlist.
PaintFull MS Paint via jspaint.app embedded in an iframe.
Media PlayerCustom audio/video/image player with real-time frequency visualizer, drag-and-drop file import, sortable playlist, seek bar, and loop toggle.
3D PinballSpace Cadet pinball via 98.js.org WebAssembly build.
Voltorb FlipThe Pokemon HG/SS card game, hosted locally with iframe volume sync.
PictoChatEmbedded chat app from chat.aduncan.dev.
About MeXP wizard-style portfolio page with skills, projects, and contact info.
???egg... open it and find out...

Audio

System sounds play for boot, login, logoff, shutdown, errors, and the system tray balloon notification. All sounds respect the global volume and mute state.

Getting Started

Prerequisites

  • Node.js >= 14

Install & Run

git clone https://github.com/aduncandev/NewWebsite.git
cd NewWebsite
npm install
npm start

The dev server starts at http://localhost:3000.

Build for Production

npm run build

Output goes to dist/. Preview locally with:

npm run preview

Tech Stack

  • React 18 with hooks and useReducer for state management
  • styled-components for all styling
  • Vite for dev server and builds
  • webamp for the Winamp player
  • react-use for mouse tracking and window size hooks

License

The Windows XP name, artwork, and trademark are property of Microsoft. This project is provided for educational purposes only. It is not affiliated with and has not been approved by Microsoft.

Credits