Configurer Supabase
À l'issue de cette leçon, le stagiaire crée un projet Supabase, définit un schéma de base, et connecte son application avec les bonnes pratiques de sécurité.
Pourquoi Supabase
Supabase est une plateforme open source qui fournit, sur une base PostgreSQL hébergée, l'ensemble des briques courantes du backend moderne : base de données relationnelle, authentification (e-mail, OAuth, magic link), stockage de fichiers, fonctions serverless, et abonnements temps réel sur les changements de données.
L'intérêt pour un projet de formation ou un MVP : on évite d'écrire et de maintenir tout cela soi-même. La couche SQL reste accessible (vous gardez la main sur le schéma et les requêtes), mais les briques transverses sont fournies. Pour les formations à destination de profils non spécialistes, Supabase est suffisamment accessible pour rester à portée.
L'alternative qu'on rencontre souvent : Firebase. Plus mature sur certains aspects, mais propriétaire (Google), avec un modèle NoSQL qui surprend les développeurs venus du relationnel. Supabase reste, en 2026, le choix par défaut pour les projets nouveaux qui privilégient SQL et l'open source.
Création d'un projet
La création d'un projet Supabase prend trois minutes : compte gratuit, choix d'un nom, choix d'une région (privilégier une région proche de vos utilisateurs et conforme au RGPD si vous traitez des données européennes — Frankfurt ou Paris en pratique), choix d'un mot de passe pour la base.
Une fois le projet créé, l'interface expose plusieurs onglets : Table Editor pour gérer le schéma, SQL Editor pour les requêtes ad hoc, Authentication pour configurer les méthodes de connexion, Storage pour les fichiers, API Docs qui documente automatiquement chaque table comme un endpoint REST et GraphQL.
Schéma de base
Pour une première application, partez sur un schéma minimal. Trois ou quatre tables suffisent à démarrer. Exemple type pour un suivi de stagiaires :
profiles (un par utilisateur authentifié), formations (les formations dispensées), sessions (les sessions planifiées), inscriptions (lien stagiaire-session). Relations classiques en clés étrangères. Champs dates, statuts, métadonnées en JSON pour les détails évolutifs.
Activez systématiquement le Row Level Security (RLS) sur chaque table, et écrivez des politiques explicites pour autoriser les lectures et écritures. Une table sans RLS est ouverte à tous les utilisateurs authentifiés ; ce n'est presque jamais ce que vous voulez.
Connexion depuis l'application
Supabase fournit une bibliothèque cliente (@supabase/supabase-js en JavaScript/TypeScript, équivalents pour Python, Dart, etc.). L'initialisation tient en deux variables : l'URL du projet et la clé publique anon. Ces deux valeurs vivent dans votre .env.
Important : la clé anon est publique et peut être exposée côté navigateur — c'est son rôle. La sécurité repose sur le RLS, pas sur le secret de cette clé. Une autre clé, service_role, contourne le RLS et ne doit jamais être exposée côté client. Elle ne sert que dans des contextes serveur de confiance (fonctions edge, scripts d'admin).
Mise en place complète
Comptez quarante-cinq minutes pour aller jusqu'à la première requête depuis l'application.
-
Créer un compte gratuit sur supabase.com. Créer un nouveau projet, choisir une région européenne, retenir le mot de passe de la base.
-
Dans Table Editor, créer une première table simple :
postsavec colonnesid(uuid, primary key),created_at(timestamp),title(text),content(text). -
Activer le Row Level Security sur la table : icône cadenas → Enable RLS. Pour démarrer, créer une politique Public read access (lecture pour tous). Ajouter ensuite des politiques d'écriture quand l'authentification sera en place.
-
Récupérer les identifiants de connexion : Project Settings → API. Noter
Project URLet la cléanon. -
Dans le projet local : installer la bibliothèque cliente (
npm install @supabase/supabase-js). Créer un fichierlib/supabase.jsqui initialise le client à partir des variables d'environnement. -
Configurer le
.envavecSUPABASE_URLetSUPABASE_ANON_KEY. S'assurer que le fichier est dans.gitignore(cf. leçon 29). -
Faire une première requête : insérer un post de test (depuis l'éditeur SQL Supabase ou via une commande dans l'application), puis le lire depuis le code applicatif. Vérifier qu'il s'affiche.
Schéma minimal pour votre projet
Esquissez le schéma de base de votre projet (trois à cinq tables). Créez-le dans Supabase. Activez le RLS sur toutes. Faites une première requête depuis l'application. Documentez le schéma dans le CLAUDE.md du projet pour que Claude le connaisse aux sessions suivantes.
- supabase.com site officiel Supabase, documentation et tarification
- code.claude.com documentation Claude Code
- docs.claude.com documentation produit, chemin précis à vérifier au moment de la consultation
Votre application est connectée à une base Supabase sécurisée ?