DEV Community

Cover image for I built a tool that visualizes your code step by step — Recursive
Seonghyeon Kim
Seonghyeon Kim

Posted on

I built a tool that visualizes your code step by step — Recursive

Recursive is a open-source tool that lets you paste your code and watch it execute line by line. No setup, no breakpoints — just paste and run.

Try it out →

What it does

  • Paste a function (or plain code) and it runs step by step
  • Variables are tracked and displayed at every step
  • Arrays are shown as a grid with per-cell change highlighting
  • Recursive functions are visualized as a call tree
  • Parameters are auto-detected — just fill in the values and hit run

Quick example

Paste this Python code:

def bubble_sort(arr):
  n = len(arr)
  for i in range(n):
    for j in range(0, n - i - 1):                               
      if arr[j] > arr[j + 1]:                               
        arr[j], arr[j + 1] = arr[j + 1], arr[j]           

  return arr
Enter fullscreen mode Exit fullscreen mode

Enter [5, 3, 8, 1, 2] as the argument, hit run, and step through the execution. You'll see exactly how the array changes at each swap.

Supports Python and JavaScript, TypeScript

  • Python — standard library works out of the box (collections, functools, itertools, etc.)
  • JavaScript / TypeScript — types are stripped automatically, built-in APIs all work

Embed anywhere

You can embed the execution view in your blog, Notion, or Obsidian: Great for algorithm tutorials or study notes.

Open source

The entire project is open source. Feature requests, bug reports, and PRs are welcome.

If you found it useful, a ⭐ on GitHub would mean a lot!

Top comments (0)