This is a nextjs whiteboard app tutorial project integrated with Clerk, Convex, and Liveblocks, which is taught by Antonio, and you can find the tutorial video here.

Getting Started

Creating a file .env.local, and configuring the following environment variables. You can find the configuration steps in the following links:

• Clerk
• Convex
• Liveblocks

# Deployment used by `npx convex dev`
CONVEX_DEPLOYMENT=
NEXT_PUBLIC_CONVEX_URL=

# for clerk
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=

# for liveblocks
NEXT_PUBLIC_LIVEBLOCKS_PUBLIC_API_KEY=
NEXT_PUBLIC_LIVEBLOCKS_SECRET_KEY=

run the development server:

npm run dev

and the convex dev server:

npx convex dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.