CodeAider

CodeAider sidebar analyzing LeetCode's "Longest Common Prefix" with problem summary, solution sources, and AI intuition.

Inspiration

Every competitive programmer knows the frustration, you're stuck on a problem, and the temptation to look at the Solutions tab is overwhelming. But peeking at solutions kills the learning. We wanted an AI mentor that sits right beside you while you code, understands the problem you're working on, reads community solutions behind the scenes, and guides you with just enough help - intuition, patterns, complexity analysis - without ever handing you the answer.

What it does

CodeAider is a Chrome extension + Node.js backend that works on LeetCode and Codeforces in real-time: 1) Scrapes the problem statement, constraints, examples, and your code directly from the page 2) Fetches community solutions via LeetCode's GraphQL API and Codeforces's contest.status API 3) Sends everything to Gemini 2.5 Flash, which returns structured JSON with intuition, approaches (mapped to real solution sources), code understanding, and bug analysis 4) Locks the Solutions/Editorial tabs until you solve the problem -enforcing genuine learning 5) Auto-detects submission verdicts (Accepted, WA, TLE, etc.) via DOM observation and triggers post-submission analysis with next problem recommendations 6) Caches analysis results in chrome.storage.local so reloading the page instantly restores your previous analysis 7) Analytics dashboard tracks your solve history, time spent, and topic distribution

How we built it

1) Backend: Node.js + Express with the @google/generative-ai SDK hitting Gemini 2.5 Flash. PostgreSQL on Neon for persistent storage. A structured response-schema.json enforces the AI output format, and a custom prompt builder dynamically adjusts tasks based on feature flags and whether real solution code is available. 2) Extension: Manifest V3 with content scripts injected on LeetCode and Codeforces. A site-detector identifies the platform, a scraper-dispatcher routes to platform-specific scrapers, and a context-builder normalizes everything into a unified payload. The sidebar is an iframe injected into the page with its own HTML/CSS/JS. Communication happens via postMessage with a ready-signal handshake to prevent race conditions. 3) Solution Scraping: LeetCode solutions are fetched via their internal GraphQL API (questionSolutions query), extracting code blocks, titles, vote counts, and direct URLs. Codeforces solutions come from the public contest.status API. We're transparent about when the AI has real code to analyze vs. when it's working from problem analysis alone.

Challenges we ran into

1) LeetCode's GraphQL API is undocumented and changes frequently - we had to reverse-engineer the query structure and handle authentication edge cases 2) Codeforces submission pages are Cloudflare-protected, returning 403 even with browser cookies. We had to gracefully degrade to metadata-only solutions and honestly label AI approaches as "AI-analyzed from problem statement" rather than pretending they came from solution code 3) False positive verdict detection - the word "Accepted" appears in community solution posts on the Solutions tab, which was incorrectly triggering the unlock flow. We had to tighten detection to only trust specific submission result pages with exact URL pattern matching 4) Sidebar iframe timing - messages sent before the iframe's JS loaded were silently dropped. We built a message queue with a sidebar_ready handshake to guarantee delivery Gemini rate limits - gemini-2.0-flash and gemini-pro both hit 429 errors. Switching to gemini-2.5-flash resolved it Node 18's built-in fetch is incompatible with the @google/generative-ai SDK - we had to polyfill with node-fetch

Accomplishments that we're proud of

T1) he Solutions tab lock genuinely changes behavior - it removes the temptation to peek and makes you engage with the AI's guidance first 2) Honest attribution - when we have real solution code (LeetCode), approaches link back to the original community solutions. When we don't (Codeforces), we clearly label it as AI-generated analysis 3) Zero-click analysis caching - reload the page and everything is instantly restored, no re-analysis needed 4) The auto-verdict pipeline submit your code, and within seconds the sidebar automatically detects the result, runs a targeted analysis, and if you got Accepted, unlocks the Solutions tab and recommends your next challenge

What we learned

1) Chrome Extension Manifest V3 is a fundamentally different paradigm from V2 - service workers replace background pages, and content script - iframe communication needs careful orchestration 2) Structured JSON output from LLMs (via responseMimeType: 'application/json' + schema) is far more reliable than trying to parse free-text responses 3) Platform APIs are fragile - LeetCode's GraphQL can change anytime, Codeforces blocks scraping behind Cloudflare. Building graceful fallbacks from day one is essential. 4) The hardest bugs aren't in the code - they're in the assumptions. "Accepted" appearing in solution post text vs. actual verdict results taught us to never trust broad text matching.

What's next for CodeAider

1) More platforms - AtCoder, CSES, HackerRank support 2) Spaced repetition - track weak topics and surface revisit recommendations based on forgetting curves 3) Contest mode - real-time assistance during live contests with stricter "no spoilers" guardrails 4) Collaborative learning - share anonymized analysis snapshots with study groups 5) Chrome Web Store publishing - package for public distribution with user authentication and cloud sync