Supabase Realtime Chat

supabase/supabase ↗ ·★ 107.2k ·TypeScript ·Apache-2.0

Pattern de chat temps réel basé sur Postgres, Auth et Realtime de Supabase, plutôt qu'un dépôt de démo maintenu séparément.

Supabase Realtime Chat screenshot
Étoiles
★ 107.2k
Langage
TypeScript
Licence
Apache-2.0
Cibles de déploiement
3

Aperçu

Supabase Realtime Chat doit surtout être lu comme un pattern de déploiement, pas comme un dépôt autonome dédié. Le dépôt suivi est le monorepo principal de Supabase, dont le README présente Supabase comme une plateforme de développement Postgres avec Auth, API générées, abonnements Realtime, Functions, Storage et bibliothèques clientes. Un chat est une façon concrète d’assembler ces pièces.

L’exemple est aussi une leçon claire sur la façon de faire des front-ends directement connectés à la base de données en toute sécurité. Comme le client React se connecte à Supabase avec une clé anon publique, les politiques de sécurité au niveau des lignes sont ce qui décide réellement qui peut lire et écrire chaque ligne. Étudier comment les politiques sont écrites ici est la meilleure façon de comprendre le modèle de sécurité de Supabase avant de l’appliquer à une vraie application, où réussir le RLS est non négociable.

Sur le plan architectural, aucun serveur personnalisé n’est nécessaire pour le pattern de base. Supabase héberge la base de données, l’authentification, les API et la couche temps réel, et votre front-end peut être un simple build React statique. Vous livrez donc l’interface sur un hébergeur statique gratuit comme Netlify ou Cloudflare Pages et vous la pointez vers votre projet Supabase. Utilisez la documentation et les exemples officiels Supabase pour le SQL et les politiques exactes.

Points forts

  • Messages en direct via Supabase Realtime sur les changements Postgres
  • Sécurité au niveau des lignes, pour que les utilisateurs n'accèdent qu'à ce qui leur est autorisé
  • Auth, API REST/GraphQL et bibliothèques clientes documentées dans le dépôt principal
  • À utiliser comme pattern de front-end statique, pas comme starter chat dédié

Idéal pour

  • Apprendre le modèle Supabase Realtime + RLS
  • Ajouter un chat en direct ou la présence à une application existante
  • Démos qui ont besoin d'un back-end managé sans faire tourner de serveur

Pour commencer

  1. 1 Créez un projet Supabase et modélisez une table de messages dans Postgres
  2. 2 Activez Realtime sur cette table et écrivez des politiques RLS strictes
  3. 3 Utilisez le client JavaScript Supabase avec l'URL du projet et la clé anon
  4. 4 Déployez votre front-end statique sur Netlify, Cloudflare Pages ou un autre hébergeur
#chat#realtime#postgres#auth#example

FAQ

Comment fonctionne la partie temps réel ?

Supabase Realtime diffuse les changements de lignes Postgres vers les clients abonnés via WebSockets. Lorsqu'une ligne est insérée dans la table des messages, chaque client connecté la reçoit instantanément — sans polling.

Pourquoi la sécurité au niveau des lignes est-elle importante ici ?

Parce que le front-end parle directement à Supabase avec une clé anon publique, les politiques RLS sont ce qui impose qui peut lire et écrire des lignes. Elles sont la véritable frontière de sécurité, pas le code client.

Ai-je besoin d'héberger un back-end ?

Aucun back-end personnalisé n'est requis pour le pattern de base. Supabase héberge Postgres, Auth, les API et Realtime ; votre front-end statique pointe vers votre projet Supabase.

Guides de déploiement

Déployer Supabase Realtime Chat gratuitement

Plateformes à offre gratuite capables d’héberger ce projet. Choisissez-en une et lancez-vous.