Skip to content

zenstackhq/sample-todo-nextjs

Folders and files

NameName
Last commit message
Last commit date

Latest commit

8922149 · May 21, 2025
Mar 20, 2024
Feb 4, 2023
May 13, 2024
May 21, 2025
Dec 22, 2024
Dec 22, 2024
Jan 22, 2023
Aug 8, 2023
Jan 22, 2023
Jan 22, 2023
Jan 22, 2023
Jan 22, 2023
Dec 15, 2023
Jan 1, 2024
Feb 4, 2023
Jan 22, 2023
Jun 14, 2023
Dec 13, 2024
Dec 22, 2024
May 21, 2025
May 21, 2025
Jan 22, 2023
Dec 22, 2024
Dec 22, 2024
Dec 5, 2024

Repository files navigation

ZenStack SaaS Demo

A Collaborative Todo Sample - ZenStack + Next.js

This project is a collaborative Todo app built with Next.js, Next-Auth, and ZenStack.

In this fictitious app, users can be invited to workspaces where they can collaborate on todos. Public todo lists are visible to all members in the workspace.

See a live deployment at: https://zenstack-todo.vercel.app/.

Features

  • User signup/signin
  • Creating workspaces and inviting members
  • Data segregation and permission control

Implementation

  • Data model is located at /schema.zmodel.
  • An automatic CRUD API is mounted at /api/model by pages/api/model/[...path].ts.
  • SWR CRUD hooks are generated under lib/hooks folder.

Running the sample

  1. Setup a new PostgreSQL database

    You can launch a PostgreSQL instance locally, or create one from a hoster like Supabase. Create a new database for this app, and set the connection string in .env file.

  2. Install dependencies

    npm install
  3. Generate server and client-side code from model

    npm run generate
  4. Synchronize database schema

    npm run db:push
  5. Start dev server

    npm run dev

For more information on using ZenStack, visit https://zenstack.dev.