A fullstack React application: Next.js 14 Server Actions, Prisma, TailwindCSS, Stripe, MySQL.

Key Features

• Auth
• Organizations / Workspaces
• Board creation
• Unsplash API for random beautiful cover images
• Activity log for entire organization
• Board rename and delete
• List creation
• List rename, delete, drag & drop reorder and copy
• Card creation
• Card description, rename, delete, drag & drop reorder and copy
• Card activity log
• Board limit for every organization
• Stripe subscription for each organization to unlock unlimited boards
• Landing page
• MySQL DB
• Prisma ORM
• shadcnUI & TailwindCSS

Pre-requisites

Node version: 18.x.x

Clone the repository

git clone https://github.com/aleksanderpalamar/taskflow.git

Install dependencies

cd taskflow
npm install

Setup .env

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
NEXT_PUBLIC_CLERK_SIGN_IN_URL=
NEXT_PUBLIC_CLERK_SIGN_UP_URL=
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=

DATABASE_URL=

NEXT_PUBLIC_UNSPLASH_ACCESS_KEY=

STRIPE_API_KEY=

NEXT_PUBLIC_APP_URL=

STRIPE_WEBHOOK_SECRET=

Setup Prisma

I used PlanetScale (MySQL database)

npx prisma generate
npx prisma push

Run the app

npm run dev