StackSnap

StackSnap is an interactive Python execution visualizer with AI-powered code explanations. It allows you to trace the execution of Python programs line-by-line and get AI explanations for specific lines of code.

Setup

1. Environment: Ensure you have Python installed (preferably via Conda).

   conda create -n StackSnap python=3.11
   conda activate StackSnap

2. Dependencies: Install the required packages.

   pip install langchain-openai python-dotenv

3. API Key:

   • Create a .env file in the project root.
   • Add your Keywords AI API key:

     KEYWORDS_AI_API_KEY=your_api_key_here
     

Usage

To run the visualizer with your target Python script (e.g., program.py):

python server.py program.py

Then open your browser to http://localhost:8081/trace_vis.html.

Features

• Execution Tracing: Visualizes the call stack and variables at each step.
• Interactive Controls: Step through code forward/backward or jump to breakpoints.
• AI Explanations: Click "Explain with AI" to get a plain-English explanation of the current line's behavior and context.
• Live Editing: Edit the code in the browser and re-run the trace.

Project Structure

• tracer.py: Traces the execution of the target program and collects runtime data.
• visualizer.py: Generates the HTML visualization from the trace data.
• server.py: HTTP server that runs the tracer and handles API requests (including AI explanations).
• llm_call.py: Handles interactions with the LLM (via Keywords AI) for code explanations.
• program.py: Example target program.