reAlize

Proactive error identification with color-coded severity values
Active reAlize bug resolution session with actionable insights
The dual-panel reAlize interface (assistant chat + task planning)

Inspiration

First, there was VS Code. Then ChatGPT. Then Cursor. But one issue still remained.

Debugging is where momentum dies: context switches between console, call stack, variables, breakpoints, and editor tabs make it slow to form a hypothesis, test it, and iterate. We wanted an assistant that sits inside VS Code, sees the same live state we do, and proposes concrete, safe next steps, so developers can realize issues faster with fewer manual hops.

No more copying and pasting into an LLM to ask "What is wrong with my code?". No more asking Cursor or Windsurf to fix the bug.

Introducing... reAlize

What it does

reAlize is an AI-assisted debugger extension for VS Code. It consists of a control panel that:

Runs in the background to notify users of more than just compile/runtime errors, catching unintended consequences and slip-ups to keep programmers in the flow.
Integrates natively with the VS Code debugger, with the ability to access runtime variables + call stack, set/clear breakpoints, step/continue, and propose scoped code edits.
Unlike other AI developer assistants, reAlize sees more than just your code: it actively synergizes real-time data from the debugger, call stack, and other contextual sources to provide resolutions that would otherwise go unnoticed by standard AI agents that only focus on the surface.

How we built it

VS Code Extension (JavaScript, CommonJS): extension.js orchestrates activation, webview, and the step executor.
Webview UI (HTML/CSS/JS): a lightweight control panel that sends/receives messages, displays snapshots, steps, and results.
Debug data collection: a DebugService aggregates call stack frames, variables, breakpoints, console output, open editors, and workspace context via the VS Code Debug API.
AI planning: an OpenAI-backed client (ai.js) prompts the model to return machine-actionable JSON (title, summary, explanation, and steps). Steps support commands, breakpoint changes, and file edits with full-file proposals when needed.

Challenges we ran into

Getting reliable, strictly valid JSON from the model and designing prompts that produce deterministic, composable steps.
Planning the user interface and experience given space limitations and guaranteeing accessibility of core features.
Producing iterative improvements leading to high-quality outputs via the automatic setting of breakpoints and re-running code with improved context.

Accomplishments that we're proud of

A clear, compact snapshot that makes hypotheses faster to form and test.
Uses diff-match-patch for more accurate code modifications.
Moves beyond compile & runtime errors by reviewing code in the background and identifying unintended code consequences early.
Practical file-edit proposals that are easy to review and apply.
A modern, dependency-light webview that feels native and stays responsive.

What we learned

Difficulty of implementation doesn't equate to impact: small UI touches (retaining context, concise summaries, actionable labels) provide an outsized impact on flow and improved user experience.
The importance of project management and organization to avoid merge and other conflicts in a collaborative development environment.

What's next for reAlize

Broader language/runtime support and smarter variable/heap visualizations.
Better edit UX: inline diffs, quick rollback, and multi-file proposals with dependency awareness.
First-class test assistance: generate/repair unit tests and validate fixes automatically.