Max Flow Graph Algorithm Visualizer
Making a graph algorithm you can actually see.
The Max Flow problem is one of those algorithms that's hard to grasp from pseudocode alone. I built this visualizer because I wanted to understand it better myself — and because I believe if you can't show something, you don't fully understand it yet.
Graph algorithms are taught through notation and dry examples. There's a gap between "knowing the steps" and having an intuition for why it works. A visual tool that lets you build a graph and watch the algorithm run closes that gap.
No framework, by design
I chose vanilla TypeScript and CSS deliberately. A framework would have abstracted away exactly the parts I wanted to understand — the DOM manipulation, the rendering loop, the state management.
Algorithm first, UI second
Implemented the Ford-Fulkerson algorithm cleanly before touching the visualization layer. This kept the logic pure and testable independent of the rendering.
Interactive graph building
Designed the UI so users can draw their own graphs — add nodes, connect edges, set capacities — then run the algorithm step by step and watch the flow be found.
A working interactive visualizer deployed on Netlify. Used it to study for exams and shared it with classmates who found it useful.
Building something from scratch without a framework forces you to understand every layer. It's slower, but the knowledge sticks differently.