Building YasirOS — a personal operating system in the browser

A portfolio is usually a document. A document tells you what someone did. A system shows you how they think — what they consider essential, what they consider noise, where they spend complexity and where they refuse to. That gap is why I rebuilt mine as YasirOS, a browser-native operating system.

¶The six laws

Every system worth building has a small set of invariants that everything else respects. For YasirOS they are:

1. Everything is an application.
2. The terminal is sovereign.
3. State is real (persisted, not faked).
4. Actions have consequences everywhere — one effect bus, many surfaces.
5. The system grows by registration, not patches.
6. Precision over spectacle. Tokens, not ad-hoc CSS.

¶The architecture in one picture

UI clicks and terminal commands dispatch the same Effect objects through a shared bus. The two surfaces cannot diverge because they share the codepath that mutates state.

1export function dispatch(effect: Effect): void {
2  useStore.getState()._setLastEffect(effect);
3  apply(effect); // the only place mutation happens
4}
5 
6function apply(effect: Effect): void {
7  useStore.getState()._apply((draft) => {
8    switch (effect.type) {
9      case 'open-app': openApp(draft, effect.appId); return;
10      case 'close-window': closeWindow(draft, effect.windowId); return;
11      case 'focus-window': focusWindow(draft, effect.windowId); return;
12      // …
13    }
14  });
15}

¶Why an OS metaphor

The OS metaphor sounds gimmicky until you notice what it unlocks: windows compose, the dock is a process list, the menu bar is a system tray, the terminal is a programmable user. Each pattern is decades-old and battle-tested. Building a portfolio on top of those primitives is cheaper than inventing a "creative scroll experience" — and far more honest.

¶What it cost

Three things were expensive enough to need their own writeups (later in this series): the boot sequence, the windowing model, and the terminal command pipeline. Each one is a small kernel of its own.

A portfolio tells you what someone did. A system shows you how they think.

¶Where to next

The rest of this series is a tour of those subsystems — what I tried first, what didn't work, and the principles that survived the rewrite. Subscribe to the RSS feed if you want the next post to find you.