Establish a Client Connection

Our goal in this section is to write client code that can invoke the join/3 function we now have on the server. There are a few steps we’ll need to take to make that happen.

We’ll need to define a client socket and use it to establish a connection to the socket on the server. Then we’ll need to define a new channel object on the client, and use it to join the channel on the server.

Phoenix ships with phoenix.js, a JavaScript file that knows all about working with sockets and channels. It’s indispensable for writing JavaScript client code for channels, and our first task is to make it available in the browser’s console window.

Let’s go to player1’s JavaScript console—that’s the browser window on the left—and require ...

Get Functional Web Development with Elixir, OTP, and Phoenix now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.