David Heinemeier Hansson recorded a screencast building a chat with Action Cable in Rails 5. Here we have a summary:

gem install rails -v 5.0.0.beta1

rails new chat --skip-spring

cd chat

rails g controller rooms show

rails g model message content:text

rails db:migrate

# app/controllers/rooms_controller.rb

class RoomsController < ApplicationController
  def show
    @messages = Message.all
  end
end

# app/views/rooms/show.html.erb

<h1>Chat room</h1>
<div id="messages">
  </div>

  Say something:

# app/view/messages/_message.html.erb

mkdir app/views/messages

<div class="“message”">



</div>

rails g channel room speak

# app/channels/room_channel.rb

class RoomChannel  '/cable'

And on app/assets/javascripts/cable.coffee we add:

@App ||= {}
App.cable = ActionCable.createConsumer()

# app/assets/javascripts/channels/room.coffee

App.room = App.cable.subscriptions.create "RoomChannel",
  connected: ->
    # Called when the subscription is ready for use on the server

  disconnected: ->
    # Called when the subscription has been terminated by the server

  received: (data) ->
    $('#messages').append data['message']
    # Called when there's incoming data on the websocket for this channel

  speak: (message) ->
    @perform 'speak', message: message

$(document).on 'keypress', '[data-behavior~=room_speaker]', (event) ->
  if event.keyCode is 13 # return = send
    App.room.speak event.target.value
    event.target.value = ""
    event.preventDefault()

# app/models/message.rb

class Message < ApplicationRecord
  after_create_commit { MessageBroadcastJob.perform_later self }
end

And finally we create app/jobs/message_broadcast_job.rb:

rails g job MessageBroadcast

class MessageBroadcastJob < ApplicationJob
  queue_as :default

  def perform(message)
    ActionCable.server.broadcast 'room_channel', message: render_message(message)
  end

  private
    def render_message(message)
      ApplicationController.renderer.render(partial: 'messages/message', locals: { message: message })
    end
end

The code is on GitHub: https://github.com/HectorPerez/chat-in-rails5

And the video of DHH:

Categories: Ruby on Rails & other tech