Article original : Supabase for Beginners

Supabase est une plateforme Backend-as-a-Service (BaaS) open-source qui fournit aux développeurs un ensemble d'outils puissants pour créer des applications rapidement.

Ce tutoriel vidéo complet vous présente Supabase en construisant une application réelle de tableau de bord des ventes (Sales Dashboard) en React.js avec authentification, opérations de données en temps réel et gestion sécurisée des utilisateurs.

L'application propose une authentification des utilisateurs avec un accès basé sur les rôles, ainsi qu'une visualisation des transactions de vente agrégées pour chaque représentant, se mettant à jour en temps réel au fur et à mesure que de nouvelles transactions sont ajoutées. Vous construirez également des profils d'utilisateurs évolutifs qui sont automatiquement créés lors de l'inscription à l'aide de triggers de base de données, et sécuriserez toutes les données avec un filtrage basé sur les permissions. À la fin, vous disposerez d'une application métier prête pour la production avec une gestion appropriée des utilisateurs, une visualisation des données et une sécurité renforcée.

Voici les sujets abordés dans ce cours :

Conception de base de données et de schéma

  • Créer des projets Supabase avec plusieurs tables liées

  • Concevoir des profils d'utilisateurs avec une catégorisation par type de compte

  • Configurer des triggers de base de données pour le remplissage automatique des données

Authentification et gestion de session

  • Configurer Supabase Auth pour l'inscription et la connexion/déconnexion des utilisateurs

  • Gérer les sessions utilisateur et l'authentification JWT

  • Lier les utilisateurs authentifiés à leurs profils

Opérations de données et fonctionnalités en temps réel

  • Interroger les bases de données pour récupérer et afficher des données

  • Agrégé les données de vente pour la visualisation

  • Créer des visualisations sous forme de graphiques à barres des transactions par représentant

  • Insérer de nouveaux enregistrements via des formulaires

  • Configurer des abonnements Realtime pour les mises à jour en direct des graphiques

Regardez le cours complet sur la chaîne YouTube de freeCodeCamp.org (durée : 5 heures).