Motion ·

This is a Notion clone app created using Next.js for educational purposes. Motion is a productivity and note-taking web application. It offers organizational tools including task management, project tracking, to-do lists, and bookmarking.

Notion Clone

• Real time database
• Light / dark / system mode
• Authentication using Clerk
• Convex for database
• Edgestore for image upload
• Zustand for state management
• Notion like editor using BlockNote
• Hosted in Vercel

Tech/framework used

• Next.js 13 App Dir
• Shadcn/ui
• Clerk
• Tailwind CSS
• TypeScript
• Convex
• Edgestore
• BlockNote
• Zustand
• Vercel

Starting the project

Open the .env.example and fill in your Convex configuration, Edgestore configuration & Clerk Auth Configurations then save it as .env.local the run the following command:

npm install
npm run dev
npx convex dev

Demo

The app is hosted on Vercel. Click here to visit.
Direct link: https://motion.salimi.my

Screenshots

Landing page

Sign in

Editor