Create a directory and run the following command.
npm init For this tutorial, I will be adding an index.js file to the src folder, and this will be our entry point.
Our file directory should look like this.
your-project-folder/
|--src/
|--index.js
|--package.json
Nodemon is a tool that helps develop Js/Nodejs based applications by automatically restarting the node application when file changes detected.
npm install nodemon --save-devBabel is a tool that is used to convert ECMAScript 2015+ code into a backward compatible version of JavaScript so that older browsers and environment will be able to understand your code.
Run the following command to install babel:
npm install @babel/core @babel/cli @babel/preset-env @babel/node @babel/runtime @babel/plugin-transform-runtime --save-devNext, we need to tell babel how to transpile our files by creating a .babelrc file in the root directory
and adding the following code to it.
{
"presets": [
"@babel/preset-env"
],
"plugins": [
"@babel/plugin-transform-runtime"
]
}If you want to set up a custom alias for directories, specific files, or even other npm modules. Let's take a look to this handy plugin
These tools will be identifying, reporting and formatting on patterns found in ECMAScript/JavaScript code, with the goal of making the code more consistent and avoiding bugs.
Run the following command to install:
npm install eslint eslint-config-airbnb-base eslint-config-prettier eslint-plugin-import eslint-plugin-prettier prettier --save-devCreate the file named .prettierrc in the root directory and adding the following code to it.
{
"trailingComma": "all",
"tabWidth": 2,
"semi": false,
"singleQuote": true
}If you'd like a JSON schema to validate your configuration, one is available here: http://json.schemastore.org/prettierrc.
Create the file named .eslintrc.json in the root directory and add the following code to it.
{
"extends": ["airbnb-base", "plugin:prettier/recommended"],
"plugins": ["prettier"],
"rules": {
"prettier/prettier": "error"
}
}Create a file called .eslintignore with this content.
/node_modules/**
/buildOpen up package.json then add the following code to the scripts section
{
...
"scripts": {
"build": "babel ./src --out-dir ./build",
"start": "node ./build/index.js",
"dev": "nodemon --exec npx babel-node src/index.js",
"lint": "eslint ."
},
...
}To use Git version control first create a .gitignore file in the root directory with the next command
npx gitignore nodeThen setup Git in the project.
git init
git add .
git commit -m "Initial Commit"Install Prettier and ESLint extensions
Configure VS Code
{
..
"editor.formatOnSave": true,
..
}