Error Translator

Don't lose hours to cryptic console errors. Aether Log Core intercepts raw stack traces and instantly translates them into actionable code fixes inside your editor to maintain your flow.

Comment

Inspiration

Every developer knows the frustration of losing momentum because they are stuck deciphering a cryptic stack trace. We were inspired to build a tool that stops engineers from burning out over unreadable console errors. We wanted to eliminate the tedious process of deciphering error documentation so developers can stay in their flow state and focus on actually writing code.

What it does

Aether Log Core is an integrated diagnostic pipeline. It gathers all error logs and instantly translates them into a clear English analysis. Instead of just pointing out the error, it generates a step-by-step resolution blueprint and displays it directly inside your VS Code workflow.

How we built it

We built a custom Site (to extension) using TypeScript to bring the tool directly into the developer's environment. The user interface is a responsive dashboard built with React and Vite, which we put into the editor using a Webview panel. Our backend is powered by Python, using an AI engine to parse the chaotic log output, alongside Firebase for database management.

Challenges we ran into

Integrating modern web frameworks into a native editor environment was tough. We had to battle VS Code's notoriously strict Content Security Policies (CSPs) that blocked our local dev servers, and navigate the quirks of the extension compiler to successfully render our compiled React bundle inside an isolated iframe. Not only that, but implementing the extension was a challenge we couldn't overcome due to certain restrictions of our files.

Accomplishments that we're proud of

We are incredibly proud of successfully bypassing the Webview security blocks to inject a fully functional React dashboard directly into a native VS Code tab. Building a seamless, end-to-end pipeline that connects a Python backend, an AI parsing engine.

What we learned

We learned the deep technical side of VS Code extension development and workspace management. We also gained hands-on experience handling strict Content Security Policies, managing local resource routing, and bridging separate frontend and backend architectures into a single, cohesive developer tool.

What's next for Error Translator

We plan to implement a "one-click fix" feature that automatically applies the AI-generated code solutions directly to the user's source code as well as a VS code extension to use live during production.

Built With

Share this project:

Updates