navi text editor
navi introduction

Inspiration & Problem

When students learn to code, getting stuck on errors is normal. But with AI tools, students often copy-paste bugs into ChatGPT and copy the answer without understanding it—leading to an illusion of competence. In exams, students frequently Alt-Tab to cheat. We built Navi to keep exams honest while helping students actually learn how to debug their own code.

What it does

Navi is a desktop coding exam platform with three core components:

Locked Kiosk Environment: Runs fullscreen without toolbars. If a student tries to Alt-Tab or switch windows, a loud siren sounds from their laptop speakers, refocuses the screen, and alerts the teacher in real-time.
Three-Panel Layout: The problem on the left, Monaco Code Editor in the center, and a Socratic Hint Hub on the right.
Socratic Hint Engine: When code fails, Navi does NOT give away code answers. Instead, it analyzes Python syntax/runtime errors and asks guiding questions (e.g., "Look at line 12: what is the length of your list?") within a strict quota set by the teacher.
Room Code System: Teachers create an exam room on the web dashboard (e.g., NAVI-2026), and students join instantly.

How we built it

Desktop Client: Electron + React + TypeScript with Monaco Editor (@monaco-editor/react).
Backend & Logic: Python FastAPI handling room management, AST syntax validation, and WebSocket real-time alerts.
Audio Siren: Zero-dependency Web Audio API (AudioContext).
Code Execution: Piston API running sandboxed Python 3 scripts safely.

Challenges we ran into

Intercepting OS window blur events reliably across desktop platforms.
Designing prompt guardrails so the AI strictly asks guiding questions and never leaks code snippets.

Accomplishments that we're proud of

Successfully connecting the student's Alt-Tab blur event to trigger an instant alarm sound while pushing a real-time red alert to the teacher's dashboard via WebSockets.
Implementing Socratic hints that guide without spoiling the answer.