Socket.IO (with websockets) – the details. (socket io v2)

Socket.IO (with websockets) – the details. (socket io v2)

English | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 14 Hours | 6.87 GB

Socket io. For those who want to learn how to harness real-time communication on the web. With Cluster, redis, & React

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)

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
Table of Contents

Introduction
1 Course Overview
2 All my code (github link)

Before Socketio
3 Pre-socketio
4 Housekeeping – How I do nodeexpress
5 TCPUDP and networking 101
6 Networking E – What is a socket and why should I care
7 HTTP vs Websockets
8 A short overview of native websockets (finally some code)

Socket.io 101
9 Intro
10 The basics socket.io vs. ws
11 Why socket.io This is why
12 Small Chat app – in socket.io
13 Docs – The server
14 The big 3 – .emit .on .connect
15 Docs – The Client
16 Finishing the chat app
17 Quick Checklist Review

Socket.io E – Lets make it Slack
18 Namespaces
19 NamespaceGroup Cheatsheet
20 Rooms
21 Going Slack (project) – Overview Steps
22 Folder structure DOM overview
23 Setting up our data and classes
24 Slack Steps 1-3
25 Slack – Steps 4-6
26 Refactoring and Reorganizing our code
27 Slack – Joining a Room- Steps 7-9
28 Slack – Sending the history – Steps 7-9 continued
29 Slack – Linking up NS and Group Final Touches
30 Passing query data on connection
31 Line by line review of the project
32 Docs Checklist Update

Multiplayer Canvas Game – Agar.io clone
33 Project repo
34 Project Intro
35 Project Strategy
36 Socket.io App Organization
37 Getting the DOM setup
38 Time to draw
39 Add Sockets (and orbs)
40 Wiring up the server for collisions
41 Connecting the client and server
42 Tick-Tock – 30FPS
43 Collision Testing (the Math part)
44 Collision Testing (The Socket Part)
45 Collision Testing (The Socket Part 2)
46 Updating the LeaderBoard
47 Disconnecting and broadcasting a message

Advanced Project – Adding React cluster redis – a performance monitor
48 Project Demo
49 Project Setup and dependencies
50 Installing Redis on Windows
51 Architecture
52 Getting performance data
53 Getting performance data – part 2
54 How the cluster module works
55 Using the cluster module – Master
56 Using the cluster module – workers
57 Connecting nodeClient to the socket server
58 Start the ticking clock
59 MongoMongoose Schema and a small fix
60 Adding a record
61 Create React App Overview
62 Connecting React to the socket server for re-useable
63 Basic React Component Architecture
64 Setup React Components
65 Setting our widget state
66 CPU widget canvas
67 Mem and Info widgets
68 Adding isActive disconnect and final touches

Supplemental Videos
69 HTTP 101