Overview
LiveDocs is a clone of Google Docs built with Next.js, Liveblocks, and styled with TailwindCSS. The project aims to showcase real-time collaboration features while demonstrating the developer’s skills. With features like user authentication, collaborative text editing, document management, comments, and notifications, LiveDocs offers a comprehensive environment for working on documents with multiple users simultaneously.
Features
- Authentication: User authentication through GitHub using NextAuth for secure sign-in/out.
- Collaborative Text Editor: Real-time editing of documents by multiple users.
- Documents Management: Create, delete, share, and list documents with search and sorting capabilities.
- Comments: Inline and general comments with threading for discussions.
- Active Collaborators: Real-time presence indicators of active collaborators.
- Notifications: Alert users of document shares, new comments, and collaborator activities.
- Responsive Design: Application is responsive across all devices.
Installation
Prerequisites
- Git
- Node.js
- npm (Node Package Manager)
Cloning the Repository
git clone <repository-url>
cd <repository-folder>
Installation
npm install
Set Up Environment Variables
Create a .env file in the project root and add:
CLERK_KEY=your-clerk-key
LIVEBLOCKS_KEY=your-liveblocks-key
Running the Project
npm start
Open http://localhost:3000 in your browser.
Summary
LiveDocs is a project showcasing real-time collaboration functionalities similar to Google Docs, built with Next.js, Liveblocks, and TailwindCSS. With features like authentication, collaborative editing, document management, and notifications, LiveDocs provides a robust environment for multiple users to work on documents concurrently. The easy setup process allows developers to quickly explore and utilize the project for their own real-time collaborative applications.