What is an API key?
An API key is a unique password that lets your code talk to an AI service like Anthropic's Claude or Google's Gemini. When you ask the AI to review your code, the request includes your key so the service knows who to charge.
Why bring your own?
Code Ranger is a static, free app — there's no Code Ranger server holding a shared key for all users. If we used a shared key, one demo could rack up real charges. By using your own key, you control your usage and your spending.
Will other users see my key?
No. Your key is stored only in your own browser (or just this session, if you choose). It is never sent to a Code Ranger server (we don't have one). It is never shared with other users. Each user's key lives in their own browser only.
What about security risks?
Honest truth: Code Ranger is open source and runs entirely in your browser. Browser-based key handling has limits:
- Only paste your key on the official Code Ranger URL. Anyone could fork the code and modify it to steal keys. Check the GitHub source if unsure.
- Use a separate, low-budget key for tools like this. Set a $5 or $25 monthly cap on your provider's console. If a key ever leaks, the damage is capped.
- Never paste a production key from an app where billing matters. This is for learning & demos only.
- Choose "session only" storage if you're on a shared computer — the key disappears when you close the tab.
Spending caps — how much will this cost?
Code review uses a small amount of tokens per review. At normal use you'd spend a few cents a day at most. But mistakes happen — set a hard cap so a bug in your code can't drain your account.
- Anthropic Claude: Free trial credits when you sign up. After that, set a monthly limit at console.anthropic.com → Settings → Limits. Recommended: $5–$25.
- Google Gemini: Generous free tier (15 requests/minute on Flash). Plenty for learning. Pay-as-you-go available if you hit limits — set a budget at aistudio.google.com.
Where do I create a key?
What will my key be used for in Code Ranger?
Only one thing: when you click "Get AI Feedback," Code Ranger sends your code (HTML/CSS/JS/Python from your workspace) plus the question "review this code for a beginner" directly to your chosen provider. The response comes back and is shown to you. That's it. Your key is not used for anything else.