Loading

Real World WebSockets

Guy Ellis

This is a live streamed presentation. You will automatically follow the presenter and see the slide they're currently on.

Real World
WebSockets

x.co/realws

Guy Ellis / @wildfiction

Justin Dragos / @EllisandePoet

Follow this presentation...

(in Chrome browser if you can)

Who is Guy Ellis?

  • Writing code for decades
  • Currently focusing on Node.js/JavaScript development
  • Gun for hire
  • Twitter @wildfiction

Justin Dragos

  • Coding for ~10 years
  • Java / Node Developer
  • Lead Developer at State Farm
  • Twitter @EllisandePoet

Agenda

  • Guy - real app and some code
  • Justin - demo and code
  • Questions or more examples

WebSockets

Let's try it out with linksilk.com

Working Internet

Go to x.co/lsdemo

(with Chrome if possible)

Open Chrome Dev Tools

 

Refresh

 

Find WS

 

Also on Console

Add group to a page

Add link to a group

Edit a group's name

Edit where a link points to

We're done with the demo

Non-Working Internet

The code

Frameworks:

The Client

  var upsertBucket = function (pageId, bucket) {
    var data = {
      pageId: pageId.toString(),
      type: 'upsertBucket',
      data: bucket
    };
    socket.emit('silkData', data);
  };

1st update server with a POST

 

then WS:

The Server

    socket.on('silkData', function (data) {
      socket.broadcast.to(data.pageId).emit('silkData', data);
    });

AngularJS Clients

Reverse Proxy

 

How is slides.com keeping this synchronized?

And now for Justin...

Booking Example

  • Sockets & Angular
  • Use Sockets for Real-Time Analytics
  • Turn Real-Time Analytics into Real-Time cash

 

http://github.com/ellisande/super-booking

Web Sockets Tutorial

  • Angular
  • Socket.io
  • Multiplayer Tic-Tac-Toe Game

 

http://github.com/ellisande/tic-tac-toe

Questions?

  • Want to work with Guy? Hire him...
  • Want to work with Justin?
    • Visit the State Farm booth in the cafeteria!

 

References

 

Contact