Understanding even a simple line like `let sum = num1 + num2;` is nearly impossible until you invest some amount of time reading/learning to understand how a computer runs this stuff. I'm building this tool to bridge this gap with an execution environment that just explains everything it's doing as it runs code.
It's like a debugger, but goes further by explaining each step in beginner-friendly terms, so you can see exactly what's happening behind the scenes.
Some other examples that demonstrate how this work: * Boolean Conditions: https://www.codesteps.dev/learn-javascript/editor?s=HOVtlD * Area of a circle: https://www.codesteps.dev/learn-javascript/editor?s=ed6l8w * Fibonacci (recursion): https://www.codesteps.dev/learn-javascript/editor?s=vEmzDo
Some technical if you're wondering how this works: This is built as a tree-walking interpreter that pauses at every node of the AST instead of running the interpreter in a loop. During this pause, I examine the current node, parent node, children, state stack, call stack, and run a bunch of if/else statements to either skip explaining, or to hack together some strings to explain what's happening at this stage in the execution and what the next steps are. No LLMs involved in generating the explanations.
If you teach people to code, I'm very interested in hearing if you would find this useful. If you're looking to learn how to write/read code, I would also love to hear if you find this helpful.
lasgawe•2h ago