AinzStack

Launch production-ready SaaS applications in days, not months.
A modern Next.js 16 starter kit with authentication, billing, CMS, email, and a polished UI system — all wired together.

  

---

Table of Contents

• Table of Contents
• Overview
• Features
• Tech Stack
• Getting Started
  • Prerequisites
  • Installation
  • Environment Variables
  • Running Locally
• Project Structure
• Available Scripts
• Deployment
  • Deploy to Vercel
  • Deploy to Render
  • Post-Deployment Checklist
• License

---

Overview

AinzStack is a full-stack SaaS starter kit that handles the repetitive integration work so you can focus on building product. Authentication, billing, content management, transactional email, marketing pages, and a dashboard — all pre-wired and production-scaffolded.

---

Features

• Authentication — Email/password and Google OAuth via Supabase, with SSR session handling
• Billing — Stripe Checkout integration with webhook routing for subscription lifecycle events
• Content Management — Sanity CMS client and schema foundation for structured content
• Transactional Email — Resend API integration for notifications and onboarding flows
• Marketing Site — Pre-built public-facing pages and layout scaffolding
• Dashboard — Secured application interface with sidebar navigation
• UI System — Tailwind CSS v4 with Framer Motion animation primitives
• Form Handling — Zod schema validation paired with React Hook Form
• State Management — React Query for server state, Zustand for client state
• Quality Enforcement — Strict TypeScript, ESLint, Vitest unit tests, and Playwright E2E tests
• CI-Ready — Single pnpm ci command runs the full lint → typecheck → test → build pipeline

---

Tech Stack

Layer	Technology
Framework	Next.js App Router, Turbopack, React 19
Authentication	Supabase (Email/Password, Google OAuth), SSR handled
Database	Supabase PostgreSQL
Payments	Stripe Checkout, Webhook routing
Content	Sanity CMS
Email	Resend
Styling	Tailwind CSS v4, Framer Motion
State	React Query, Zustand
Validation	Zod, React Hook Form
Testing	Vitest (unit), Playwright (E2E)
Tooling	TypeScript (strict), ESLint, pnpm

---

Getting Started

Prerequisites

Tool	Minimum Version
Node.js	v22.0.0
pnpm	v10.0.0

Installation

Clone the repository and install dependencies:

git clone https://github.com/JCFcodex/AinzStack.git
cd AinzStack
pnpm install

Environment Variables

Copy the example environment file and fill in your credentials:

cp .env.example .env.local

The following variables are required in .env.local:

Variable	Description
NEXT_PUBLIC_APP_URL	Your application's base URL
NEXT_PUBLIC_SUPABASE_URL	Supabase project URL
NEXT_PUBLIC_SUPABASE_ANON_KEY	Supabase anonymous (public) key
SUPABASE_SERVICE_ROLE_KEY	Supabase service role key (server-side only)
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY	Stripe publishable key
STRIPE_SECRET_KEY	Stripe secret key (server-side only)
STRIPE_WEBHOOK_SECRET	Stripe webhook signing secret
SANITY_PROJECT_ID	Sanity project ID
SANITY_DATASET	Sanity dataset name (e.g., production)
RESEND_API_KEY	Resend API key for transactional email

Note: Variables prefixed with NEXT_PUBLIC_ are exposed to the browser. Never prefix secret keys with NEXT_PUBLIC_.

Running Locally

Start the development server:

pnpm dev

Open http://localhost:3000 in your browser.

---

Project Structure

src/
├── app/
│   ├── (auth)/             # Authentication flows (login, signup, callback)
│   ├── (dashboard)/        # Secured application interface
│   ├── (marketing)/        # Public-facing marketing pages
│   └── api/                # API route handlers (Edge & Node.js)
├── actions/                # Server Actions for data mutations
├── components/
│   ├── layout/             # Structural components (navbar, sidebar, footer)
│   ├── providers/          # React context and service providers
│   └── ui/                 # Reusable UI primitives
└── lib/                    # Core integrations and shared utilities
    ├── auth/               # Authentication helpers
    ├── sanity/             # Sanity client and schemas
    ├── stripe/             # Stripe client and webhook logic
    └── supabase/           # Supabase client configuration

---

Available Scripts

Command	Description
pnpm dev	Start the development server with Turbopack
pnpm build	Create an optimized production build
pnpm start	Serve the production build locally
pnpm lint	Run ESLint static analysis
pnpm typecheck	Run TypeScript type checking
pnpm test	Run unit tests with Vitest
pnpm test:e2e	Run end-to-end tests with Playwright
pnpm ci	Run full CI pipeline (lint → typecheck → test → build)

---

Deployment

Deploy to Vercel

The fastest path to production. Click the button to clone the repo into your Vercel account, fill in your environment variables, and deploy — all in one step.

Vercel will prompt you to provide each required environment variable during setup. Refer to the Environment Variables table for descriptions.

Deploy to Render

Prefer Render? Click the button below to create a new web service from this repository. Render will use the render.yaml blueprint in the repo to configure the service automatically.

Render setup notes:

• Add all required environment variables in the Render dashboard under Environment.
• Set the Build Command to pnpm build and the Start Command to pnpm start (these are pre-configured in render.yaml if the blueprint file is present).
• Ensure the Node.js version is set to 22 or higher in your service settings.

Post-Deployment Checklist

Regardless of your hosting provider, verify the following after your first deploy:

1. Base URL — Set NEXT_PUBLIC_APP_URL to your production domain (e.g., https://yourdomain.com).
2. Auth Callbacks — Register your production callback URI in the Supabase Dashboard under Authentication → URL Configuration:

   https://yourdomain.com/auth/callback
   

3. Stripe Webhooks — Update your Stripe webhook endpoints to point to your production URL:

   https://yourdomain.com/api/stripe/webhook
   

---

License

This project is licensed under the MIT License.

---

GitHub · Issues · Discussions · Sponsor

Built by JCFcodex