Dans cette leçon, tu vas créer ton compte Supabase, lancer un premier projet sur le free tier, et récupérer les deux valeurs dont toutes tes apps auront besoin : l'URL du projet et la clé publishable (ou anon key). À la fin, elles seront dans ton .env et tu seras prêt pour les leçons suivantes.
Créer un compte et un projet
Ouvre database.new dans ton navigateur. Cette URL redirige directement vers l'interface de création de projet dans le dashboard Supabase.
Si tu n'as pas encore de compte, tu peux t'inscrire avec GitHub, Google ou un email - c'est gratuit et ne demande pas de carte bancaire pour le free tier.
Une fois connecté, l'interface te demande :
- Organization : garde celle créée par défaut ou crée-en une nouvelle.
- Name : le nom de ton projet (par exemple
mon-premier-projet). - Database Password : génère un mot de passe fort et sauvegarde-le quelque part - il te servira si tu te connectes directement à PostgreSQL.
- Region : choisis la région la plus proche de tes utilisateurs. Pour commencer, West EU (Ireland) ou EU West (Frankfurt) fonctionnent bien si tu es en Europe.
- Plan : sélectionne Free.
Clique sur Create new project. Le provisionnement prend environ une minute. Supabase crée une instance PostgreSQL dédiée pour ton projet.
Récupérer l'URL et la clé API
C'est la partie la plus importante de cette leçon. Ton code a besoin de deux valeurs pour se connecter à Supabase :
- Project URL : l'adresse de ton projet (quelque chose comme
https://xyzabc.supabase.co). - Publishable key (ou anon key) : une clé publique, sûre à exposer côté client. Elle donne accès à ta base avec les permissions du rôle
anonde PostgreSQL, c'est-à-dire uniquement ce que tes politiques RLS autorisent.
Dans le dashboard, va dans Settings > API Keys. Tu y trouves :
- L'URL de ton projet dans la section "Project URL".
- La publishable key (ou
anon keyen legacy) dans la section dédiée.
Ne copie jamais la secret key (ou service_role) dans un fichier côté client ou dans un repo public - elle bypasse toutes les politiques de sécurité.
Mettre les clés dans ton .env
Crée un fichier .env.local à la racine de ton projet et colle tes valeurs :
NEXT_PUBLIC_SUPABASE_URL=https://xyzabc.supabase.co
NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY=sb_publishable_xxxxSi tu travailles avec l'ancienne convention (anon key), les noms de variables courantes sont :
NEXT_PUBLIC_SUPABASE_URL=https://xyzabc.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGci...Le préfixe NEXT_PUBLIC_ est spécifique à Next.js : il rend la variable accessible dans le code client. Pour d'autres frameworks (React + Vite, SvelteKit, etc.), le préfixe change (VITE_, PUBLIC_, etc.) mais les valeurs restent identiques.
Installer le client Supabase
Pour que ton app puisse parler à Supabase, installe le SDK JavaScript :
Optionnel - le CLI Supabase
Le CLI Supabase permet de gérer ton projet en local (migrations, types TypeScript générés depuis ton schéma, stack locale avec Docker). C'est optionnel pour l'instant - les leçons suivantes t'y amèneront progressivement. Voici comment l'installer si tu veux l'avoir dès maintenant :
Sur macOS / Linux avec Homebrew :
Sur Windows avec Scoop :
Via npm (dépendance locale au projet) :
Tu peux aussi l'invoquer sans installation globale avec npx supabase <commande>.
Sources
À côté
Concepts-ponts
Le meme concept (cles secretes, URLs, flags) gere a quatre niveaux : le concept fullstack, ton shell local, ta plateforme de deploiement, ta base de donnees managee.
