When you enroll through our links, we may earn a small commission—at no extra cost to you. This helps keep our platform free and inspires us to add more value.

Udemy logo

Next.js 14 Real-Time Chat App using Socket IO

Build real time chat application using Next JS , Socket IO , Clerk , Firebase

     
  • 4.3
  •  |
  • Reviews ( 14 )
₹449

This Course Includes

  • iconudemy
  • icon4.3 (14 reviews )
  • icon12.5 total hours
  • iconenglish
  • iconOnline - Self Paced
  • iconcourse
  • iconUdemy

About Next.js 14 Real-Time Chat App using Socket IO

Hello, Welcome to the course Next.js 14 Real-Time Chat App

Certainly, I'd be happy to elaborate on the features included in the Next.js 14  Real-Time Chat App course.

Tech Stack

Learn Next JS 14 Latest Features like App Router , Server Actions , Middlewares etc.

Implement Clerk Authentication .

Working with SOCKET IO to perform all real-time tasks.

Deploying Next JS App to Vercel and Node App to Render

Working with combination of both client and server components

Using Tailwind CSS in-order to override Ant Design default styling and building custom components

Project

Implement CLERK Authentication for sign-up and sign-in.

Logged in users will be able to see all the list of users who registered in the application

If any user want to chat with other user , they have to add the user to chats list

Users can create one-to-one chat and also group chats.

Users can able to update their profile picture , create groups , edit groups.

Users can see unread messages count in chats-list for every chat.

Integrating socket io in-order to make all the chat functionalities real time.

Once the socket io is integrated , users will be able to send and receive the messages in real-time.

Recipient users can see the typing animation if any user is typing in that chat.

Read Receipts functionality for the messages.

Next.js is an open-source, objective-coded framework for web developers created by Kotlin JS developers. It is used to create server-rendered React applications and can be used with modern JavaScript languages like TypeScript, GraphQL, and React components.

Next.js allows developers to create web applications to a high standard with pre-built features such as routing, file-based routing, webpack dev server, hot module replacement, static exports, and code splitting.

Next.js works well for building static sites and progressive web apps that are SEO-friendly, accessible, and fast.

What You Will Learn?

  • Implement CLERK Authentication for sign-up and sign-in..
  • Logged in users will be able to see all the list of users who registered in the application.
  • If any user want to chat with other user , they have to add the user to chats list.
  • Users can create one-to-one chat and also group chats..
  • Users can able to update their profile picture , create groups , edit groups..
  • Users can see unread messages count in chats-list for every chat..
  • Integrating socket io in-order to make all the chat functionalities real time..
  • Once the socket io is integrated , users will be able to send and receive the messages in real-time..
  • Recipient users can see the typing animation if any user is typing in that chat..
  • Read Receipts functionality for the messages..