João Moura  a.k.a D3TR1
João Moura   a.k.a D3TR1      @joaomdmoura    joaomdmoura.comgithub.com/joaomdmoura
WebSocket
WebSocketSocketstream + coffeescript            X    RoR ( Juggernaut )
Oque é socket?
Oque é socket?- Duas vias de comunicação, uma de acesso eoutra de saída
Oque é socket?- Duas vias de comunicação, uma de acesso eoutra de saída
Oque é socket?- Duas vias de comunicação, uma de acesso eoutra de saída- São vias de comunicação constante eineterrupta
websocket?
websocket?É uma tecnologia projetada para browsers quepermite uma conexão bidirecional através de   um protocolo TCP ( Tra...
websocket?É uma tecnologia projetada para browsers quepermite uma conexão bidirecional através de   um protocolo TCP ( Tra...
websocket?É uma tecnologia projetada para browsers quepermite uma conexão bidirecional através de   um protocolo TCP ( Tra...
Fluxo comum
Fluxo comum
Fluxo comum
Fluxo comum
Fluxo comum
Fluxo comum
Fluxo comum
Fluxo comum
Fluxo comum
Fluxo comum
Fluxo comum
Fluxo websocket
Fluxo websocket
Fluxo websocket
Fluxo websocket
Fluxo websocket
Fluxo websocket
Fluxo websocket
Fluxo websocket
Possibilidades
PossibilidadesContribui com o conceito de SPA permitindocriar aplicações ainda mais dinâmicas commelhor desempenho
PossibilidadesContribui com o conceito de SPA permitindocriar aplicações ainda mais dinâmicas commelhor desempenhoExemplos:
PossibilidadesContribui com o conceito de SPA permitindocriar aplicações ainda mais dinâmicas commelhor desempenhoExemplos...
PossibilidadesContribui com o conceito de SPA permitindocriar aplicações ainda mais dinâmicas commelhor desempenhoExemplos...
Frameworks
Frameworks  Ruby on Rails ( RoR )  SocketStream ( SS )
Frameworks                      Ruby on Rails ( RoR )                      SocketStream ( SS )              RoR           ...
RoR
RoR- Scaffold da aplicação- Instalação do Juggernaut ( https://github.com/maccman/juggernaut )    Dependências:    - Redis...
RoR- Scaffold da aplicação- Instalação do Juggernaut ( https://github.com/maccman/juggernaut )    Dependências:    - Redis...
RoR               redis-server                juggernaut         http://localhost:8080<script src="http://localhost:8080/a...
RoR                  JuggernautCLIENT<script type="text/javascript" charset="utf-8">  var jug = new Juggernaut;  jug.subsc...
RoR                  JuggernautSERVERrequire "juggernaut"Juggernaut.publish("SAMPAJS", "Bem Vindos")// OUJuggernaut.publis...
RoR                      Juggernautvar jug = new Juggernaut;jug.on("connect", function(){  alert(“CONECTADO”)});jug.on("di...
RoR                       Juggernautclass PlayersController < ApplicationController  require "juggernaut"  def update_user...
RoR                           Juggernaut/* JUGGERNAUT */"   "    // USER MOVE SERVER"   "    jug.subscribe( "mobe", functi...
RoR                          Juggernautupdate_user : function( player )"" {" " console.log( "update_user" );" " /* Encondi...
SS
SS- Gerar nova aplicação aplicação- Instalação do SS ( https://github.com/socketstream/socketstream )    Dependências:    ...
SS- Gerar nova aplicação aplicação- Instalação do SS ( https://github.com/socketstream/socketstream )    Dependências:    ...
SS    redis-server socketstream starthttp://localhost:3000
SS   Estrutura/app         /lib         /config           /public   /client      /client     app.coffee        /assets    ...
SSCLIENTSS.socket.on disconnect, ->   console.log Server is downSS.socket.on reconnect, ->    console.log Server is upexpo...
SSSERVERexports.actions =" init: (cb) ->" " cb "Socket Connection is Okay!"CLIENT  user   exports.init = ( user, message )...
Return
Return#prontofalei
Return#prontofalei
Return                 #prontofaleiAmbos tem suas vantagens, oque vai orientar sua  decisão são as características do seu ...
Obrigado!  Have a nice day!
Obrigado!      Have a nice day!      @joaomdmoura    joaomdmoura.comgithub.com/joaomdmoura
WebSocket com Node.js ( socketstream && coffeescript ) X RoR ( Juggernaut )
Upcoming SlideShare
Loading in …5
×

WebSocket com Node.js ( socketstream && coffeescript ) X RoR ( Juggernaut )

1,984 views

Published on

0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,984
On SlideShare
0
From Embeds
0
Number of Embeds
63
Actions
Shares
0
Downloads
20
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • WebSocket com Node.js ( socketstream && coffeescript ) X RoR ( Juggernaut )

    1. 1. João Moura a.k.a D3TR1
    2. 2. João Moura a.k.a D3TR1 @joaomdmoura joaomdmoura.comgithub.com/joaomdmoura
    3. 3. WebSocket
    4. 4. WebSocketSocketstream + coffeescript X RoR ( Juggernaut )
    5. 5. Oque é socket?
    6. 6. Oque é socket?- Duas vias de comunicação, uma de acesso eoutra de saída
    7. 7. Oque é socket?- Duas vias de comunicação, uma de acesso eoutra de saída
    8. 8. Oque é socket?- Duas vias de comunicação, uma de acesso eoutra de saída- São vias de comunicação constante eineterrupta
    9. 9. websocket?
    10. 10. websocket?É uma tecnologia projetada para browsers quepermite uma conexão bidirecional através de um protocolo TCP ( Transmition Control Protocol )
    11. 11. websocket?É uma tecnologia projetada para browsers quepermite uma conexão bidirecional através de um protocolo TCP ( Transmition Control Protocol )
    12. 12. websocket?É uma tecnologia projetada para browsers quepermite uma conexão bidirecional através de um protocolo TCP ( Transmition Control Protocol ) WTH?!?!1
    13. 13. Fluxo comum
    14. 14. Fluxo comum
    15. 15. Fluxo comum
    16. 16. Fluxo comum
    17. 17. Fluxo comum
    18. 18. Fluxo comum
    19. 19. Fluxo comum
    20. 20. Fluxo comum
    21. 21. Fluxo comum
    22. 22. Fluxo comum
    23. 23. Fluxo comum
    24. 24. Fluxo websocket
    25. 25. Fluxo websocket
    26. 26. Fluxo websocket
    27. 27. Fluxo websocket
    28. 28. Fluxo websocket
    29. 29. Fluxo websocket
    30. 30. Fluxo websocket
    31. 31. Fluxo websocket
    32. 32. Possibilidades
    33. 33. PossibilidadesContribui com o conceito de SPA permitindocriar aplicações ainda mais dinâmicas commelhor desempenho
    34. 34. PossibilidadesContribui com o conceito de SPA permitindocriar aplicações ainda mais dinâmicas commelhor desempenhoExemplos:
    35. 35. PossibilidadesContribui com o conceito de SPA permitindocriar aplicações ainda mais dinâmicas commelhor desempenhoExemplos:- Aplicações chat- Multiplayer online games- Sites com conteúdo dinâmico
    36. 36. PossibilidadesContribui com o conceito de SPA permitindocriar aplicações ainda mais dinâmicas commelhor desempenhoExemplos:- Aplicações chat- Multiplayer online games- Sites com conteúdo dinâmicohttp://www.toyota.com/itsacar/
    37. 37. Frameworks
    38. 38. Frameworks Ruby on Rails ( RoR ) SocketStream ( SS )
    39. 39. Frameworks Ruby on Rails ( RoR ) SocketStream ( SS ) RoR SS Utilizar a gem Juggernaut (node.js) HTML || Jade Framework mais robusto Javascript || CoffeeScriptCamada a mais de processamento Stylus || Less Versatibilidade de BD Maior velocidade Redis based NoSQL Node.js based Redis based jQuery Templates Shared Code
    40. 40. RoR
    41. 41. RoR- Scaffold da aplicação- Instalação do Juggernaut ( https://github.com/maccman/juggernaut ) Dependências: - Redis ( advanced key-value store. It is often referred to as a data structure server since keyscan contain strings, hashes, lists, sets and sorted sets. ) - Node.js - NPM ( Node Package Manager )
    42. 42. RoR- Scaffold da aplicação- Instalação do Juggernaut ( https://github.com/maccman/juggernaut ) Dependências: - Redis ( advanced key-value store. It is often referred to as a data structure server since keyscan contain strings, hashes, lists, sets and sorted sets. ) - Node.js - NPM ( Node Package Manager ) npm install -g juggernaut gem install juggernaut
    43. 43. RoR redis-server juggernaut http://localhost:8080<script src="http://localhost:8080/application.js" type="text/javascript" charset="utf-8"></script> RAILS S http://localhost:3000
    44. 44. RoR JuggernautCLIENT<script type="text/javascript" charset="utf-8"> var jug = new Juggernaut; jug.subscribe("SAMPAJS", function(data){ console.log("DATA: " + data); });</script>
    45. 45. RoR JuggernautSERVERrequire "juggernaut"Juggernaut.publish("SAMPAJS", "Bem Vindos")// OUJuggernaut.publish("SAMPAJS", {:data => "Bem Vindos"})// OUJuggernaut.publish(["SAMPAJS", "SAMPAJS2"], ["Bem", "Vindos"])
    46. 46. RoR Juggernautvar jug = new Juggernaut;jug.on("connect", function(){ alert(“CONECTADO”)});jug.on("disconnect", function(){ alert(“DESCONECTADO”)});jug.subscribe("SAMPAJS", function(data){ console.log("DATA: " + data);});
    47. 47. RoR Juggernautclass PlayersController < ApplicationController  require "juggernaut"  def update_user     @user = { :class => "user", :method => "update_user",               :data => params[:player] }                Juggernaut.publish( "mobe", @user , :except => params[:juggernaut_id] )        render :text => "User updated"      endend
    48. 48. RoR Juggernaut/* JUGGERNAUT */" " // USER MOVE SERVER" " jug.subscribe( "mobe", function ( data )" " {" " " _class = data [ "class" ];" " " if ( _class == "user" )" "" socket.callback ( user, data )" "});" " // USER CHAT SERVER!" " jug.subscribe( "mobe_chat", function ( data )" " {    "" socket.callback ( chat, data )" "});
    49. 49. RoR Juggernautupdate_user : function( player )"" {" " console.log( "update_user" );" " /* Enconding User JSON to Object */" " player = dojo.fromJson( player );" " var _class = this;" " dojo.forEach( this.players, function( user , i )" " {" " " console.log( "update_user_looping" );" " " if ( user[ "data" ][ "id" ] == player[ "id" ] )" " " {" " " " _class.remove_user( player );" " " " _class.add_user( player );" " " }" " });" }
    50. 50. SS
    51. 51. SS- Gerar nova aplicação aplicação- Instalação do SS ( https://github.com/socketstream/socketstream ) Dependências: - Redis - Node.js - NPM ( Node Package Manager )
    52. 52. SS- Gerar nova aplicação aplicação- Instalação do SS ( https://github.com/socketstream/socketstream ) Dependências: - Redis - Node.js - NPM ( Node Package Manager ) npm -g install socketstream
    53. 53. SS redis-server socketstream starthttp://localhost:3000
    54. 54. SS Estrutura/app /lib /config /public /client /client app.coffee /assets app? /css db.coffee /css /server events.coffee /server http.coffee /shared /views
    55. 55. SSCLIENTSS.socket.on disconnect, -> console.log Server is downSS.socket.on reconnect, -> console.log Server is upexports.init = ->" SS.server.app.init ( response ) ->" " console.log response" "" SS.client.user.init( “SAMPAJS”, “BEM VINDO AO SAMPAJS” )
    56. 56. SSSERVERexports.actions =" init: (cb) ->" " cb "Socket Connection is Okay!"CLIENT user exports.init = ( user, message )-> SS.publish.broadcast SAMPAJS, " " " { " " " " user: user, " " " " message: message " " " } SS.events.on SAMPAJS, ( params ) -> console.log “#{params[“user”]}, #{params[“message”]}”
    57. 57. Return
    58. 58. Return#prontofalei
    59. 59. Return#prontofalei
    60. 60. Return #prontofaleiAmbos tem suas vantagens, oque vai orientar sua decisão são as características do seu projeto
    61. 61. Obrigado! Have a nice day!
    62. 62. Obrigado! Have a nice day! @joaomdmoura joaomdmoura.comgithub.com/joaomdmoura

    ×