Udemy

Platform

English

Language

Web Development

Category

Node with SocketIO: Build A Full Web Chat App From Scratch

Build A Complete Chat App With Private and Group Chat Functionalities Using NodeJS, SocketIO, MongoDB, Express

4.20 (234 reviews)

Students

27.5 hours

Content

Jul 2019

Last Update
Regular Price

EXCLUSIVE SKILLSHARE OFFER
Exclusive  SkillShare  Offer
Unlimited access to 30 000 Premium SkillShare courses
30-DAY FREE TRIAL
EXCLUSIVE SKILLSHARE OFFER
Exclusive SkillShare Offer
Unlimited access to 30 000 Premium SkillShare courses
40%OFF ANNUAL MEMBERSHIP

What you will learn

Understand RESTful API Design

Use Social Authentication in Apps

Dependency Injection Module

SocketIO Events

Store and Retrieve Data with MongoDB and Mongoose

AWS S3 Buckets

App Deployment to Production

Express Servers and APIs

Group Chat Functionality

Private Chat Functionality


Description

Have you tried to build your own web application with real time functionalities using Node? Maybe you have heard about the popular socket IO real time application framework but have never used it because you don't know where and how to start. Perhaps, you have tried to build an application with some socket IO functionalities and you need to do more with it, then this course is for you.

This course is created for you

The complete socket IO course will guide you through building your own real time web chat application from start to finish.The course uses tools like Express, Mongodb, Mongoose.

The best way to learn Node

Reading about Node is not just sufficient in learning but also by building real world apps. That is why this course is strictly project based from start to finish. At the end you'll gain hands on experience in learning Node and socket IO.

You'll be building a chat application using:

  • Node
  • Socket IO
  • NPM
  • Express
  • MongoDB
  • Mongoose
  • Amazon Web Service
  • RESTful API Design
  • Asynchronous  programming
  • ES6 features like classes
  • Version control with Git
  • Github
  • App deployment with Heroku

What is an app if it is not online for people to use? That is why i'll show you how to deploy your app to Heroku and also point your own domain to heroku app url or domain.

During the course you'll learn:

  1. Dependency injection with modules
  2. Users local authentication with passport
  3. Users social authentication with Facebook and Google
  4. Amazon Web Service
  5. Uploading files to AWS S3 buckets from your Node.js app
  6. MongoDB aggregate method
  7. Socket IO emitting and listening for events
  8. Group chat functionality
  9. Private chat functionality
  10. Functionality to send and receive friend requests
  11. Real time friend request and message notifications
  12. Using third party API
  13. App deployment to Heroku (You'll see how to point your own domain to heroku app)
  14. And more...

Screenshots

Node with SocketIO: Build A Full Web Chat App From Scratch
Node with SocketIO: Build A Full Web Chat App From Scratch
Node with SocketIO: Build A Full Web Chat App From Scratch
Node with SocketIO: Build A Full Web Chat App From Scratch

Content

Introduction

Introduction

Read Text

Tools For this Course

Please Ask Questions

Install Node

Setup Express and Dependable Modules

Setup Git Repo

NPM Initialization

Install Express Framework

Dependable Module Description

Install Dependency Injection Module

Export Dependency Container File

Setup Express

Add Express Promise Router

Express Configuration Function

Setup Users Get Route

Questions

Users Local Registration

Section Introduction

Install Modules For Project Setup

Install Passport Module

Signup Get Route

Add Signup Page and Form

User Model and Schema

Setup Passport For Local Authentication

Passport Local Signup

Encrypt Password

Signup Post Route

Create New User

Signup Validation - Part 1

Signup Validation - Part 2

Add Validation Function to Route

Display Signup Errors

User Login Form

Passport Local Login

Display Login Errors

Questions

Update Project and Packages (NEW UPDATE)

Before You Start This Section

Github Repo

Update All Packages

Remove MongoClient

Update Express Validator - Part 1

Update Express Validator - Part 2

Display SignUp Errors

Display Login Errors

Fix Mongoose Aggregate Errors

Mongoose UpdateOne Method

Fix Headers Error

Remove Invalid Error Message

Check That App Still Works

Users Social Authentication

Section Introduction

Add Facebook Button

Style Facebook Button

Passport Facebook Strategy

Facebook Developers App

App Secret File

Facebook Passport Middleware

Passport Facebook Route

Fix Secret File Error

Signup User With Facebook

Facebook Login

Google Signup Button

Passport Google OAuth Strategy

Google Developers App

Google App Ids

Google Passport Middleware

Passport Google Route

Change Google OAuth Scope

Signup user With Google

Amazon Web Service Buckets

Section Introduction

Admin Group Form

Admin Page Route

Clubs Schema and Model

Upload File (Client Side) - Part 1

Upload File (Client Side) - Part 2

Formidable Module

Add File to Local Directory With Formidable

Upload File To Local Directory

Get Amazon Web Service Keys

Create AWS S3 Bucket

Install AWS SDK

AWS Upload File Functionality - Part 1

AWS Upload File Functionality - Part 2

Upload Any Method

Save Club Data to Database

Upload File to S3 Bucket

Section Conclusion

Questions

Home Page Section

Section Introduction

Home Page Controller

Add Home HTML File

Navbar Brand CSS

Navbar Link CSS

Style Filter Button

Install Async Module

Retrieve Club Data

Display Club Data

Retrieve Files Form S3 Bucket

Array Chunk Size

Display Array Chunks

MongoDB Aggregate Method Description

MongoDB Aggregate Function

Display Aggregate Result

Country Sort

Image Anchor Tag

Questions

Group Chat Section

Section Introduction

Add Group Chat Route

Group Chat Page HTML

Navbar Partials

Socket.io Description

Install Socket.io

Socket.io Client

Listen for First Connection Event

Emit Message Event

Listen for Message Event

Emit Join Event

Send Channel Message

Add Message Sender

Add HTML For Chat Display

Render Message With Mustache

ES6 Class Method - Part 1

ES6 Class Method - Part 2

User Class Add Method

Emit Users List

Display Users List

User Class Remove Method

Socket.io Disconnect Event

Number of Connected Users

Style Modal

Friend Request Logic

Username Display on Navbar

Friend Request Fields

Friend Request Files Setup

Display Username on Modal

Friend Request Join Event

Emit Friend Request Event

Listen for Friend Request Event

Group Chat Post Route

Receiver Document Update

Sender Document Update

Friend Request Dropdown

Get User Data

Display Request in Dropdown

Friend Request Notification

Add Sender Name

Accept Request Functionality

Update Receiver Function - Part 1

Update Receiver Function - Part 2

Add Ajax Method to Event

Cancel Request Functionality

Questions

Users Global Event

Add Navbar to Home Page

Add to Favorite Ajax Method

Add to Favorite Post Route

Create Global Class

Emit Global Room Event

Emit Global Users

Logged in Users Event

Display Logged in Friend Name

Style Friend Name

Global Room Disconnection

Logout Functionality

Filter Results Page

Filter Results Post Route

Search Results

Replace URL Space

Private Chat Section

Section Introduction

Private Chat Route

Private Chat Template

Fix Private Chat URL

Deparam Function

Swap Function

Emit Private Chat Join Event

Display Private Chat

Display Username

Message Dropdown

Private Message Schema and Model

Private Chat Post Route

Save Private Message to Database

Message Aggregate Functionality

Display Aggregate Results

Display Number of Messages

Display Messages in Dropdown

Message Refresh Event

Get User Private Messages

Display Private Messages in Database

Add Data Value Property

Update Private Message Collection

Display PM on Home Navbar

Display PM on Group Chat Navbar

Group Chat Message Schema

Save Group Messages to Database

Fix Name Field in Database

Display Group Messages From Database

Members Page

Search Users

Function to Swap Two Values

Users Profile Section

Section Introduction

User Profile Page

Profile Page HTML

New Properties in User Model

Profile Page Navbar

User Profile Image Upload

Upload Profile Image to AWS

Profile Page Ajax Method

Profile Page Post Route

Display Profile Image

Automatic Display of Profile Pic

Update Profile Route

Display User Data

Add User Interest Page

Interest Page HTML

Favorite Club Ajax Method

Save Favorite Club Data to Database

Display Favorite Clubs

Save and Display Favorite Players

Display Favorite National Teams

User's Overview Page

Fix Overview Page Issue

Overview Page Post Route

Display Images

Display Images in Dropdown - Part 1

Display Images in Dropdown - Part 2

Add CSS to Users Images

Display User Image on Private Chat Page

Display Friend Request Images

Football News Section

Section Introduction

News Get Route

HTML Code For News Page

Guardian API

Display News Images

Display Football News Headlines

Display News Summary

Add Image Responsive Class

Add CSS Styles to Date

Format Date

Load More Button

Load More Button CSS

Load More Data Functionality

Back to Top Functionality

Change Animate Time

Heroku Deployment

Section Introduction

Helmet and Compression Modules

Create Database in Mlab

Add Clubs Collection

Environment Variables

404 Middleware

Git Push

Create heroku App

Create Procfile

Install Forever Module

Add Config vars to Heroku App

Fix Config Vars Errors

Setup Heroku Automatic Deploy

Point Domain to Heroku

Add Naked Domain

Enable Session Affinity


Reviews

I
Irwan9 February 2021

Follow from beginning, then suddenly update package with many changes, it make very confuse and why not consisten with current version package ?

А
Айбол17 April 2020

Курс просто ужасный. У Автора ужасный акцент (английский оставляет желать лучшего). Весь код который он пишет давным давно устарел. Я 2 дня потратил время впустую. Верните деньги!!!

K
Kerem26 March 2020

Many things not covered, some things you just have to copy as the teacher says without explanation, several things outdated and deprecated without any real update.

C
Cem29 September 2019

Instructor does not give the knowledge prior to commands or actions, just does the writing. I would like to know the backbone of the whole system he try to build and know why I am doing a particular coding at a time.

D
Dalin2 September 2019

unbelievable amount of value in this course,after learning, Javascrip then move to Node.js i build small app, but i needed something challenging, this course help me a lot and it very advance. i learn how to organize file, how files connect to other files (very complex), we made use of so many packages that i did not even know of, there are concept of database, encryption, facebook auth, AWS, socket.io, ajax there is so much knowledge and the tutor explain everything, if you understand (not copy and paste) everything here you are an advance programmer, thank you so much Mr Eddie

M
MIN7 January 2019

A very comprehensive and pretty good course on socket.io. Instructor is also responsive and helpful Thanks!

J
Joseph29 November 2018

Although, these stuffs so far are what I already know, but I like the teacher's explanation. They are clear to understand. I look forward to the chat aspect.

P
Puah18 September 2018

, not yet explain the integration of google and facebook, url , with live site, the rest are ok, learnt a lot from it

A
Audrey27 August 2018

This was very detailed about all the aspects that were needed to complete the app. The app structure was very organized & the tutorial was easy to follow. Thanks.

R
Randy27 July 2018

Definitely loved how he goes straight to the point of what you are doing and you get major progress quickly. Does not dive deep into the abstraction of the ideas which confuse me.

M
Maria28 May 2018

I've done a lot of this already, but it is good that he approaches for everyone the way that he does. It seems to be comprehensive so far! I found an error which had stumped me along the way, but then fixed and now I see that everything so far seems to be working as it should.

S
S3 March 2018

This course is for those who already have some experience with Node.js, MongoDB, Socket.IO. If you are one of those people, then it may be good for you to gain a hands-on experience building a web chat app from start to end by watching the instructor write codes as well as you writing codes. The web app we build in this course looks attractive at least to me and after completing building the app, I think you will be satisfied with what you build. But, you must be willing to debug codes by yourself when you encounter a bug as you move on as the how this course is structured is very bad... Also, you must be experienced enough to know what is good code and what is good architecture. don't expect you can learn how to write good code and good architecture from this instructors code. if you don't have experience much with Node.js, MongoDB, Socket.IO, then probably this course is not for you. this instructor does not explain why and how things work behind the scene so you will not have a good understanding around Node.js, MongoDB, Socket.IO. Plus, this instructor has a strong accent, so it makes what he says difficult to understand as well. Furthermore, although the instructor provide the final code in github, he does not provide the working code for each video or each section, so it is really hard students to get recovered once students get stuck. And I think even the final code he provides has several bugs as he is not taking care of various scenarios that can cause a bug. How he names variables sometimes is bad as well. for example, res1, res2, val1, val2... these variable name does not help at all for us to understand what these variables for. also, it is weird that capitalizing the initial letter of instance method like User.DoSomething(). it should start with lowercase like User.doSomething(). I noticed that from the point of 1/5 or so of this entire course, there are almost no question asked from students in Q&A section. it implies that a lot of student gave up continuing this course as it is hard to follow this course, especially for beginners. because there are a few questions and answers posted in Q&A section of this course, when you get stuck in a certain section of this course, you'll be the first one who need to post a question, that means unlike other courses in Udemy, you can not get a solution already posted by the instructor for the past students, that is so ineffective. The approach Im taking is that I learn node.js, mongodb, socket.io from other instructors and use this course to gain hands-on experience building web chat app in this course. I may change my rating when I finish this course. For now, Im having a very hard time to follow this course material. I don't know how many days I need to spend to finish up this course material... *UPDATES1* Even the final code this instructor provides does not work properly. I think this course is incomplete. *UPDATES2* I don't recommend this course to anyone anymore. I tried to write a fair review but this course is not recommended to beginners and people who already have some experience with the subject matter. just a lot of things in his code are not tolerable. ``` GetUser(id){ var getUser = this.globalRoom.filter((userId) => { return userId.id === id; })[0]; return getUser; } ``` For example, this code. the returned value's variable name is getUser which make readers of this code misunderstand the returned value is a function not an array. also, look at the argument of the callback function of filter method. the variable name is userId but the context of filter method is globalRoom. don't we expect it to be like `this.globalRooms.filter((room) => {});` ?? how come what's inside of the list of rooms is not a room but usreId? so confusing... lastly, as I mentioned earlier in this review, somehow he names instance methods like GetUser. it should start with a lower case letter unless it is a constructor function. Yeah... there are a lot of code like this in this course. So, I highly recommend anyone who's interested in this course to stay away from it. *UPDATES3* I gave up continuing this course in section9(out of 12). I feel so sad that I have wasted so much time on this course...

E
Elizabeth17 January 2018

Well explained and very informed. Also, he takes his time to respond to questions and very willing to assist. I really enjoy this course

K
Karim18 October 2017

This is probably the worst tutorial there is on Udemy. I don't even know which teaching method is being used. Everything is so complex and so difficult to understand, delivery is very poor. Too late to get my money now I guess and that's too bad. I suggest doing all the videos again using a better or simpler approach. Even experienced Node.js users might struggle to follow not to mention beginners.


Related Courses

SKILLSHARE
Socket.IO and TypeScript
Socket.IO and TypeScript

1353206

Udemy ID

9/17/2017

Course created date

11/16/2019

Course Indexed date
Bot
Course Submitted by

Twitter
Telegram