And here you can directly access the getting started screen cast, featured in the webinar.

With the updated Chrome Dev Tools,  you can now see the WebSocket traffic coming and going to and from your browser without using tools like Wireshark. Here are the simple steps to make the invisible visible:

1. At the time of writing this post (May 8, 2012), you need to get Chrome Canary or a fresh Chromium build.
2. Navigate to the Echo demo, hosted on the websocket.org site.
3. Turn on the Chrome Developer Tools.
4. Click Network, and to filter the traffic shown by the Dev Tools, click WebSockets (all the way on the bottom).
5. In the Echo demo, click Connect.

6. Click www.websocket.org on the left, representing the WebSocket connection.
7. Make sure you’re on the Headers tab. This tab shows the WebSocket handshake.

Request URL:ws://echo.websocket.org/?encoding=text
Request Method:GET
Status Code: 101 Web Socket Protocol Handshake

Request Headers

Connection:Upgrade
Cookie:__utma=9925811.1340073179.1336513627.1336513627.1336513627.1; __utmb=9925811.4.10.1336513627; __utmc=9925811; __utmz=9925811.1336513627.1.1.utmcsr=websocket.org|utmccn=(referral)|utmcmd=referral|utmcct=/
Host:echo.websocket.org
Origin:http://www.websocket.org
Sec-WebSocket-Extensions:x-webkit-deflate-frame
Sec-WebSocket-Key:DIbT9axdUEPm89HWFqMAZA==
Sec-WebSocket-Version:13
Upgrade:websocket
(Key3):00:00:00:00:00:00:00:00
Query String Parameters view URL encoded
encoding:text

Response Headers

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:content-type
Access-Control-Allow-Origin:http://www.websocket.org
Connection:Upgrade
Date:Tue, 08 May 2012 22:14:46 GMT
Sec-WebSocket-Accept:rKTyKcnJ105fv4ebnspiYbCB9ns=
Server:Kaazing Gateway
Upgrade:WebSocket
(Challenge Response):00:00:00:00:00:00:00:00:00:00:00:00:00:00:00:00

8. Click the Send button in the Echo demo.

9. THIS STEP IS IMPORTANT: To see the WebSocket frames in the Chrome Developer Tools, under Name/Path, click the echo.websocket.org entry, representing your WebSocket connection. This refreshes the main panel on the right and makes the WebSocket Frames tab show up with the actual WebSocket message content.
Note: Every time you send or receive new messages, you have to refresh the main panel by clicking on the echo.websocket.org entry on the left.

The little arrow indicates the direction of the message, after the timestamp, op code, and mask you see the length and contents of the WebSocket message.

To learn more, visit kaazing.com/cloud.

Presso serves as a prime example for the types of apps you can build using real-time Web technologies. Peter’s presentation could be followed along by the audience on their tablets and laptops. As Peter was advancing the slides, attendees saw the same animation on their screens. Presso also features a remote control, allowing the presenter to walk around in the room use a smart phone to advance the slides.

The demo uses the JMS Edition of the Kaazing WebSocket Gateway under the covers, making it very straight-forward to build peer-to-peer applications. Every time there’s a navigation command on the presenter’s machine, a message is sent to the viewers that in turn perform the same navigation: next or previous.

The presenter can advance the slides either directly through the keyboard or the remote controller (typically a smart phone).

The transition and page layout is managed by the excellent impress.js library, inspired by Prezi. This drawing describes the high-level topology. Red lines indicate messages sent and received to and from the WebSocket gateway.

And here’s a digest of the keynote from Presso’s perspective. The screen in the background shows the presenter’s laptop projected in the room. The brighter screen in the foreground is a tablet in the audience, following the presentation.

If you’re interested to learn about Web communication technology, you should watch Peter’s keynote presentation.

Here are some of the highlights of the new site:

• Kaazing in the Cloud: Getting started with Kaazing in the Cloud is easy as 1-2-3: Create an Amazon EC2 account, Register with the Kaazing AMI(s), Launch Kaazing.
• Security overview: Kaazing takes security very seriously – this article covers security at great detail.
• Cloud pricing comparison: See how much it costs to use Kaazing and how it compares to other solutions.
• HTML5 Training: Kaazing’s trainers are respected industry experts and published authors.

Peter explores what some of the major new feature areas are when it comes to HTML5 connectivity and real time and how those are changing how you will build modern web apps.

In his session Peter showcased a WebSocket enabled real-time HTML5 presentation tool, Presso, that allows the audience to follow along on their laptop and tablet devices. He uses his phone as the remote control, leveraging of course WebSockets.

Marcelo describes the building blocks and the config changes he had to make.

Sample code is coming soon too.

The Quick Start Guide walks you through the simple steps of downloading, installing, and starting up the Gateway. It also shows off the demos that ship with the product. All in less than 5 minutes.

Using the JMS Edition? Check out the Quick Start Guide for the JMS Edition.

Questions not answered during the Q&A session will be posted here shortly…

The webinar will also feature an application used to publish real time updates for ultramarathon running events (races longer than a marathon).