3.2 KiB
Quick start
Please check out the corresponding guide for creating a new project or adding to an existing project.
Creating a new project
You can choose from these preconfigured starter to create a new project:
- Using Next-Auth for authentication
- Using iron-session for authentication
- Without integrating with authentication
With Next-Auth
Follow these steps to create a new project from a preconfigured template using Next-Auth for authentication:
- Clone from starter template
npx create-next-app --use-npm -e https://github.com/zenstackhq/nextjs-auth-starter
- Install dependencies
npm install
- Generate CRUD services and hooks code from the starter model
npm run generate
- push database schema to the local sqlite db
npm run db:push
- start dev server
npm run dev
With iron-session
Follow these steps to create a new project from a preconfigured template using iron-session for authentication:
- Clone from starter template
npx create-next-app --use-npm -e https://github.com/zenstackhq/nextjs-iron-session-starter
- Install dependencies
npm install
- Generate CRUD services and hooks code from the starter model
npm run generate
- push database schema to the local sqlite db
npm run db:push
- start dev server
npm run dev
Without integrating authentication
If you would rather not use a template preconfigured with authentication, you can use the barebone starter instead. You can add an authentication solution later or hand-code it by yourself.
- Clone from starter template
npx create-next-app --use-npm -e https://github.com/zenstackhq/nextjs-barebone-starter
- Install dependencies
npm install
- Generate CRUD services and hooks code from the starter model
npm run generate
- push database schema to the local sqlite db
npm run db:push
- start dev server
npm run dev
Check result
If everything worked, you should see a simple blog app like this:

No worries if a blogger app doesn't suit you. The created project contains a starter model at /zenstack/schema.zmodel. You can modify it and build up your application's own model following this guide.
Adding to an existing project
To add ZenStack to an existing Next.js + Typescript project, run command below:
npx zenstack init
You should find a /zenstack/schema.model file created, containing a simple blogger model in it. No worries if a blogger app doesn't suit you. You can modify it and build up your application's own model following this guide.
Installing VSCode extension
It's good idea to install the VSCode extension so you get syntax highlighting and error checking when authoring model files.