Naar inhoud gaan
supastack
Blader door de docs
WebTanStack Start

For AI agents: fetch the complete documentation index at /llms.txt, the full documentation corpus at /llms-full.txt, the agent skill at /skill.md, or this page as Markdown at /nl/docs/tanstack/tech-stack.md (or send Accept: text/markdown).

Tech-stack

De technologieën achter de kit en de rol die elk speelt.

Vraag over deze handleiding
Openen in

Voordat je begint

Open uw gedownloade supastack-project in Visual Studio Code met behulp van Bestand → Map openen en kies vervolgens Terminal → Nieuwe terminal. De root van de repository is de map met package.json, apps en pakketten. Voer daar de onderstaande opdracht uit en laat de terminal open. Als een opdracht niet wordt herkend, voltooi dan de installatiehandleiding van het hulpprogramma voordat u verdergaat.

Lees eerst de platformtutorial. Een server is het app-proces dat browser- of telefoonverzoeken beantwoordt. Web leest apps/web-tanstack/.env.local, Expo leest apps/mobile/.env.local en opdrachten voor databasemigratie lezen root .env. De demonstratie zonder database/dashboard staat los van echte/auth-accounts, waarvoor Postgres moet worden gemigreerd. Voor een telefoon- of desktop-afrekening is een afzonderlijk draaiende web-backend nodig.

corepack pnpm --filter @supastack/web-tanstack dev

Applicatie-stack

De webapp is een TanStack Start-applicatie samengesteld uit gedeelde TypeScript-packages — dezelfde packages voeden de Expo-mobiele app. Product-chrome gebruikt CSS modules over design tokens, dus er is geen runtime CSS-in-JS om te debuggen, en objectopslag is S3-compatibel. De onderstaande tools zijn de bewuste defaults.

TanStack Start + React

De webapp draait op TanStack Start met TanStack Router-bestandsroutes en React 19-servercomponenten.

TypeScript + Turborepo

TypeScript strict mode geldt voor de hele pnpm-workspace, en Turborepo coördineert builds.

Better Auth

Better Auth is de identity-engine; een Auth.js-engine is beschikbaar voor teams die daarop standaardiseren.

Drizzle + PostgreSQL

Persistentie loopt via de Drizzle-ORM op PostgreSQL — het schema en de helpers waar elke record doorheen stroomt.

Billing

Stripe-billing is de default, en een Lemon Squeezy-adapter is inbegrepen.

Trigger.dev

Achtergrondjobs draaien op Trigger.dev.

Transactionele e-mail

Transactionele e-mail wordt verzonden via Resend of AWS SES.

Sentry + PostHog

Observability loopt via Sentry en PostHog.

Expo

De Expo-mobiele app gebruikt dezelfde TypeScript-packages, dus contractwijzigingen typchecken in één keer tegen beide surfaces. Expo shippt voor iOS en Android.

Gedeelde modules

Elke dwarsdoorsnijende capaciteit leeft in een pakket met een klein contract: auth, db, billing, ai, jobs, email, storage, observability, config, i18n en api. De applicaties componeren ze; domeinlogica van het product blijft buiten de kit.

Elke provider-gestuurde module bevat een fake- of lokale adapter zodat de standaard test- en ontwikkelcyclus nooit een betaalde service aanroept.

Verificatie-tooling

Vitest dekt unit- en integratiegedrag, Playwright dekt browserflows, en ESLint plus Prettier houden de code consistent. De deterministische suite draait zonder provider-credentials; acceptatie met echte providers is een aparte, optionele route.

corepack pnpm test              # deterministic unit + integration
corepack pnpm check             # lint, types, tests, format
corepack pnpm build             # production builds
corepack pnpm test:e2e:tanstack  # browser flows