Real-Time Miro Clone Built With Nextjs, React, Covex, Liveblocks, TypeScript, and Tailwind CSS.
Features:
- ๐ ๏ธ Whiteboard from scratch
- ๐งฐ Toolbar with Text, Shapes, Sticky Notes & Pencil
- ๐ช Layering functionality
- ๐จ Coloring system
- โฉ๏ธ Undo & Redo functionality
- โจ๏ธ Keyboard shortcuts
- ๐ค Real-time collaboration
- ๐พ Real-time database
- ๐ Auth, organisations and invites
- โญ๏ธ Favoriting functionality
- ๐ Next.js 14 framework
- ๐ TailwindCSS & ShadcnUI styling
Node version 14.x
git clone https://github.com/AntonioErdeljac/next14-miro-clone.git
npm i
CONVEX_DEPLOYMENT=dev:<convexProjectId>
NEXT_PUBLIC_CONVEX_URL=https://<convexProjectId>.convex.cloud
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
CLERK_SECRET_KEY=sk_test_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
CLERK_JWT_ISSUER_DOMAIN=https://example-id-0.clerk.accounts.dev
LIVEBLOCKS_SECRET_KEY=sk_dev_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
npx convex dev
npm run dev