WebSockets Introduction | Mastering the WebSocket Protocol: Build Real-Time Web Applications

Book Overview & Buying
Table Of Contents

Mastering the WebSocket Protocol: Build Real-Time Web Applications

By : SkillZone

4 (2)

Buy this Video

Mastering the WebSocket Protocol: Build Real-Time Web Applications

4 (2)

By: SkillZone

Buy this Video

Overview of this book

Master the art of real-time communication in web development with this comprehensive WebSockets course. Start with the essentials of HTTP, TCP/IP, and persistent connections to build a solid foundation, then dive into the mechanics of WebSockets. Learn about use cases, the handshake process, and the WebSocket API. Use tools like Wireshark to explore networking layers and understand how WebSockets optimize client-server data exchange. Through hands-on projects, develop practical skills in setting up and managing WebSocket connections, handling messages, and using event-driven APIs. Delve into advanced topics like WebSocket data frames, binary data, and security measures. Explore alternatives like AJAX, polling, and Server-Sent Events to make informed decisions for your projects and learn best practices for scaling WebSocket applications and managing CORS. By the end of the course, you’ll have the knowledge and skills to create efficient, interactive, and scalable web applications using WebSockets, positioning yourself as a leader in real-time web communication.

WebSockets Introduction

Section intro

What is the "internet"

What is the HTTP protocol

Using Wireshark to prove TCP is persistent

AJAX and Comet

WebSockets Introduction

WebSocket history and specifications

RFCs - did you know?

WebSockets - use cases

WebSockets are a communications protocol

Examining the HTTP protocol using (1) Dev Console and (2) CURL

Introduction to WebSockets, TCP, and IP

MTU and Maximum Segment Size

Summary of TCP and IP

WebSocket Networking

TCP handshake introduction

Examining the TCP handshake in Wireshark

The TCP/IP model (4 layer model)

Layer 1: Application Layer

Layer 2: Transport Layer: Ports

Example: creating a custom port number to establish a connection

Layer 2: Transport Layer: Segments and Headers

Layer 3: Internet Layer

Layer 4: Network Layer & MAC addresses

Using Tracert to analyze hops, and Network layer summary

Summary - WebSockets and the Network Layers

Sockets vs WebSockets

Opening A WebSocket Connection

Section Intro

Opening a WebSocket connection

The HTTP handshake process

The WebSocket API in the Dev Console and the TCP handshake

WebSocket is an event-driven API

End-to-end vs hop-by-hop HTTP headers

The Upgrade and Connection headers explained

Sec-WebSocket-* Headers Introduction**

Sec-WebSocket-Key Header

Manually calculating Sec-WebSocket-Key

Final words on Sec-WebSocket-Key

Base64 Encoding - intro

Base64 Encoding - Summary and Example

Fun Example: How to encode the rocket emoji?

Sec-WebSocket-Accept

Sec-WebSocket-Protocol

Sec-WebSocket-Version & Sec-WebSocket-Extensions

Section Summary & Outro

Using the WebSocket API

Section Intro

The client WebSocket object - opening a WebSocket connection

Project introduction and overview

WebSocket Demo - building the HTML

WebSocket Demo - building the CSS

WebSocket Server Code - Part 1 - Creating the HTTP server

WebSocket Server Code - Part 2 - Importing the "websocket" module using NPM

WebSocket Server Code - Part 3 - Spinning up our WebSocket server

Project: The WebSocket API - Establishing a WebSocket connection

WebSockets are HTTP compatible

Example: a server can run multiple socket connections simultaneously

WebSocket API - binaryType and bufferedAmount

WebSocket API - extensions and protocols

Introduction to the readyState property

Project code - disable button when clicked, and add dynamic status update

Project: listen for the OPEN EVENT

Using the onopen event to change text dynamically

WebSocket Messages and Data - Introduction

Project: listening for the MESSAGE EVENT

Styling our table element

Project: listening for the CLOSE EVENT

Project: listening for the ERROR EVENT

Closure codes and the wasClean property

Examining all 4 values of the readyState property

WebSocket API Methods - send() and close()

The CloseEvent and MessageEvent interface

Project: using the send() method to send data to the server

Closing a connection

Project: using the close() method to close the WebSocket connection

The "reason" argument to the close() method

Examining the closing handshake at the TCP & WebSocket level

Challenge: I want you to improve project code

Solution: amending our project code to handle different closure types

Using the switch expression to improve our code

Fun lecture - examining Live Server WebSocket code

WebSocket Data Frames

Section intro

How HTTP/1.1 handles data

How HTTP/2 handles data

Capturing SSL/TLS keys and configuring Wireshark to capture HTTP/2 traffic

HTTP/2 Binary Frames - Intro to how the HTTP/2 protocol is negotiated

HTTP/2 Binary Frames - Intro to HPACK

HTTP/2 Binary Frames - What a "FRAME" looks like

WebSocket frames - the 6 types

Examining a WebSocket closure frame - opcode 0x8

Examining a WebSocket ping frame - opcode 0x9

WebSocket frame header size - min and max

WebSocket data fragmentation

What are WebSocket Reserved Bits used for

Control and non-control frames

Masking Bit

Masking - introduction

Example of cache poisoning

Payload length bits

Maximum size of a WebSocket frame payload

HTTP vs WebSockets

Outro

AJAX, Polling, Server-Sent Events, and CORS

Misconceptions about concurrent WebSocket connections

Short Polling - an alternative to WebSockets

Long Polling - an alternative to WebSockets

Server-Sent Events - an alternative to WebSockets

WebSockets over HTTP/2

Does HTTP/2 replace WebSockets?

WebSockets over HTTP/3

CORS and WebSockets

Scaling WebSockets

Outro

Mastering the WebSocket Protocol: Build Real-Time Web Applications

By : SkillZone

Mastering the WebSocket Protocol: Build Real-Time Web Applications

By: SkillZone

Overview of this book

Confirmation

Buy this book with your credits?

Submit Your Feedback

Create a Free Account To Continue Reading

Sign in to activate your 7-day free access