A Collaborative Todo Sample - ZenStack + Next.js
June 14, 2023 ยท View on GitHub
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/modelbypages/api/model/[...path].ts. - SWR CRUD hooks are generated under
lib/hooksfolder.
Running the sample
-
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.
-
Install dependencies
npm install -
Generate server and client-side code from model
npm run generate -
Synchronize database schema
npm run db:push -
Start dev server
npm run dev
For more information on using ZenStack, visit https://zenstack.dev.