Inspiration
Most AI coding tutors are just too nice. They tell you "good job" even when your code is messy or inefficient. That might help you learn basic syntax, but it completely fails to prepare you for the actual stress of a real coding interview. I wanted to build something that acts like a real, strict interviewer—not a friendly chatbot. So I built O(Nope) to give developers a realistic, high-bar prep tool, along with a fun "Code Roast" mode for a quick reality check.
What it does
O(Nope) has five simple modes:
- Dashboard: Keeps track of your "Ego Score" (starts at 100 and goes down when you make mistakes).
- The Code Roast: You paste in broken code, and it gives you a sarcastic, funny roast pointing out your exact syntax errors, before showing you the corrected code.
- Forensic Visualizer: A step-by-step code runner. You can type Python code and run it line-by-line, watching how your variables change directly inside the code editor.
- Think Out Loud: You talk through how you would solve a problem using your microphone. The app transcribes it and grades your explanation based on how well you covered the optimal solution and complexities.
- Live Interview: A real-time, voice-to-voice mock interview with a strict AI Senior Engineer. It acts just like a real interviewer and talks back to you with zero lag.
How I built it
I built the app using:
- Front end: React and Vite with Framer Motion for a clean, retro-cyberpunk look.
- Back end: FastAPI in Python.
- AI engine: Groq API (using LLaMA 3.3) for super-fast, sub-second responses so the voice calls feel natural.
- Speech-to-Text: Groq Whisper API to transcribe microphone audio instantly.
- Code Visualizer: Python's built-in
sys.settraceto safely track variables and code lines as they run in the background.
Challenges I ran into
- Audio Lag: Getting voice responses to feel instant was tough. I had to optimize how audio files are recorded and sent to the API so there’s no awkward waiting.
- Code Editor Sync: Synchronizing Python code execution in the backend with the highlighted lines in the front-end code editor took a lot of work with React hooks.
- Getting clean data: Forcing the AI to reliably output clean grading scores without adding extra conversational text took a lot of prompt tweaking.
Accomplishments that I'm proud of
- Getting sub-second responses from the AI, which makes the live interview feel like a real conversation.
- Building the Forensic Visualizer from scratch using Python's tracing tools.
- Creating a unique, retro-cyberpunk design that looks completely different from a standard, boring chatbot.
What I learned
- How to handle audio recording and fast transcription between a browser and a Python server.
- How to safely run and trace user-submitted code in a secure sandbox.
- The importance of keeping prompts simple and structured to get reliable AI grading.
What's next for O(Nope)
- Adding support for other languages like JavaScript and Java.
- Adding a wider range of coding problems.
- Generating a real-time animated face/avatar for the AI interviewer during the voice call.
Built With
- css3
- edge-tts
- fastapi
- groq
- html5
- monaco-editor
- python
- react
- render
- sqlalchemy
- sqlite
- typescript
- vercel
- vite
- whisper-api
Log in or sign up for Devpost to join the conversation.