whatisgithub

What is markcodesos?

markshenouda/markcodesos — explained in plain English

Analysis updated 2026-05-18

2CAudience · developerComplexity · 4/5Setup · moderate

In one sentence

A personal portfolio website built as a tiny operating system, drawn pixel by pixel in C and compiled to WebAssembly, that also boots on real hardware.

Mindmap

mindmap
  root((MarkCodesOS))
    What it does
      Mini OS in a browser tab
      Pixel drawn interface
      Boots bare metal too
    Tech stack
      C
      WebAssembly
      JavaScript
    Use cases
      Interactive portfolio
      Low level graphics learning
      Cross platform C core
    Audience
      Developers
    Setup
      npm run dev
      Open localhost
      Explore apps and games

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Explore how a full desktop style interface can be built without HTML, CSS, or a framework.

USE CASE 2

Study how a single C codebase can target both WebAssembly in a browser and bare metal x86 hardware.

USE CASE 3

Use as a portfolio format that lets visitors interact with a mini OS instead of a static page.

USE CASE 4

Learn low level graphics programming techniques like drawing windows and text into a pixel buffer.

What is it built with?

CWebAssemblyJavaScript

How does it compare?

markshenouda/markcodesoscode-my-spec/ear_witnessdouglascorrea/syscall-agent
Stars222
LanguageCCC
Setup difficultymoderatehardmoderate
Complexity4/54/54/5
Audiencedeveloperdeveloperdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · moderate Time to first run · 30min

Requires a C toolchain and WASI SDK to build the WebAssembly binary from source.

So what is it?

MarkCodesOS is a personal portfolio website that looks and behaves like a small desktop operating system running inside your browser tab. Instead of using normal web building blocks, the entire interface, every window, icon, titlebar, and letter of text, is drawn pixel by pixel by C code compiled to WebAssembly onto a single canvas element. There is no HTML layout for the interface itself, no React, and no CSS doing the visual work. The project is roughly 13,000 lines of C code that compiles down to a WebAssembly file of about 59 kilobytes, plus a small JavaScript helper of around 430 lines. That JavaScript layer only loads the compiled program, forwards keyboard, mouse, and touch input into it, and copies the finished picture onto the screen once per animation frame. It does not contain any of the actual app logic. Remarkably, the same operating system core can also boot directly on a real x86 computer with no browser at all, using QEMU for testing, because the parts that talk to the outside world are isolated behind a small interface that each platform implements differently. Once running, you can double click desktop icons or use a dock to launch apps, search everything with a keyboard shortcut similar to Spotlight on a Mac, drag and resize windows, and snap them to the edges of the screen. Your wallpaper choice and open windows are remembered even after you reload the page. A built in terminal supports basic commands to browse a small in memory file system. Included apps and games range from a calculator, notes, and a pixel art painting tool to classic games like Snake, 2048, Minesweeper, Tetris, Pong, Breakout, and Tic-tac-toe. To try it yourself, you run a single command that builds the WebAssembly file, assembles the output folder, and serves it locally, then open the given address in a browser. The project's source is organized into a shared operating system core, the two platform specific ports for web and bare metal x86, and a folder of individual apps and games.

Copy-paste prompts

Prompt 1
Explain how the host.h platform ABI lets the same C code run in both a browser and bare metal x86.
Prompt 2
Walk me through what main.js does each animation frame to display the framebuffer.
Prompt 3
Help me build and run this project locally using npm run dev.
Prompt 4
Explain how the window manager code in wm.c handles dragging, resizing, and snapping windows.
Prompt 5
Show me how a new app or game could be added to this project's apps folder.

Frequently asked questions

What is markcodesos?

A personal portfolio website built as a tiny operating system, drawn pixel by pixel in C and compiled to WebAssembly, that also boots on real hardware.

What language is markcodesos written in?

Mainly C. The stack also includes C, WebAssembly, JavaScript.

How hard is markcodesos to set up?

Setup difficulty is rated moderate, with roughly 30min to a first successful run.

Who is markcodesos for?

Mainly developer.

Open on GitHub → Ask about another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.