In order to understand how Socket.IO pushes data to the client, we will create an application that emits a static object. Although this exercise may seem contrived, the only difference between static data and dynamic data is that static data only needs to be emitted once, whereas dynamic data needs to be emitted on each mutation. The client side doesn't concern itself with the frequency of state changes, so the difference between emitting data once and emitting data frequently is inconsequential. If we can rerender the state of a dashboard once, we can rerender it a million times.
Once we've completed this recipe, our dashboard will look similar to the following screenshot:
In addition to Socket.IO and Node, we will use Express for this exercise. Make sure that you have installed Express by running npm install express socket.io on your terminal.