A Step-by-Step Tutorial of Building a Simple Peer-to-Peer WebSocket Application
This tutorial series walks you through the simple steps of building an HTML5 WebSocket app, demonstrating the power of the publish/subscribe development pattern directly in JavaScript. Our sample is almost as simple as a Chat app, the “Hello World” app of the WebSocket world, but is a tad more visual and dynamic.
See it for yourself
About the tutorial
The tutorial consists of 7 parts:
- Part 1: Review of the completed application
- Part 2: Review of the starting code
- Part 3: Establishing the WebSocket connection
- Part 4: Sending and receiving messages
- Part 5: Ignoring messages originating from the same client
- Part 6: Adding an image that resizes in remote browsers
- Part 7: Handling accumulating messages
About the tutorial environment
This tutorial requires a WebSocket server. We will use http://tutorial.kaazing.com, which hosts the JMS Edition of Kaazing WebSocket Gateway, Kaazing’s high-performance enterprise-grade WebSocket Server. All you’ll need to do is create a WebSocket connection to this server directly from your browser and start “talking” (read: send messages) to it from your browser. On the client side, you can use any modern browser, supported by JSFiddle (learn more about JSFiddle).
For editing the code, the tutorial uses JSFiddle, hosting the "before" and "after" state for every task you're performing.