You are browsing as a guest. Sign up (or log in) to start making projects!

Devaansh's WebOS

  • 4 Devlogs
  • 2 Total hours

My WebOS is a browser-based desktop OS simulation with draggable windows, built with an embedded-systems and homelab-inspired portfolio aesthetic.

Open comments for this post

1h 17m 54s logged

Today we finished WebOS 1 and got it ready as the final Stardance submission.

The project is now a complete browser desktop instead of a rough prototype. It has a Windows-style desktop surface, custom desktop icons, a taskbar, a Start menu, draggable and resizable windows, minimize/close controls, focus layering, snapping, persistent layouts, and a public boot sequence that does not block visitors behind a password gate.

The custom apps are also in place:

  • Terminal with hardcoded commands like system info, ls, whoami, ping, and an easter egg.
  • System Monitor with animated fake CPU, RAM, uptime, graph traces, and themed process rows.
  • WordPad-style blog reader that opens copied Markdown posts from the portfolio site.
  • Profile, Research, Contact, and Welcome windows that make the OS feel like a personal portfolio system instead of a generic guide clone.

The final polish pass focused on making the project feel shippable. I replaced generic letter icons with custom SVG icons, tightened the taskbar and Start menu, checked window behavior across desktop, tablet, and mobile widths, tuned the animations, and verified that the static export works from the generated out/ folder.

The deployed site is live at:

https://os.devaanshpathak.com

At this point, WebOS 1 meets the mission requirements: it has multiple draggable windows, a distinct visual identity, extra features beyond the guide, no real login gate, and a public link for reviewers. The README now points to the live site, and the devlogs are ready for the Stardance portal.

0
0
2
Open comments for this post

23m 32s logged

Today I rebuilt the WebOS interface to feel much more like a real desktop OS. The old version had windows, but it still felt like a dashboard. This pass added a proper desktop surface with wallpaper, desktop shortcuts, a bottom taskbar, a Start button, pinned apps, active app buttons, and Windows-style window chrome.

I also completed the planned Phase 3 custom features.

The terminal app now supports hardcoded commands:

  • system info
  • ls
  • whoami
  • ping
  • stardance as the easter egg
  • plus help, clear, and reset-layout

Window snapping works by dragging windows to screen edges or corners. Edges snap to half-screen layouts, corners snap to quarter-screen layouts, and a blue preview rectangle shows the snap target before release.

The system monitor is now animated. It has fake CPU, RAM, IO, uptime, a moving bar graph, and a fake process table with WebOS-themed process names.

Window layout now persists in localStorage. Open apps, minimized state, window position, size, and z-index are saved and restored after reload. I also added a reset path through the terminal and Start menu.

The boot sequence is now more complete: BIOS-style firmware lines, fake hardware checks, portfolio disk mount, fake login handoff, and automatic transition to the desktop. It still does not require a password.

I copied portfolio assets from D:/devaansh-website into this repo:

  • public/portfolio/me.png
  • 29 Markdown blog files under public/portfolio/blogs/
  • a generated manifest.json for the blog reader

The new WordPad app loads that manifest, lists the copied Markdown files, and opens them in a readable document-style page.

Verification: npm run build passed, npm audit --omit=dev showed zero vulnerabilities, and Playwright confirmed terminal commands, WordPad loading, edge/corner snapping, layout persistence, and no page-level scrolling.

0
0
1
Open comments for this post

22m 38s logged

The biggest change is the core windowing system. WebOS now has a reusable window model that tracks app id, title, position, size, open state, minimized state, and z-index. Windows can be dragged by their title bars, resized from the lower-right handle, focused by clicking, minimized to the taskbar, closed, and reopened through launchers.

I also added the baseline desktop experience for the Stardance mission:

  • BIOS-style boot overlay with fake login text, but no password gate.
  • Desktop background with grid/scanline styling.
  • Top bar with clock, open-window count, and static export status.
  • Desktop launcher dock.
  • Taskbar for open and minimized apps.
  • Welcome window.
  • Profile window.
  • Research/SRE-Zero window.
  • System monitor-style app window.
  • Contact/uplink window.

For profile content, I used the local D:/devaansh-website repo instead of inventing copy. The WebOS apps now include Devaansh Pathak, CS + AI/ML student, reliable LLM agents, RL environments, evaluation systems, AI infrastructure, SRE-Zero, GitHub, LinkedIn, and email contact details.

I tested the implementation with npm run build, which passed and generated static routes. I also used Playwright against the local dev server to check multiple-window behavior: launching a window, minimizing and restoring from the taskbar, closing and reopening, dragging a window, resizing another window, and focus/z-index updates.

Next step: Phase 3 custom features, starting with the functional terminal commands and then window snapping/tiling.

0
0
2
Open comments for this post

19m 25s logged

Today I completed Phase 0 for WebOS 1, my Hack Club Stardance WebOS 1 mission project. The project now has a real Next.js and Tailwind CSS scaffold instead of only planning docs.

I added the App Router structure, TypeScript config, PostCSS/Tailwind setup, and a next.config.ts file with output: "export" so the site can stay compatible with static hosting. I also installed dependencies and generated the package lockfile.

The first page is a static desktop shell, not the full OS yet. It establishes the visual direction: dark terminal tones, compact desktop launchers, a boot-preview window, and a placeholder system monitor panel. This gives the project an embedded-systems and homelab identity before I start building actual window behavior.

I also checked the setup with a production build. npm run build completed successfully and generated static routes for / and /_not-found. npm audit originally flagged Next’s nested PostCSS version, so I added an override to use the patched PostCSS release and confirmed the audit now reports zero vulnerabilities.

Current state:

  • Next.js scaffold is in place.
  • Tailwind CSS is connected through PostCSS.
  • Static export is configured.
  • The base desktop layout shell exists.
  • No password gate or server runtime has been added.

Next step: Phase 1, building the core windowing system with draggable, resizable, focusable windows.

0
0
3

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…