“`html
📖 课程介绍
### 从零到一:构建你的实时聊天应用 – 掌握全栈开发核心技能

你是否曾好奇,像微信、WhatsApp 这样的实时聊天应用是如何从零构建的?是否渴望亲手打造一款功能完备、可部署上线的聊天工具,并在此过程中掌握全栈开发的精髓?本课程将带你从基础出发,系统性地完成这一挑战。
**你将学到什么?**
课程从项目初始化开始,手把手带你搭建实时聊天的核心后端逻辑,并逐步实现专业级功能。你将学会:
– **实现消息已读回执**:掌握如何追踪消息状态,让用户清晰看到消息是否被对方阅读。
– **构建未读消息计数**:提升用户体验,精准显示未读消息数量,让沟通一目了然。
– **集成表情选择器**:为聊天界面增加趣味性,学习如何优雅地嵌入第三方组件。
– **完成构建与部署**:将你的应用部署到 Vercel,并配置自定义域名,让世界都能访问你的作品。
**为什么选择这门课?**
课程内容紧贴实际开发流程,每个章节都配有完整的代码示例、中英双语字幕及项目文件(如 `realtime-chat-app.zip`)。无论你是希望拓展全栈技能的前端开发者,还是想深入理解实时通信原理的后端工程师,都能从中获得可立即应用的实战经验。
**适合人群:**
– 具备基础编程知识,希望提升全栈开发能力的开发者
– 对实时通信(WebSocket)技术感兴趣的学员
– 想通过实战项目充实个人作品集的技术爱好者
**学习目标:**
完成本课程后,你将不仅拥有一个可运行的实时聊天应用,更将掌握从功能设计到部署上线的完整开发思维。立即开始,将你的想法转化为触手可及的产品!
课程目录
- ├─1. Introduction
- │ 1. Introduction.mp4
- │ 2. Before we begin.html
- │ 2.1 realtime-chat-app.zip
- │
- ├─10. Read receipts
- │ 1. Backend for read receipts.mp4
- │ 2. Adding read receipts to conversations.mp4
- │ 3. Showing unseen messages count.mp4
- │
- ├─11. Build & Deploy
- │ 1. Build & deploy to Vercel.mp4
- │ 2. Adding a custom domain.mp4
- │
- ├─12. Emoji picker
- │ 1. Creating attachments popover.mp4
- │ 2. Adding the emoji picker.mp4
- │ 3. Connecting emoji picker to chat input.mp4
- │
- ├─13. File upload
- │ 1. Setting up uploadthing.mp4
- │ 2. Adding image/video/file uploads.mp4
- │ 3. Rendering image and video messages.mp4
- │ 4. Rendering file messages.mp4
- │
- ├─14. Audio/Video call
- │ 1. LiveKit setup.mp4
- │ 2. Rendering audio/video calls.mp4
- │ 3. Rendering call status.mp4
- │
- ├─15. Publishing Progressive Web App
- │ 1. PWA and manifest setup.mp4
- │ 2. Metadata and Next config setup.mp4
- │ 3. Build and deploy to desktop and mobile.mp4
- │
- ├─2. Project Setup
- │ 1. NextJS Project Setup.mp4
- │ 2. shadcn/ui Setup.mp4
- │
- ├─3. NextJS Basics (optional)
- │ 1. Introduction to NextJS.mp4
- │ 2. Routing in NextJS.mp4
- │ 3. Client vs Server components.mp4
- │
- ├─4. Database & Auth setup
- │ 1. Convex DB Setup.mp4
- │ 2. Clerk Auth Setup.mp4
- │ 3. Integrating Convex with Clerk.mp4
- │ 4. Storing user data in Convex DB.mp4
- │
- ├─5. Layout and Navigation
- │ 1. Setting up frontend routes.mp4
- │ 2. Sidebar & adding navigation.mp4
- │ 3. Items list and conversation container.mp4
- │
- ├─6. Dark Mode
- │ 1. Adding theme switching.mp4
- │
- ├─7. Adding Friends
- │ 1. Backend for creating friend request.mp4
- │ 2. Add dialog for sending requests.mp4
- │ 3. Render list of requests.mp4
- │ 4. Showing pending request count.mp4
- │ 5. Deny friend request.mp4
- │ 6. Accept friend request.mp4
- │
- ├─8. Conversations
- │ 1. Render list of conversations.mp4
- │ 2. Render active conversation.mp4
- │ 3. Chat input and sending messages.mp4
- │ 4. Rendering conversation messages.mp4
- │ 5. Render last message in conversations list.mp4
- │ 6. Removing friends.mp4
- │
- └─9. Groups
- 1. Backend for creating groups.mp4
- 2. Add dialog for creating groups.mp4
- 3. Rendering groups in conversations list.mp4
- 4. Delete group.mp4
- 5. Leave group.mp4
“`
温馨提示:由于部分资源中不可避免的存在一些敏感关键词,如果购买后提示网盘资源链接失效,或者提示此类资源无法分享的情况,您无需担心,只需要联客服联系为您补发资源即可,客服QQ: 502212423,或者微信:jamisoncnwd,邮箱:502212423@qq.com
声明:本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理,邮箱:502212423@qq.com。
声明:本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理,邮箱:502212423@qq.com。







