
TanStarter
TanStarter · Programmation
TanStarter est un modèle SaaS full-stack bâti sur TanStack Start et Cloudflare Workers. Ce modèle TanStack Start arrive avec l'authentification, la facturation Stripe, une couche de base de données, le stockage de fichiers, un blog, l'e-mail transactionnel et des hooks IA déjà reliés entre eux. Il sert de starter full-stack React à ceux qui veulent la partie ennuyeuse déjà faite. Au lieu de passer des semaines à coller des bibliothèques jusqu'à obtenir une app qui tourne, vous clonez un dépôt, renseignez vos variables d'environnement et vous vous mettez à construire. Il couvre aussi les besoins d'un starter de facturation Stripe, donc les paiements ne sont pas une route que vous devez tracer seul. Il vise les développeurs solo et les petites équipes. L'ensemble tourne sur le réseau edge de Cloudflare. La latence reste basse et les coûts d'hébergement restent prévisibles.

À propos de TanStarter
Qu'est-ce que TanStarter
TanStarter est un modèle orienté production pour créer des applications React full-stack. Il regroupe TanStack Start pour le routage et les fonctions serveur, Cloudflare Workers pour le calcul, D1 pour la base de données relationnelle, R2 pour le stockage d'objets et Stripe pour les paiements. Le projet prend aussi en charge Creem et Waffo comme fournisseurs de paiement alternatifs via une interface partagée.
Le principe est simple : tout SaaS a besoin des mêmes fondations. Les reconstruire de zéro est du travail perdu. TanStarter vous donne ces fondations sous forme de code modifiable qui vous appartient, pas d'un service opaque que vous louez. Les paiements couvrent les abonnements, les achats uniques à vie et les essais gratuits. Alors pourquoi ne pas partir d'une base qui fonctionne ? Les utilisateurs gèrent leur facturation via le portail client Stripe. Les modules e-mail, newsletter et notification suivent le même schéma de fournisseur, donc changer de prestataire revient à implémenter une interface plutôt qu'à réécrire votre app.
Pour commencer
- Installez Git, Node.js 18+ et pnpm sur votre machine.
- Clonez le dépôt, puis copiez
.env.examplevers.env. - Lancez
pnpm installpour récupérer les dépendances, puispnpm devpour démarrer le serveur local surhttp://localhost:3000. - Définissez le nom de votre projet, votre domaine personnalisé et les bindings D1/R2 dans
wrangler.jsonc. - Poussez les secrets avec
pnpm wrangler secret bulk .env.productionet déployez avecpnpm run deploy.
Informations sur le produit
Aperçu des tarifs, des plateformes compatibles et des performances de TanStarter.
Idéal pour
Les utilisateurs, tâches et cas d'usage où cet outil convient le mieux.
Utilisateurs
- Fondateurs solo qui construisent un produit payant sans équipe backend
- Petites équipes d'ingénierie qui veulent éviter le travail de configuration répété
- Développeurs React qui passent de Next.js à TanStack Start
- Indie hackers qui lancent plusieurs petits projets SaaS
Tâches
- Lancer une app web par abonnement ou paiement unique
- Ajouter l'authentification, la facturation et l'upload de fichiers à une idée existante
- Prototyper une fonction IA sur Cloudflare Workers AI ou Fal.ai
- Mettre en place un blog de contenu à côté d'une app
Cas d'usage
- Valider une idée SaaS le temps d'un week-end sans câbler d'infrastructure
- Migrer un projet perso d'un framework plus lourd vers un stack plus léger
- Construire un outil interne qui a besoin de connexions et de paiements
- Tester l'offre gratuite de Cloudflare avant de passer à l'hébergement payant
Fonctionnalités clés
Fondation TanStack Start
Le modèle tourne sur TanStack Start. Il gère le routage par fichiers, les fonctions serveur et le chargement des données dans un seul framework. Les routes serveur et les routes client cohabitent, donc vous n'avez pas à jongler avec deux modèles mentaux. Si vous connaissez déjà React et TypeScript, la courbe d'apprentissage est courte.
Hébergement Cloudflare Workers
Tout se déploie sur le réseau edge de Cloudflare. Les Workers tournent près de vos utilisateurs, et l'offre gratuite autorise des bundles Worker non compressés jusqu'à 64 MiB, ce qui laisse largement de la marge pour une app classique. D1 couvre les données relationnelles et R2 le stockage de fichiers, tous deux avec des bindings déclarés dans wrangler.jsonc. Cette combinaison fait que vous n'avez jamais à provisionner un serveur de base de données ou un stockage d'objets séparé juste pour mettre une première version en ligne.
Paiements multi-fournisseurs
Stripe est le fournisseur par défaut, mais le module de paiement se trouve derrière une interface de fournisseur, donc Creem et Waffo fonctionnent aussi. Vous obtenez des abonnements mensuels et annuels, des paiements uniques à vie et des essais gratuits. La gestion de la facturation passe par le portail client Stripe, et WeChat Pay et Alipay sont disponibles quand vous les activez dans les réglages Stripe.
Hooks IA intégrés
Cloudflare Workers AI et Fal.ai alimentent les capacités d'IA livrées d'origine. Vous ajoutez du résumé, de la génération ou des fonctions similaires sans ouvrir un autre compte chez un prestataire. La couche IA est facultative, donc vous pouvez la laisser éteinte si votre produit n'en a pas besoin.
Authentification, e-mail et notifications
Les comptes utilisateur et les sessions sont préconfigurés. Les modules e-mail, newsletter et notification partagent le même schéma de fournisseur que les paiements, donc vous gardez une manière cohérente de changer de service. L'e-mail transactionnel pour les inscriptions, les reçus et les réinitialisations de mot de passe fonctionne dès le premier jour.
Blog et système de contenu
Déposez un fichier Markdown dans content/blog/ avec un frontmatter pour le titre, la description, la date, la catégorie et l'image, et il apparaît seul sur la page du blog. Vous avez ainsi un canal de contenu pour le SEO sans ajouter un CMS séparé.
Intégrations analytiques
Google Analytics, Umami, Plausible et Microsoft Clarity sont pris en charge, et vous pouvez en faire tourner n'importe quelle combinaison. Renseignez les variables d'environnement et ils s'activent en production. Aucun code de suivi personnalisé à écrire.
Mises à jour du modèle
Vous récupérez les améliorations du dépôt d'origine en ajoutant le dépôt du modèle comme remote Git, en faisant un fetch puis une fusion. Après avoir résolu les conflits, lancez pnpm install, appliquez les nouvelles migrations et testez. Garder votre copie à jour devient une fusion de routine, pas un projet de migration.
Avantages et inconvénients
Avantages
- Livre l'authentification, la facturation, le stockage et l'e-mail déjà connectés, donc vous démarrez sur le code produit
- Tourne sur l'edge de Cloudflare, ce qui garde l'hébergement bon marché et prévisible
- Les modules de paiement, d'e-mail et de notification se changent via une seule interface de fournisseur
- Le code vous appartient, donc aucune dépendance à un fournisseur sur l'app elle-même
- L'offre gratuite de Cloudflare suffit à déployer une vraie app
Inconvénients
- Pas d'i18n intégré ; vous avez l'anglais et le chinois via un module de messages à la compilation, puis vous câblez le reste vous-même
- Verrouillé sur le stack TanStack Start et Cloudflare, ce qui ne conviendra pas aux équipes sur Next.js ou AWS
- Demande de l'aisance avec TypeScript, Git et les étapes de déploiement en ligne de commande
- Vous payez une fois pour le modèle, en plus des frais d'hébergement et de paiement que votre app entraîne
Questions fréquentes
Git, Node.js 18 ou plus récent et pnpm. Clonez le dépôt, copiez .env.example vers .env, lancez pnpm install, puis pnpm dev. L'app démarre sur http://localhost:3000.
Contenus associés
Découvrez des outils, des compétences et des articles liés à TanStarter.
Alternatives à TanStarter
Base Code
Base44 (Wix) · Programmation · ProductivitéBase Code est un environnement de développement cloud partagé signé Base44. Votre équipe décrit des modifications sur un dépôt GitHub dans le chat, les vérifie en aperçu et les renvoie sous forme de pull requests.
Google EmbeddingGemma 2
Google DeepMind · Rédaction · Image · ProgrammationGoogle EmbeddingGemma 2 est un modèle ouvert de 740 millions de paramètres qui transforme texte, code, images, audio et images vidéo en vecteurs d'un même espace de 768 dimensions, sur un téléphone ou un ordinateur portable.
GitGlow
GitGlow · Programmation · ProductivitéGitGlow est un client Git de bureau qui place votre code et les modifications de vos agents IA dans une même revue, pour savoir ce qui quitte votre machine avant de livrer.
