CF

SocketIO v4, with websockets - the details.

24h 34m 57s
English
Paid

SocketIO v4, with websockets - the details. is a 132-lesson 24 hours 34 minutes self-paced course by Udemy. This course is meant to alleviate that!

Course facts

Lessons
132
Duration
24 hours 34 minutes
Level
All levels
Language
English
Updated
Instructor
Udemy
Price
Premium

This course is meant to alleviate that! It is not a quick start guide to socket.IO. There are loads of those all over the Internet. You should definitely look elsewhere if you are wanting a 10 minute intro to the 3-4 things you need to know to make something quick. On the other hand, if you are looking to really learn one of the most awesome JavaScript libraries in socket io, you should stick around. Like Express and other JavaScript/Node pieces,  it's getting passed over in the wave to learn just enough to get to the term "full-stack developer."

Requirements:
  • You have a solid working knowledge of JavaScript and nodejs (Not a ninja, but you are not new).
  • You have used the node ecosystem (npm, Express, etc.). This is NOT an intro to node class and I will NOT cover these in detail.
  • You have basic command line knowledge (at least capable of navigating and running a program)
  • You have a computer capable of running Nodejs.

Websockets are one of the coolest things to hit the web in ages. They allow the browser real-time communication bridging one of the last gaps in both human and web-based communication. Socket io is the king library that uses websockets under the hood. There's a good chance if you're reading this, you've heard about socket io. Maybe even done a tutorial on it. But how far did you get? In my experience, the vast majority of the material on the web goes no farther than a quick-start, instant chat app. You don't learn how anything works, never look at the docs, and are stuck at the end wondering what to do now. The remaining shred of material is waaaaay over everyone's head. The fact that the websocket API was standardized in 2011 and most developers still don't know how to use it is evidence of the gap.

My main goal is to help you figure out how to go from being a good developer to a great developer. Understanding... not just knowing a few methods... of socketio is part of that! It even trancends the browser and node with implementations in most other languages, and even mobile. This means as you grow, you have the power of sockets without having to learn more than the socket io library.

I first used socket.IO in 2013 for a tiny company directory app. I've been following since and have been frustrated that it hasn't gotten more mainstream notice because it opens the way for so many improvements to existing applications and obvious groundwork for new ones. Let's change that :) Prepare to for a detailed look at socketio and websockets and start going real-time.

Sections:

  1. Environment Setup (skip if you have node installed already)

  2. Before Socket.IO... - TCP, network sockets, & a native websockets app

  3. Socketi.IO 101 - Why you'd want to use socketio and how it works (simple chat app)

  4. Socket.IO 201 - Making the chat app into a slack clone with namespaces and rooms

  5. Project 1 - real-time canvas game

  6. Project 2 - Real-time performance data (uses React, Cluster, and Redis)

  7. streaming videos & socket.io-stream - in development

  8. Supplemental - HTTP (for those in need of a review)

Who this course is for:
  • JS/Node developers who want to actually learn how to use Socketio for more than a chat app tutorial
  • JS developers interested in how node & JS combine to make the networking happen
  • Developers interested in building real time applications

What you'll learn:

  • Socketio. That's (mostly) all we cover so when you finish, you'll know it!
  • Setup a socketio application between the browser and an Express server and run real-time back and forth
  • Understand the basics of websockets and how they work
  • The basics of the transport layer and how a packet works

Who teaches SocketIO v4, with websockets - the details.? Udemy

Udemy thumbnail

Udemy is the largest open marketplace for online courses on the internet. Founded in 2010 by Eren Bali, Oktay Caglar, and Gagan Biyani and headquartered in San Francisco, the company went public on the Nasdaq in 2021 under the ticker UDMY. The platform hosts well over two hundred thousand courses across software development, IT and cloud, data science, design, business, marketing, and creative skills, taught by tens of thousands of independent instructors. Roughly seventy million learners use it worldwide, and the corporate arm — Udemy Business — supplies a curated subset of that catalog to enterprise customers.

Because Udemy is a marketplace rather than a single editorial publisher, the catalog is uneven by design. The strongest material lives in the long-form, project-based courses authored by working engineers — full-stack JavaScript, React, Node.js, Python data science, AWS, Docker and Kubernetes, mobile development with Flutter and React Native, and cloud certification preparation. The CourseFlix listing under this source is the slice of that catalog that has been mirrored here for offline-friendly viewing, organized by topic and updated as new releases land. Pricing on Udemy itself swings dramatically with the site's near-permanent sales, which is why the platform is best treated as a deep reference catalog: pick instructors with strong reviews and a track record of updating their material rather than buying on the headline price alone.

What lessons are included in SocketIO v4, with websockets - the details.?

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 132 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Welcome Video
All Course Lessons (132)
#Lesson TitleDurationAccess
1
Welcome Video Demo
02:15
2
Course Overview
05:18
3
It's 2023: native websockets or socket.io... what should we use?
10:45
4
Pre-socketio
06:26
5
Housekeeping - How I do node/express
05:18
6
TCP/UDP and networking 101
18:08
7
Networking 201 - What is a socket and why should I care?
15:37
8
HTTP vs Websockets
03:55
9
A short overview of native websockets (finally some code!!)
13:48
10
A short overview of native websockets continued
15:05
11
Intro
01:42
12
Why Socket.io? This is why.
08:10
13
The basics of socket.io
15:07
14
An important pitfall - connect/reconnect
07:44
15
Small Chat app - in socket.io!
17:00
16
Docs - new Server
10:04
17
Docs - Server options
09:12
18
The big 3 - .emit, .on, .connect
09:35
19
Docs - The Client
07:44
20
Section Intro and folder setup
04:15
21
A quick illustration
04:15
22
Project Whiteboarding & Steps
11:07
23
Setup slack with sanity checks
07:59
24
Steps 1-3 - Populate spaces and rooms from the server
09:58
25
Rooms and Namespaces classes
10:49
26
Add rooms to DOM
08:34
27
UX Cleanup
06:38
28
Docs - Namespaces
11:43
29
Namespaces code review
06:16
30
Docs - Rooms
11:38
31
Step 4-6
09:23
32
Whiteboarding - performance thinking Websockets
05:36
33
Implementing nsChange and Express route --> io.emit
13:18
34
Implementing nsChange continued...
10:13
35
Slack - Joining a Room- Steps 7-9
12:19
36
Acknowledgement Functions, fetchSockets() - steps 7-9 continued
15:17
37
emitWithAck, init join room
04:48
38
emit messages to room - steps 7-9 continued
14:20
39
Slack - Sending the history - Steps 7-9 continued
19:44
40
Passing query data on connection - basic auth intro
08:10
41
Project Demo & setting expectations
12:48
42
Project Strategy - performance matters!
10:32
43
Socket.io App Organization
16:06
44
Getting the DOM setup
14:14
45
A few UI Loose ends
07:13
46
Draw the player
13:24
47
The ugly math of moving the right direction
19:58
48
Get, and draw, the game orbs (non-players)
16:41
49
Whiteboarding Player classes - What does the server NEED to send?
07:30
50
The Player Classes
14:14
51
Refactoring init for performance
12:59
52
Tick-Tock - send player data from the server to the clients and vice-versa
08:46
53
Step 1 of drawing the players from the server
05:49
54
Tock event - sending player direction from client to server
08:16
55
Clamping the camera (and a little cleanup)
17:51
56
Collision Testing (the Math part)
08:48
57
Collision Testing (the code part)
14:20
58
Leaderboard
13:13
59
Disconnect
06:03
60
Project Demo
03:53
61
Socket.io scaling options
07:57
62
Project Setup and dependencies
06:58
63
Architecture
09:20
64
Pulling performance data
11:24
65
Figuring CPU load
20:02
66
How the cluster module works
10:18
67
Using the cluster module
08:29
68
Connecting React to the socket.io server (for testing!)
06:03
69
Connecting nodeClient to the socket server
05:11
70
Fetch nodeClient macAddress
08:12
71
Start the ticking clock
09:22
72
Create React App Overview
03:27
73
Basic React Component Architecture
04:43
74
Connecting React to the socket server the correct way
08:11
75
Getting data to React, and setting up React components
10:23
76
Sending state to our <Widget />
06:24
77
A little UI busywork - moving/copying files, classNames
06:56
78
CPU widget - canvas
07:52
79
Memory widget
06:36
80
Adding isAlive, disconnect, and final touches
13:02
81
Handling a nasty React bug...
13:13
82
Admin UI on Agar Clone
12:47
83
HTTP 101
14:13
84
Namespaces
23:29
85
Rooms
21:35
86
Going Slack (project) - Overview & Steps
15:53
87
Folder structure & DOM overview
08:19
88
Setting up our data and classes
10:57
89
Slack: Steps 1-3
19:48
90
Slack - Steps 4-6
12:49
91
Refactoring and Reorganizing our code
06:03
92
Slack - Joining a Room- Steps 7-9
23:28
93
Slack - Sending the history - Steps 7-9 continued
18:30
94
Slack - Linking up NS and Group, & Final Touches
19:26
95
Passing query data on connection
06:35
96
Line by line review of the project
21:23
97
Docs Checklist Update
06:34
98
Project Intro
12:49
99
Project Strategy
10:31
100
Socket.io App Organization
17:12
101
Getting the DOM setup
15:46
102
Time to draw!
30:20
103
Add Sockets (and orbs)
14:36
104
Wiring up the server for collisions
21:32
105
Connecting the client and server
07:57
106
Tick-Tock - 30FPS
22:08
107
Collision Testing (the Math part)
11:00
108
Collision Testing (The Socket Part)
13:55
109
Collision Testing (The Socket Part 2)
10:56
110
Updating the LeaderBoard
10:18
111
Disconnecting and broadcasting a message
15:42
112
Project Demo
04:06
113
Project Setup and dependencies
05:22
114
Installing Redis on Windows
03:47
115
Architecture
18:11
116
Getting performance data
10:26
117
Getting performance data - part 2
15:31
118
How the cluster module works
12:46
119
Using the cluster module - Master
08:16
120
Using the cluster module - workers
10:13
121
Connecting nodeClient to the socket server
06:12
122
Start the ticking clock
12:13
123
Mongo/Mongoose Schema and a small fix
15:49
124
Adding a record
07:48
125
Create React App Overview
03:38
126
Connecting React to the socket server for re-useable
07:38
127
Basic React Component Architecture
04:50
128
Setup React Components
05:49
129
Setting our widget state
16:31
130
CPU widget canvas
08:31
131
Mem and Info widgets
11:47
132
Adding isActive, disconnect, and final touches
23:08
Unlock unlimited learning

Get instant access to all 131 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

What courses are similar to SocketIO v4, with websockets - the details.?

More courses by Udemy

Frequently asked questions

What are the prerequisites for this course?
This course assumes a solid understanding of JavaScript and Node.js, as it delves deeply into the socket.io library and related concepts. Familiarity with Express and basic networking principles, such as TCP/UDP and HTTP, is also beneficial as these topics are covered early in the lessons.
What will I build during this course?
Throughout the course, students will work on building projects like a small chat application using socket.io and a more complex project that involves setting up a Slack-like application. The course also covers creating a game with player movement, collision detection, and a leaderboard feature.
Who is the target audience for this course?
This course is ideal for developers who already have experience with JavaScript and Node.js and are looking to deepen their understanding of real-time web applications using socket.io. It is not suited for those seeking a brief introduction, as the material is detailed and extensive.
How does the depth of this course compare to other socket.io courses?
Unlike quick start guides, this course provides a comprehensive exploration of socket.io, covering both theoretical and practical aspects. It includes detailed discussions on topics such as namespaces, rooms, and performance considerations, offering a depth that might not be present in shorter courses.
What specific tools or platforms are covered in this course?
The course primarily focuses on the socket.io library within the context of JavaScript and Node.js. Students will also work with Express for setting up the server environment and will explore concepts related to native websockets, comparing them to socket.io.
What topics are not covered in this course?
The course does not serve as a general introduction to JavaScript or Node.js. It assumes prior knowledge of these technologies and does not cover basic programming concepts or broader web development frameworks outside of socket.io and its related networking topics.
How much time should I expect to commit to this course?
While the course consists of 132 lessons, the total runtime is not specified. Given the detailed nature of the content, students should be prepared to spend a significant amount of time studying, coding, and experimenting with the projects to fully grasp the concepts.