Zod on Producthunt daily

saas-starter

Sat, 23 Aug 2025 15:26:48 +0800

nextjs/saas-starter

Next.js SaaS Starter

This is a starter template for building a SaaS application using Next.js with support for authentication, Stripe integration for payments, and a dashboard for logged-in users.

Demo: https://next-saas-start.vercel.app/

Features

Marketing landing page (/) with animated Terminal element
Pricing page (/pricing) which connects to Stripe Checkout
Dashboard pages with CRUD operations on users/teams
Basic RBAC with Owner and Member roles
Subscription management with Stripe Customer Portal
Email/password authentication with JWTs stored to cookies
Global middleware to protect logged-in routes
Local middleware to protect Server Actions or validate Zod schemas
Activity logging system for any user events

Tech Stack

Framework: Next.js
Database: Postgres
ORM: Drizzle
Payments: Stripe
UI Library: shadcn/ui

Getting Started

1
2
3

git clone https://github.com/nextjs/saas-starter
cd saas-starter
pnpm install

Running Locally

Install and log in to your Stripe account:

`1`	`stripe login`

Use the included setup script to create your .env file:

`1`	`pnpm db:setup`

Run the database migrations and seed the database with a default user and team:

1
2

pnpm db:migrate
pnpm db:seed

This will create the following user and team:

User: test@test.com
Password: admin123

You can also create new users through the /sign-up route.

Finally, run the Next.js development server:

`1`	`pnpm dev`

Open http://localhost:3000 in your browser to see the app in action.

You can listen for Stripe webhooks locally through their CLI to handle subscription change events:

`1`	`stripe listen --forward-to localhost:3000/api/stripe/webhook`

Testing Payments

To test Stripe payments, use the following test card details:

Card Number: 4242 4242 4242 4242
Expiration: Any future date
CVC: Any 3-digit number

Going to Production

When you’re ready to deploy your SaaS application to production, follow these steps:

Set up a production Stripe webhook

Go to the Stripe Dashboard and create a new webhook for your production environment.
Set the endpoint URL to your production API route (e.g., https://yourdomain.com/api/stripe/webhook).
Select the events you want to listen for (e.g., checkout.session.completed, customer.subscription.updated).

Deploy to Vercel

Push your code to a GitHub repository.
Connect your repository to Vercel and deploy it.
Follow the Vercel deployment process, which will guide you through setting up your project.

Add environment variables

In your Vercel project settings (or during deployment), add all the necessary environment variables. Make sure to update the values for the production environment, including:

BASE_URL: Set this to your production domain.
STRIPE_SECRET_KEY: Use your Stripe secret key for the production environment.
STRIPE_WEBHOOK_SECRET: Use the webhook secret from the production webhook you created in step 1.
POSTGRES_URL: Set this to your production database URL.
AUTH_SECRET: Set this to a random string. openssl rand -base64 32 will generate one.

Other Templates

While this template is intentionally minimal and to be used as a learning resource, there are other paid versions in the community which are more full-featured:

zod

Wed, 21 May 2025 15:29:33 +0800

colinhacks/zod

Zod

✨ https://zod.dev ✨
TypeScript-first schema validation with static type inference

Documentation • Discord • npm • Issues • @colinhacks

Featured sponsor: Jazz

_{Learn more about featured sponsorships}

Read the docs →

What is Zod?

Zod is a TypeScript-first validation library. Define a schema and parse some data with it. You’ll get back a strongly typed, validated result.

import { z } from "zod/v4";

const User = z.object({
  name: z.string(),
});

// some untrusted data...
const input = { /* stuff */ };

// the parsed result is validated and type safe!
const data = User.parse(input);

// so you can use it with confidence :)
console.log(data.name);

Features

Zero external dependencies
Works in Node.js and all modern browsers
Tiny: 2kb core bundle (gzipped)
Immutable API: methods return a new instance
Concise interface
Works with TypeScript and plain JS
Built-in JSON Schema conversion
Extensive ecosystem

Installation

`1`	`npm install zod`

Basic usage

Before you can do anything else, you need to define a schema. For the purposes of this guide, we’ll use a simple object schema.

import { z } from "zod/v4"; 

const Player = z.object({ 
  username: z.string(),
  xp: z.number()
});

Parsing data

Given any Zod schema, use .parse to validate an input. If it’s valid, Zod returns a strongly-typed deep clone of the input.

1
2

Player.parse({ username: "billie", xp: 100 }); 
// => returns { username: "billie", xp: 100 }

Note — If your schema uses certain asynchronous APIs like async refinements or transforms, you’ll need to use the .parseAsync() method instead.

const schema = z.string().refine(async (val) => val.length <= 8);

await schema.parseAsync("hello");
// => "hello"

Handling errors

When validation fails, the .parse() method will throw a ZodError instance with granular information about the validation issues.

try {
  Player.parse({ username: 42, xp: "100" });
} catch(err){
  if(error instanceof z.ZodError){
    err.issues; 
    /* [
      {
        expected: 'string',
        code: 'invalid_type',
        path: [ 'username' ],
        message: 'Invalid input: expected string'
      },
      {
        expected: 'number',
        code: 'invalid_type',
        path: [ 'xp' ],
        message: 'Invalid input: expected number'
      }
    ] */
  }
}

To avoid a try/catch block, you can use the .safeParse() method to get back a plain result object containing either the successfully parsed data or a ZodError. The result type is a discriminated union, so you can handle both cases conveniently.

const result = Player.parse({ username: 42, xp: "100" });
if (!result.success) {
  result.error;   // ZodError instance
} else {
  result.data;    // { username: string; xp: number }
}

Note — If your schema uses certain asynchronous APIs like async refinements or transforms, you’ll need to use the .safeParseAsync() method instead.

const schema = z.string().refine(async (val) => val.length <= 8);

await schema.safeParseAsync("hello");
// => { success: true; data: "hello" }

Inferring types

Zod infers a static type from your schema definitions. You can extract this type with the z.infer<> utility and use it however you like.

const Player = z.object({ 
  username: z.string(),
  xp: z.number()
});

// extract the inferred type
type Player = z.infer<typeof Player>;

// use it in your code
const player: Player = { username: "billie", xp: 100 };

In some cases, the input & output types of a schema can diverge. For instance, the .transform() API can convert the input from one type to another. In these cases, you can extract the input and output types independently:

const mySchema = z.string().transform((val) => val.length);

type MySchemaIn = z.input<typeof mySchema>;
// => string

type MySchemaOut = z.output<typeof mySchema>; // equivalent to z.infer<typeof mySchema>
// number