Next.js Subscription Payments Starter
vercel/nextjs-subscription-payments ↗ ·★ 7.2k ·TypeScript ·MIT
Un starter SaaS d'abonnement full-stack utilisant Next.js, Stripe Checkout et le portail client, avec l'authentification et les données sur Supabase. Déployez le front-end sur Vercel en un clic.
Aperçu
Next.js Subscription Payments Starter est le template officiel de Vercel pour lancer rapidement une activité d’abonnement. Il combine trois pièces de premier ordre — Next.js pour l’application, Stripe pour la facturation et Supabase pour l’authentification et les données — en un squelette de SaaS fonctionnel, avec le paiement, un portail client et un état d’abonnement synchronisé par webhook déjà implémentés. Les parties difficiles et sujettes aux erreurs des paiements sont faites pour vous.
L’architecture répartit proprement les responsabilités. Supabase possède l’identité et la base de données (avec la sécurité au niveau des lignes, pour que les utilisateurs ne voient que leurs propres données), Stripe possède l’argent, et la couche Next.js orchestre entre les deux. Les webhooks Stripe sont la colle : lorsqu’un abonnement est créé, mis à niveau ou annulé, un gestionnaire met à jour Supabase pour que votre logique applicative puisse simplement lire le plan actuel depuis votre propre base de données.
Le déploiement se fait vraiment en un clic. Le bouton Vercel clone le dépôt et provisionne l’intégration Supabase pendant la configuration ; ensuite, vous ajoutez vos clés Stripe, définissez les produits et les prix, et vous avez un produit facturable. L’offre Hobby de Vercel et l’offre gratuite de Supabase suffisent toutes deux pour lancer — vous ne commencez à payer les frais par transaction de Stripe qu’une fois que vous encaissez réellement de l’argent.
Points forts
- ✓ Stripe Checkout et le portail client câblés de bout en bout
- ✓ Supabase pour l'authentification, Postgres et la sécurité au niveau des lignes
- ✓ Les webhooks maintiennent automatiquement l'état des abonnements synchronisé
- ✓ Déploiement Vercel en un clic qui provisionne l'intégration Supabase
Idéal pour
- →Lancer un SaaS d'abonnement ou un site d'adhésion
- →Développeurs qui veulent la facturation Stripe sans la construire de zéro
- →Applications Next.js nécessitant authentification + base de données + paiements ensemble
Pour commencer
- 1 Cliquez sur Deploy sur Vercel — il provisionne l'intégration Supabase pendant la configuration
- 2 Créez des produits et des prix dans votre tableau de bord Stripe (ou utilisez les fixtures incluses)
- 3 Ajoutez votre clé secrète Stripe et le secret de signature des webhooks comme variables d'environnement
- 4 Exécutez la CLI Stripe pour relayer les webhooks localement, puis testez un flux de paiement
FAQ
Supabase. Il fournit Postgres, l'authentification et la sécurité au niveau des lignes, tandis que Stripe gère les paiements. L'application Next.js les relie entre eux.
Pour un produit en phase de démarrage, oui — l'offre Hobby de Vercel héberge le front-end et l'offre gratuite de Supabase couvre l'authentification et la base de données. Stripe facture par transaction, pas pour l'hébergement.
Les webhooks Stripe notifient l'application des abonnements nouveaux, mis à jour et annulés, et le gestionnaire écrit l'état actuel dans Supabase pour que votre interface reflète toujours la réalité de la facturation.
Déployer Next.js Subscription Payments Starter gratuitement
Plateformes à offre gratuite capables d’héberger ce projet. Choisissez-en une et lancez-vous.
