Code Whisperer

Of course! Here's a complete draft for your Devpost submission based on the "Code Whisperer" project.

Inspiration

Every developer, from beginners to experts, has stared at a piece of code and struggled to understand its purpose or identify hidden bugs. We were inspired by the countless hours wasted on manual code reviews and debugging. We wanted to create an intelligent assistant that could not only explain code in plain English but also act as a proactive mentor, helping developers learn and write better code, faster.

What it does

Code Whisperer is an AI-powered coding companion that provides instant, insightful code review and explanation. Simply paste your code, and Code Whisperer:

• Explains Code: Breaks down complex code line-by-line in simple, understandable language.
• Conducts Code Reviews: Flags potential bugs, security vulnerabilities, performance issues, and style violations.
• Suggests Improvements: Offers rewritten, optimized versions of your code following best practices.
• Answers Questions: Allows you to ask follow-up questions about your specific code for deeper understanding.

It's like having a senior developer available for guidance 24/7.

How we built it

• Frontend: We built a responsive and intuitive web interface using Next.js, styled with Tailwind CSS and shadcn/ui components for a professional look.
• AI Engine: The core of Code Whisperer is powered by the Google Gemini API, leveraging its advanced reasoning capabilities to analyze and explain code across multiple programming languages.
• Backend & Deployment: Our serverless API routes built with Next.js handle the communication between the frontend and Gemini. The entire application is seamlessly deployed on Vercel.
• Database: We use MongoDB Atlas to store user session data, code review history, and feedback, allowing for a persistent and personalized experience.

Challenges we ran into

• Prompt Engineering: The biggest challenge was crafting the perfect prompts for the Gemini API to consistently return structured, high-quality feedback in our desired JSON format. It took significant iteration to get the right balance of detail and clarity.
• State Management: Handling the state for the code editor, the AI response, the loading states, and the chat-like "What-If" asker feature created complexity in the frontend logic.
• Context Window Limits: We had to implement smart truncation and logic to handle very long code files to stay within the model's context window while preserving the most relevant parts for analysis.

Accomplishments that we're proud of

• Creating a tool that we would genuinely use ourselves in our daily development workflow.
• Successfully integrating the Google Gemini API and MongoDB Atlas to build a full-stack application that is both powerful and user-friendly.
• Designing a clean, modern UI that makes a complex AI tool feel simple and accessible.
• Building a fully functional, multi-feature MVP within the tight time constraints of a hackathon.

What we learned

• The power and nuances of prompt engineering for guiding large language models to perform specific, structured tasks.
• How to effectively integrate multiple technologies (Next.js, Gemini API, MongoDB) into a cohesive and seamless product.
• The importance of scoping and user experience design in making an AI application feel intuitive rather than overwhelming.

What's next for Code Whisperer

• IDE Integration: Developing plugins for popular IDEs like VS Code and JetBrains to bring Code Whisperer directly into the developer's workflow.
• Team Features: Adding collaboration tools, allowing teams to share code reviews and maintain a knowledge base.
• Custom Rule Sets: Enabling companies to define their own custom coding standards and best practices for the AI to enforce.
• Repository-Level Analysis: Scaling the AI to analyze entire code repositories, providing architectural insights and identifying cross-file dependencies and issues.

Built With

• deepseek
• geminiapis
• lovable