Integrating the Socket.IO client with React

Let’s start by cleaning up the project and deleting all old files copied over from the blog app. Then, we are going to set up a Socket.IO context to make it easier to initialize and use Socket.IO in React components. Finally, we are going to create our first component that utilizes this context to show the status of our Socket.IO connection.

Cleaning up the project

Let’s first delete the folders and files from the blog application we created earlier:

1. Copy the existing ch13 folder to a new ch14 folder, as follows:

   $ cp -R ch13 ch14

2. Open the ch14 folder in VS Code.
3. Delete the following folders and files, as they were only required for the blog application backend:
   • backend/src/__tests__/
   • backend/src/example.js
   • backend/src/db/models/post.js
   • backend/src/routes/posts.js
   • backend/src/services/posts.js
4. In backend/src/app.js, remove the following import:

   import postRoutes from './routes/posts.js'

5. Also, remove...