/jsm_live_docs

Primary LanguageTypeScript


Project Banner
next.js typescript tailwindcss

A Collaborative LiveDocs

📋 Table of Contents

  1. 🤖 Introduction
  2. ⚙️ Tech Stack
  3. 🔋 Features

🤖 Introduction

Built with Next.js to handle the user interface, Liveblocks for real-time features and styled with TailwindCSS, LiveDocs is a clone of Goole Docs. The primary goal is to demonstrate the developer's skills in realtime enviroment that creates a lasting impact.

⚙️ Tech Stack

  • Next.js
  • TypeScript
  • Liveblocks
  • Lexical Editor
  • ShadCN
  • Tailwind CSS

🔋 Features

👉 Authentication: User authentication using GitHub through NextAuth, ensuring secure sign-in/out and session management.

👉 Collaborative Text Editor: Multiple users can edit the same document simultaneously with real-time updates.

👉 Documents Management

  • Create Documents: Users can create new documents, which are automatically saved and listed.
  • Delete Documents: Users can delete documents they own.
  • Share Documents: Users can share documents via email or link with view/edit permissions.
  • List Documents: Display all documents owned or shared with the user, with search and sorting functionalities.

👉 Comments: Users can add inline and general comments, with threading for discussions.

👉 Active Collaborators on Text Editor: Show active collaborators with real-time presence indicators.

👉 Notifications: Notify users of document shares, new comments, and collaborator activities.

👉 Responsive: The application is responsive across all devices.