Draft

draft-demo.mp4

About

A real-time collaborative document editor with support for multimedia uploads, emojis, and rich text formatting.

Libraries and Tools Used

Frontend

• Next.js 14 (app router)
• Shadcn UI
• Lucia auth
• Tailwind CSS
• Liveblocks

Backend

• PostgreSQL (Supabase)
• UploadThing (AWS S3 wrapper)
• Prisma

Possible Improvements

• AI autocomplete
• Using a different rich text editor to make it more mobile friendly

Running Locally

Install the dependencies

npm install

Fill in the environment variables in .env. There is an example file provided in .env.example. You will need to make an account on UploadThing, Liveblocks and Google Cloud Platform (your google account will work) to get API keys. As for the database URLs, you can host it locally, or you can do what I did and host on Supabase.

Run in development mode

npm run dev