Real-Time Chat App with NextJS, React, Tailwind, and Shadcn

سرفصل های دوره

Build and Deploy a NextJS Chat App with audio/video call using React, Tailwind, Typescript, and ShadcnUI

1. Introduction

1. Introduction

2.1 realtime-chat-app.zip

2. Before we begin.html

2. Project Setup

1. NextJS Project Setup

2. shadcnui Setup

3. NextJS Basics (optional)

1. Introduction to NextJS

2. Routing in NextJS

3. Client vs Server components

4. Database & Auth setup

1. Convex DB Setup

2. Clerk Auth Setup

3. Integrating Convex with Clerk

4. Storing user data in Convex DB

5. Layout and Navigation

1. Setting up frontend routes

2. Sidebar & adding navigation

3. Items list and conversation container

6. Dark Mode

1. Adding theme switching

7. Adding Friends

1. Backend for creating friend request

2. Add dialog for sending requests

3. Render list of requests

4. Showing pending request count

5. Deny friend request

6. Accept friend request

8. Conversations

1. Render list of conversations

2. Render active conversation

3. Chat input and sending messages

4. Rendering conversation messages

5. Render last message in conversations list

6. Removing friends

9. Groups

1. Backend for creating groups

2. Add dialog for creating groups

3. Rendering groups in conversations list

4. Delete group

5. Leave group

10. Read receipts

1. Backend for read receipts

2. Adding read receipts to conversations

3. Showing unseen messages count

11. Build & Deploy

1. Build & deploy to Vercel

2. Adding a custom domain

12. Emoji picker

1. Creating attachments popover

2. Adding the emoji picker

3. Connecting emoji picker to chat input

13. File upload

1. Setting up uploadthing

2. Adding imagevideofile uploads

3. Rendering image and video messages

4. Rendering file messages

14. AudioVideo call

1. LiveKit setup

2. Rendering audiovideo calls

3. Rendering call status

15. Publishing Progressive Web App

1. PWA and manifest setup

2. Metadata and Next config setup

3. Build and deploy to desktop and mobile

139,000 تومان

افزودن به سبد خرید

خرید دانلودی فوری

در این روش نیاز به افزودن محصول به سبد خرید و تکمیل اطلاعات نیست و شما پس از وارد کردن ایمیل خود و طی کردن مراحل پرداخت لینک های دریافت محصولات را در ایمیل خود دریافت خواهید کرد.

تولید کننده: Udemy