Build a Real-Time Google Docs Clone With Next 15, React, Tailwind (2024) скачать в хорошем качестве

Build a Real-Time Google Docs Clone With Next 15, React, Tailwind (2024)

⭐ Source code: https://dub.sh/yHzgD0r Assets: https://dub.sh/docs-clone-assets Liveblocks: https://lblcks.io/7qfuW9W Clerk: https://go.clerk.com/3ywohHV Convex: https://convex.dev/c/cwa Hi all 👋 In this 10-hour tutorial you will learn how to create a full-stack Google docs clone, including real-time collaboration, comments, threads, an advanced TipTap editor, custom extensions, templates and much more. Key Features: 📝 Rich Text Editor 🤝 Real-time Collaboration & Database 💭 Comments and Mentions 🔔 Notifications System 📑 Document Templates 📋 Copy and Paste Formatting ↩️ Undo/Redo History 📊 Table Support 🖼️ Image Uploads 📏 Margin Controls ⬇️ Export (PDF, HTML, TXT, JSON) 👥 User Profiles 🏢 Organization Workspaces ✉️ Organization Invites 🔒 Authentication 📱 Responsive Design 🎯 Cursor Tracking 🎨 Text Formatting Tools 📝 Lists and Checklists 🔗 Link Embedding ⚛️ Framework Next.js 15 🎨 Shadcn UI & Tailwind CSS 🚀 Deployment on Vercel Timestamps 00:00 Intro & demo 02:13 Project setup 28:44 Project structure 46:49 Tiptap editor 01:02:28 Tiptap extensions 01:26:49 Editor store 01:44:38 Editor tools 01:58:18 Font family & headings tools 02:19:05 Color tools (text & highlight) 02:33:26 Link and image tools 02:51:23 Align and list tools 03:00:03 Font size tool (custom extension) 03:19:40 Line height tool (custom extension) 03:32:55 Margin ruler component 03:59:42 Navigation bar component 04:23:57 Navigation bar tools 04:35:01 Search input component 05:00:54 Template gallery component 05:16:25 Database setup (Convex) 05:33:29 Authentication setup (Clerk) 05:51:27 Create and list documents 06:19:00 Update and delete documents 06:49:22 Search documents 06:57:25 Organizations feature 07:23:29 Collaboration setup (Liveblocks) 07:47:12 Room permissions 08:09:06 Populate user information 08:30:35 Notifications feature 08:47:19 Collaborative margin ruler 08:53:29 Document information 09:27:31 Templates initial content & app optimization 09:39:27 Deployment (Vercel) 09:58:27 Editor autofocus & redeploy