I built CodeSprint because I realized getting good at typing code requires practicing syntax fluency, not just logic. I found myself screwing up on mock interviews not because I didn't know the algorithm, but because I fumbled the syntax. I needed a way to drill "Depth First Search in Python" or "Ring Buffer in C++" until my fingers actually knew the shape of the code.

The Engineering:

Renderer: Uses a heavily customized Monaco Editor instance. I'm using deltaDecorations to paint diffs directly onto the editor model without breaking syntax highlighting, and getScrolledVisiblePosition for a custom, low-latency caret.

Data Pipeline: I didn't want to hardcode snippets. I wrote a custom Bun script (scripts/sync-leetcode.ts) that reverse-engineers the LeetCode GraphQL API to pull real problem snippets, sanitizes them, and normalizes indentation.

Latency: To handle high WPM without UI lag, the typing engine isolates keystroke processing from the main React render cycle where possible.

Repo: https://github.com/cwklurks/codesprint Live Demo: https://codesprints.vercel.app/

I'm a 15-year-old student from Vancouver. Would love feedback on the typing engine feel vs. native VS Code!