Free course

Real-time Web Applications Course

Build reliable live interfaces with polling, server-sent events, WebSockets, snapshots, reconnection, backpressure, and graceful degradation.

5 modules · 25 lessons · No signup

Prerequisites: JavaScript, HTTP and Node.js

~~~

Your progress

of lessons completed.

Course completed.

What you'll learn

Build and operate a live service-status board that remains correct through disconnects, duplicates, restarts, slow clients, and fallback mode.

Course contents

  1. Choose the channel

    Turn “real-time” into requirements and choose polling, SSE, or WebSockets deliberately.

    1. ✓ Define what real-time means
    2. ✓ Start with deliberate polling
    3. ✓ Compare SSE and WebSockets
    4. ✓ Keep HTTP as the foundation
    5. ✓ Check your understanding: choose the channel
  2. Build an SSE stream

    Frame, name, resume, heartbeat, and clean up a one-way event stream.

    1. ✓ Frame an event stream
    2. ✓ Name and version events
    3. ✓ Resume after a disconnect
    4. ✓ Heartbeat and clean up
    5. ✓ Check your understanding: build an sse stream
  3. Build a WebSocket channel

    Handle upgrades, messages, authorization, and bounded flow.

    1. ✓ Follow the WebSocket upgrade
    2. ✓ Design message envelopes
    3. ✓ Authenticate and authorize connections
    4. ✓ Bound the message flow
    5. ✓ Check your understanding: build a websocket channel
  4. Make live state reliable

    Survive ordering, duplicates, gaps, reconnects, restarts, and multiple tabs.

    1. ✓ Handle order and duplicates
    2. ✓ Repair with snapshots
    3. ✓ Reconnect with backoff
    4. ✓ Coordinate browser tabs
    5. ✓ Check your understanding: make live state reliable
  5. Secure, test, and operate

    Threat-model, load-test, observe, and degrade the live feature safely.

    1. ✓ Threat-model the live channel
    2. ✓ Load-test connections and fanout
    3. ✓ Observe the connection lifecycle
    4. ✓ Degrade gracefully and finish the board
    5. ✓ Check your understanding: secure, test, and operate