We will add the Socket.IO server to the API that we have been building in the last few sections, and then add the Socket.IO client to the Nuxt app eventually. But before adding it to the Nuxt app, we will add it to a simple HTML page so that we have a bird's-eye view of how the Socket.IO server and Socket.IO client work together. Let's learn how to do so:
- Install the Socket.IO server via npm:
$ npm i socket.io
- Create an index.js file in the /configs/ directory to store the server setting if you haven't done so yet:
// configs/index.js
export default {
server: {
port: 4000
},
}
From this simple setting, we will be serving our API at port 4000.
- Import socket.io and bind it to the Node.js HTTP object with the new instance of Koa to create a new instance of Socket.IO, as follows:
// backend/koa/public/index.js
import Koa from 'koa'
import socket from 'socket.io'
import http from 'http'
import...