Secrets und Schlüssel verwalten
API-Schlüssel sicher aufbewahren, nicht in Ihren Prompts
Secrets und Schlüssel verwalten ist eine kostenlose Vibe Coding-Lektion auf CoddyKit. Dies ist Lektion 4 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des Vibe Coding-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Vibe Coding-Kurs umfasst insgesamt 4 Lektionen.
Teile dieser Lektion wurden noch nicht übersetzt und werden auf Englisch angezeigt.
Some Things Must Stay Secret
Many services give you an API key — a secret password that proves your app is allowed to use them. Payment tools, AI models, and email services all use keys.
If a key leaks, strangers can run up your bill or abuse your account. So a core vibe-coding habit is knowing how to keep secrets out of the wrong places — including out of your prompts.
What a Key Looks Like
An API key is usually a long random string. You include it with requests so the service knows it's you.
The danger: it's just text, so it's easy to accidentally paste it somewhere public. Treat a key like a house key — you wouldn't tape it to your front door.
sk_live_8f2a91c4d7e0b36a55f1c9a...
(a real key is long, random, and SECRET)The Golden Rule: Never Hardcode Keys
The most common mistake is pasting a key directly into your code. AI sometimes does this too. If that code goes public (like on GitHub), your key is exposed to the world within minutes.
Instead, keys live in a separate, private place. Tell AI explicitly to never put the key in the code itself.
Never put my API key directly in the code. Read it
from an environment variable instead, and add the
key name to a .env file that is ignored by git.Environment Variables
The standard safe home for secrets is an environment variable — a value stored outside your code that the app reads at runtime. Your code refers to it by name, not by the actual secret.
This snippet shows how code reads a key by name rather than containing the secret itself.
// The code only references the NAME, not the secret
const apiKey = process.env.WEATHER_API_KEY;
if (!apiKey) {
console.log('No key found — set it in .env');
} else {
console.log('Key loaded safely (length:', apiKey.length, ')');
}The .env File and .gitignore
Secrets go in a file usually named .env. Crucially, you add .env to your .gitignore so it's never uploaded or shared. The code reads from it; the file stays on your machine.
Whenever you set up keys, double-check the .env file is ignored. Ask AI to confirm it for you.
Show me my .gitignore and confirm that .env is
listed in it. If it isn't, add it so my secret keys
never get committed to git.Don't Paste Secrets into Prompts
It's tempting to paste a real key into a chat with AI so it 'just works.' Don't. Your prompts may be logged, and the key could end up in shared history.
Instead, use a placeholder. Tell AI the variable name and let it write code that reads the real value from your .env locally.
Use an environment variable called
OPENAI_API_KEY for the key. I'll add the real
value to my .env file myself — just write the code
to read it from there.Frontend Keys Are Visible
Here's a trap: any key in code that runs in the user's browser can be seen by anyone who looks. Browser code is never truly secret.
So secret keys (like payment or AI keys) must be used from a server or serverless function, not directly in the page. Ask AI to route sensitive calls through the backend.
This AI feature needs my secret key, but the call
is currently in the browser where users could see
it. Move the request to a serverless function so
the key stays on the server and is never exposed to
the frontend.Setting Secrets on Hosting Platforms
When you deploy to hosts like Vercel, Netlify or Replit, you don't upload your .env file. Instead, each platform has a settings page where you add environment variables securely.
Your code reads them the same way — by name. The platform keeps the actual values safe.
I'm deploying this to Vercel. Tell me exactly which
environment variables I need to add in the Vercel
dashboard, and confirm the code reads each one by
name so deployment works.What to Do If a Key Leaks
If a key ever ends up somewhere public, don't panic — rotate it. Go to the service's dashboard, delete the old key, and generate a new one. The leaked key instantly stops working.
Then update your .env and hosting settings with the new value. Treat leaked keys as compromised, always.
A Simple Secrets Checklist
Make these habits automatic on every project:
- Keys live in
.env, never in code .envis listed in.gitignore- Secret keys run on the server, not in the browser
- Never paste real keys into AI prompts
- On hosting, add keys in the dashboard, not the repo
Tell your AI tool to follow this checklist and it will set things up safely by default.
Limit What a Key Can Do
Many services let you restrict a key so a leak does less damage: cap its spending, limit it to certain domains, or give it read-only access.
Setting these limits is a smart safety net. When a service offers it, ask AI to walk you through adding usage caps and domain restrictions in the dashboard.
Walk me through adding a monthly spending limit and
a domain restriction to my API key in this
service's dashboard, so that even if the key leaks,
the damage is capped.Quick Check
You're adding a paid AI feature that needs a secret key. Where should that key live so it stays safe?
Recap: Handling Secrets and Keys
You learned that API keys are secret passwords that must never be hardcoded or pasted into prompts. Safe keys live in environment variables via a .env file that's git-ignored, and secret keys run on the server, not in the browser.
You saw how to set secrets on hosts like Vercel, and how to rotate a leaked key. Follow the checklist and AI will set things up safely. You've now covered files, APIs, and data — the building blocks of real apps.
Häufig gestellte Fragen
Ist die Lektion „Secrets und Schlüssel verwalten“ kostenlos?
Ja — der vollständige Text von „Secrets und Schlüssel verwalten“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Vibe Coding-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Vibe Coding-Kurs umfasst insgesamt 4 Lektionen.
Was lerne ich in „Secrets und Schlüssel verwalten“?
API-Schlüssel sicher aufbewahren, nicht in Ihren Prompts Du übst Vibe Coding mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um Vibe Coding zu starten?
Keine Vorkenntnisse erforderlich. Vibe Coding auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 4 von 4.
Wie lange dauert die Lektion „Secrets und Schlüssel verwalten“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser Vibe Coding-Lektion Code schreiben und ausführen?
Ja. Jede Vibe Coding-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- Mit APIs sprechen
- Dateien lesen und speichern
- Daten einfach speichern
- Secrets und Schlüssel verwalten