Use nodemon to set up automated reloading of your Express app
When you develop any Node application, after you make changes to the source code you need to stop and start the application again to see the changes. Starting, stopping and re-starting you application looks a bit like this:
Start the app in a terminal:
node app.js
make changes in your code editor, save files and go back to a terminal to press Ctr+C
to stop the app, and restart again
node app.js
And so on...
It is fine to do it a couple of time check one or two changes but can drive you mad when you are developing and need to stop and re-start you application several times.
Thankfully, there is a better solution!
Nodemon monitors for any changes in your source code and automatically restarts your application.
You could use nodemon globally and just start your application with the command nodemon app.js
but we recommend a per-project installation.
To demonstrate how to use nodemon, we will use our simplest-express-app as a starting point. We will integrated nodemon tool for monitoring code in development and we will test it to see how it refreshes without manually restarting our app.
First, clone the simple app to play with:
git clone https://github.com/regbrain/simplest-express-app.git
go to the project directory:
cd simplest-express-app
install nodemon:
yarn add nodemon --dev
Now we will leverage the power on npm scripts to set up nodemon as our default way of running your project in development.
Open package.json
and add the following dev
option in scripts
:
"scripts": {
"dev": "nodemon app.js"
},
The full package.json
should like like this:
{
"name": "simplest-express-app",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"dev": "nodemon app.js"
},
"license": "MIT",
"dependencies": {
"express": "^4.17.1"
},
"devDependencies": {
"nodemon": "^2.0.4"
}
}
In your terminal, run your application using dev
script which will start app.js
via nodemon and monitor for code change:
yarn dev
In your browser, go to http://localhost:3000/ and you should see 'Hello world!'.
Now let's check how nodemon restarts our app automatically. Open file app.js
and change the message from 'Hello world!' to 'Hello hot reload!', like this:
let app = require('express')()
app.get('/', (req, res) => res.send('Hello hot reload!'))
app.listen(3000, () => console.log('Listening on port 3000'))
Save the file and go to your browser. Hit F5 to refresh and you should see the message 'Hello hot reload!'.
Now you have your basic development set-up ready and you can continue playing with the code without the need to restart the Node app every time you save the file.
When you work on new projects in the future, make sure to install and configure nodemon when you start so you can have a better development experience. Nodemon should be in your standard toolbox for developing Node applications.
Happy coding!