Building the frontend

Let's write the frontend code for the users and administrators. socket.io client instances of users will listen to incoming messages from the server and display them. Whereas, socket.io client instances of administrator will send messages to the server so that the messages can be broadcasted to the users.

The following is the socket.io client code for the users. Place this code inside the index.js file:

var socket = io("http://localhost:8080", {path: "/socket-io"}); socket.on("connect", function () { socket.on("message", function (msg) { document.getElementById("messages").innerHTML = "<li><div><h4>" + msg.team1_name + "(" + msg.team1_goals + ") : " + msg.team2_name + "(" + msg.team2_goals + ")" + "</h4><p>" + msg.desc + "</p></div></li>" ...

Get JavaScript: Moving to ES2015 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.