See how your stack actually works
DevTools turns the systems developers rely on every day — Git, the JavaScript runtime, AWS, Kafka, and the wire itself — into interactive visual simulations. Run real commands, watch the state change, and build a mental model you can trust.
The tools
One simulation per subsystem. Git is live, JavaScript's event loop is ready to try, and the rest are in active development.
Git Visualizer
Run add, commit, merge, rebase, cherry-pick and more against a simulated repository — and watch the commit graph, branches and remote react to every command.
Open toolJavaScript Internals
Step through the JavaScript runtime — call stack, Web APIs, queues and the event loop. Event Loop and the Array node canvas are live; Scope, Event and Render are next.
PreviewAWS Playground
Wire core AWS services together on an interactive canvas and watch how requests, queues and storage interact across your architecture.
PreviewKafka Playground
Design topics, partitions, producers and consumer groups on an interactive canvas and watch messages flow through the cluster.
PreviewWeb Communication
Follow a request across the wire — DNS, handshakes and HTTP visualized hop by hop, all the way down to the packets.
PreviewWhy simulations
Reading about infrastructure is not the same as watching it react.
Real semantics
Each tool is backed by a simulation engine that mirrors how the real system behaves — not a slideshow of static diagrams.
Break things safely
Everything runs in your browser against simulated state. Force-push, rewrite history, drop a connection — then reset and try again.
Learn by doing
Every action is visualized step by step, so the mental model comes from what you see happen, not what you memorize.
Start with Git
The Git Visualizer is ready today and JavaScript's event loop visualizer is close behind. AWS, Kafka and Web Communication are in active development — preview what's coming from their cards above.
Try the Git Visualizer