Skip to content

Create Socket.IO Boilerplate

Video Lecture

Create Socket.IO Boilerplate Create Socket.IO Boilerplate

Description

Over the next few lessons, we will set up the course boilerplate.

Start by creating a folder on your system named Socket.IO-TypeScript-Boilerplate,

mkdir Socket.IO-TypeScript-Boilerplate

Now change directory into it,

cd Socket.IO-TypeScript-Boilerplate

And open the new folder in VSCode.

code .

Now continue to create the folder structure as shown below,

|-- Socket.IO-TypeScript-Boilerplate
    |-- dist
        |-- client
        |-- server
    |-- src
        |-- client
        |-- server

./package.json

Create a new file in the project root named ./package.json, and copy the code below into it,

1
2
3
4
5
{
  "name": "socket.io-typescript-boilerplate",
  "version": "1.0.0",
  "license": "MIT"
}

./.prettierrc

As an extra optional tool to help us format our code, we can use Prettier in the VSCode IDE.

Add a file named .prettierrc to your project root folder, copy-paste the script below and save.

1
2
3
4
5
6
7
8
9
{
  "printWidth": 90,
  "tabWidth": 2,
  "useTabs": false,
  "semi": false,
  "singleQuote": true,
  "trailingComma": "none",
  "bracketSpacing": true
}

And then in VSCode, open the extensions tab and install the "Prettier - Code formatter".

Now, after typing any code, you can then press the key combination Shift Alt F to neatly reformat the code depending on your prettier settings.