Socket.IO (with websockets) - the details. (socket io v2)
- Description
- Curriculum
- FAQ
- Reviews
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.
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.” 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:
-
Environment Setup (skip if you have node installed already)
-
Before Socket.IO… – TCP, network sockets, & a native websockets app
-
Socketi.IO 101 – Why you’d want to use socketio and how it works (simple chat app)
-
Socket.IO 201 – Making the chat app into a slack clone with namespaces and rooms
-
Project 1 – real-time canvas game
-
Project 2 – Real-time performance data (uses React, Cluster, and Redis)
-
streaming videos & socket.io-stream – in development
-
Supplemental – HTTP (for those in need of a review)
-
3Pre-socketioVideo lesson
-
4Housekeeping - How I do node/expressVideo lesson
-
5TCP/UDP and networking 101Video lesson
-
6Networking 201 - What is a socket and why should I care?Video lesson
-
7HTTP vs WebsocketsVideo lesson
-
8A short overview of native websockets (finally some code!!)Video lesson
-
9IntroVideo lesson
-
10The basics & socket.io vs. wsVideo lesson
-
11Why socket.io? This is why.Video lesson
-
12Small Chat app - in socket.io!Video lesson
-
13Docs - The serverVideo lesson
-
14The big 3 - .emit, .on, .connectVideo lesson
-
15Docs - The ClientVideo lesson
-
16Finishing the chat appVideo lesson
-
17Quick Checklist ReviewVideo lesson
-
18NamespacesVideo lesson
-
19Namespace/Group CheatsheetText lesson
-
20RoomsVideo lesson
-
21Going Slack (project) - Overview & StepsVideo lesson
-
22Folder structure & DOM overviewVideo lesson
-
23Setting up our data and classesVideo lesson
-
24Slack: Steps 1-3Video lesson
-
25Slack - Steps 4-6Video lesson
-
26Refactoring and Reorganizing our codeVideo lesson
-
27Slack - Joining a Room- Steps 7-9Video lesson
-
28Slack - Sending the history - Steps 7-9 continuedVideo lesson
-
29Slack - Linking up NS and Group, & Final TouchesVideo lesson
-
30Passing query data on connectionVideo lesson
-
31Line by line review of the projectVideo lesson
-
32Docs Checklist UpdateVideo lesson
-
33Project repoText lesson
-
34Project IntroVideo lesson
-
35Project StrategyVideo lesson
-
36Socket.io App OrganizationVideo lesson
-
37Getting the DOM setupVideo lesson
-
38Time to draw!Video lesson
-
39Add Sockets (and orbs)Video lesson
-
40Wiring up the server for collisionsVideo lesson
-
41Connecting the client and serverVideo lesson
-
42Tick-Tock - 30FPSVideo lesson
-
43Collision Testing (the Math part)Video lesson
-
44Collision Testing (The Socket Part)Video lesson
-
45Collision Testing (The Socket Part 2)Video lesson
-
46Updating the LeaderBoardVideo lesson
-
47Disconnecting and broadcasting a messageVideo lesson
-
48Project DemoVideo lesson
-
49Project Setup and dependenciesVideo lesson
-
50Installing Redis on WindowsVideo lesson
-
51ArchitectureVideo lesson
-
52Getting performance dataVideo lesson
-
53Getting performance data - part 2Video lesson
-
54How the cluster module worksVideo lesson
-
55Using the cluster module - MasterVideo lesson
-
56Using the cluster module - workersVideo lesson
-
57Connecting nodeClient to the socket serverVideo lesson
-
58Start the ticking clockVideo lesson
-
59Mongo/Mongoose Schema and a small fixVideo lesson
-
60Adding a recordVideo lesson
-
61Create React App OverviewVideo lesson
-
62Connecting React to the socket server for re-useableVideo lesson
-
63Basic React Component ArchitectureVideo lesson
-
64Setup React ComponentsVideo lesson
-
65Setting our widget stateVideo lesson
-
66CPU widget canvasVideo lesson
-
67Mem and Info widgetsVideo lesson
-
68Adding isActive, disconnect, and final touchesVideo lesson
External Links May Contain Affiliate Links read more