ActionCable is one of the awesome features that comes with Rails 5 and allows you to build all the real-time features you can think of via web sockets. A chat app is the perfect example to demonstrate the use of ActionCable in praxis! Let me walk you through a five-part tutorial series of a simple chat app that will support:

  • User authentication
  • Multiple rooms
  • Multiple users per room and
  • Real time chat between users

If you want to have a look at the finished product you can check it out here .

Please note that at the beginning & end of each part, there will be 2 links – a link to a demo of the current working version and a link to the respective Github branch.

This five-part tutorial series will guide you through the steps of setting up the baseline app and defining the database structure first, before jumping into the action cable part. At the end of the first 4 Parts you will actually have a working chat app with authenticated users, chatrooms and messages, and in Part 5 we are going to make this chat realtime!

Part 1: Init Rails App and Database structure

Part 2: Users Authentication with Devise

Part 3Rooms & Memberships

Part 4: Messages

Part 5: ActionCable & ActiveJob

Init Rails app

Alright, let’s get started! Open your terminal and use the rails generator:

rails new chat-app

This will create a new chat-app folder in your current directory and will initialise the new Rails chat-app for you. Next step is to move inside the chat-app folder and install the gem dependencies that are mentioned in your Gemfile:

cd chat-app
bundle install

If you are curious to see what we have done so far, just run your server rails s and open http://localhost:3000/in your browser. You will get the new Rails 5 landing page.

 

Database structure

I know we have nothing fancy so far, but things will start getting more interesting soon, I promise. Let’s review one more time the requirements for this simple chat app:

  • Multiple users
  • Multiple rooms
  • Multiple users per room
  • Multiple rooms per user
  • Multiple messages per room
  • Multiple messages per user

Taking into consideration above, we end up with 4 database tables – users, rooms, memberships & messages. The memberships table has a many-to-many relationship between rooms and users, since a user can belong to many rooms and a room can have many users. The messages table has a one-to-one relationship with both user and room tables, since a specific message can belong to only one user and only one room. Let’s go ahead and generate our models.

rails g model User first_name last_name
rails g model Room topic
rails g model Membership user:references room:references
rails g model Message content:text user:references room:references

After running above 4 commands, you will end up having 4 new model files and 4 new database migration files. Just run following command and all database tables will be automatically generated:

rails db:migrate

When working with databases, you should be familiar with rails console and ActiveRecord, in order to be able to directly interact with your database and do all kind of CRUD operations (create, retrieve, update, delete). Since this goes beyond the scope of this tutorial, I recommend you to download DB Browser for SQLite, a GUI database tool that allows you to do same operations you would do with rails console. We’ll come back to this tool at a later point, so for now a simple installation is all you need to do.

Only thing left to complete Part 1 is to add some associations to the models we just generated. Let’s go ahead!

Update User model app/models/user.rb

class User < ApplicationRecord
    has_many :memberships
    has_many :messages 
    has_many :rooms, through: :memberships
end

Continue with the Room model app/models/room.rb

class Room < ApplicationRecord 
    has_many :memberships 
    has_many :messages 
    has_many :users, through: :memberships 
end

Go ahead with Membership model app/models/membership.rb

class Membership < ApplicationRecord
    belongs_to :user
    belongs_to :room
end

Update Message model app/models/message.rb and we are finally done!

class Message < ApplicationRecord
    belongs_to :user
    belongs_to :room
end

Alright! We made it through, currently we have a basic Rails app with 4 databases tables and the associations between them. If you don’t feel comfortable enough with Rails associations, you can have a look at the official documentation. Otherwise move on with Part 2: Users Authentication with Devise!