Skip to main content

​
Stack

The technology in rekkal, layer by layer, and the reason each one is here.

​
Framework and hosting — Next.js App Router on Vercel

Next.js (App Router, TypeScript) is the application framework; the project targets Vercel for hosting. Server Components are the default, keeping data fetching and secrets on the server, with "use client" pushed to the leaf components that need interactivity. Mutations use Server Actions; inbound calls from outside the app (webhooks) use Route Handlers. Version: next@16 with react@19. See CLAUDE.md for the routing and Server/Client conventions, and deployment.md for the Vercel deploy.

​
UI — shadcn/ui + Magic UI + Tailwind

Tailwind CSS handles styling. shadcn/ui provides unstyled, copy-in component primitives you own and can edit, installed via CLI into components/ui/. Magic UI adds animated marketing components through the same CLI via the @magicui registry. This combination gives full control over the markup with no runtime component-library dependency. See ui.md.

​
Database, auth, storage — Supabase

Supabase provides the Postgres database, authentication, and file storage behind one service, integrated through @supabase/ssr for correct cookie-based sessions in the App Router. Schema lives as versioned SQL under supabase/migrations/. See supabase.md.

​
Payments — Stripe

Stripe handles billing. A lazily-constructed server client lives in lib/stripe.ts, and the webhook Route Handler at app/api/webhooks/stripe/route.ts verifies and dispatches Stripe events. Plan-to-price-ID mapping lives in config.ts. See stripe.md.

​
Transactional email — Resend + React Email

Resend sends transactional email; React Email lets you author templates as React components (in emails/) that render to both HTML and plain text. The client is in lib/resend.ts. See email.md.

​
Package manager — pnpm

pnpm is the package manager for this repo. Use it for every dependency operation (pnpm install, pnpm add, scripts) — the lockfile is pnpm-lock.yaml.

​
Tests — Vitest

Vitest runs the test suite. Tests are colocated next to the file they cover as *.test.ts and run with pnpm test.