Glass AI Tutor

Inspiration

We've friends in high school who always get confused/stuck with the program when it comes to logic. We always had to explain them the code and how the logic worked which was a time consuming process. So, we decided why not make an app for them that would make both our lives easier? An app that would visually explain them how the code works/detect any potential bugs/errors and help them be a better developer.

What it does

It takes in any code snippet and gives you a few options: explain, visualize, and practice. To get a detailed explanation of the code, click on the explain button. To visualize/get a deep understanding of how the code is working behind the scenes, use the visualize feature. To get more practice problems that are similar to your code, click on practice.

How we built it

We used Next.js for frontend and Gemini 2.5 Flash API for backend. Also used TraeAI to get the basic structure as fast as possible and build on top of that.

Challenges we ran into

We kept facing challenges with the Gemini API as for a long time it wouldn't give the user a detailed explanation; we had to make the prompts detailed for each of the buttons that we have to give user the best output.

What we learned

We made API endpoints in the backend. The code is sent to the appropriate endpoint and a structure output is returned which is displayed to the user. We were able to make GET and POST requests successfully.

Built With

• gemini
• nextjs