I've seen a lot of examples on how to implement socket.io, but none that I can find that maintain the structure of the electron app in the process (typically it's just using express instead). I was wondering how I could implement socket.io with a basic electron app? Here's my boiler plate code:

Client.js file:

const socket = io("http://localhost:3000");

// When client successfully connects to server
socket.on("connect", () => {
  console.log(`Connected to server`);
});

// Receive message from backend
socket.on("message", data => {
  console.log(`Server: ${data}`);
});

I'd like to receive the above socket.on actions in my electron code if possible (while keeping things inside the app as opposed removing the app code and doing this by opening the browser)

Electron.js boilerplate:

const { app, BrowserWindow } = require('electron');
const path = require('path');

// Handle creating/removing shortcuts on Windows when installing/uninstalling.
if (require('electron-squirrel-startup')) {
  // eslint-disable-line global-require
  app.quit();
}

const createWindow = () => {
  // Create the browser window.
  const mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
  });

  // and load the index.html of the app.
  mainWindow.loadFile(path.join(__dirname, 'index.html'));

  // Open the DevTools.
  mainWindow.webContents.openDevTools();
};

// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.on('ready', createWindow);

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit();
  }
});

app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow();
  }
});

Any help is appreciated!