ByteRank
A gamified coding app where developers solve daily JavaScript challenges, earn XP, rank up, and compete with friends — with real code execution and Gemini AI quality scoring.
Problem
Developers who want to sharpen their JavaScript skills have no app that combines the daily-challenge habit loop of Wordle with real code execution, AI feedback, and social competition. LeetCode is web-first and has no progression system; Codewars has no streaks or async duels. The gap was a mobile-native, gamified coding tool that actually runs your code.
Stack Decisions
Two-function evaluation pipeline (Deno edge functions)
Splitting test execution and quality scoring into separate edge functions kept each concern independently deployable and rate-limitable. The run-tests function never touches the Gemini API, so a quality-scoring outage doesn't block submission; scores are applied asynchronously.
Zustand + TanStack Query
Zustand owns ephemeral UI state (XP animations, rank-up overlay, streak state) while TanStack Query owns server-derived data (challenges, submissions, leaderboard). The two layers never conflict because they have non-overlapping responsibilities.
expo-sqlite as offline cache
Challenge data and draft solutions are written to SQLite so the library and editor remain usable without a connection. Supabase is the source of truth for submissions and social data; SQLite is strictly a read cache and draft store.
Gemini API for code quality via edge function proxy
Proxying the Gemini API through a Supabase edge function kept the API key server-side and allowed rate limiting per user before the request ever leaves the backend, preventing abuse without any client-side secret exposure.
Challenges
XP formula balancing across solve speeds
The formula combines a difficulty base, a time bonus (fraction of limit remaining), an AI quality bonus, and a streak multiplier. Early playtesting showed the time bonus dominated for fast solvers on easy problems, so the bonus was capped and the quality component weighted higher to reward clean code over brute speed.
Async challenge state machine
A head-to-head duel has four states (pending, in_progress, completed, expired) and two independent submission slots. Resolving winner and awarding XP required a dedicated resolve-async-challenge edge function that fires on opponent submission rather than on a cron, to avoid a race between the expiry timer and a last-second solve.
Sandboxed JS evaluation in Deno
Running arbitrary user-submitted JavaScript safely on the server required scoping the eval context to prevent access to Deno globals, network APIs, and the file system. The sandbox wraps execution in a restricted scope with a hard timeout to prevent infinite loops from blocking the edge function worker.
Outcome
A full-stack gamified coding app with live code execution, Gemini-powered quality scoring, a seven-tier rank system, streaks, achievements, async duels, and a global leaderboard — built on React Native with Supabase edge functions and deployed via EAS Build. The two-function evaluation pipeline decouples correctness from quality, so a slow Gemini response never blocks a user from seeing their test results.