image
Introduction to Express - Nodemon and Node Watch
Introduction to Express - Nodemon and Node Watch
Difficulty
Beginner
Duration
7m
Students
12
Ratings
5/5
Description

In this course, you will learn how to use Nodemon and Node Watch to monitor coding changes in your Express application. One of the drawbacks to Express development is that any time code changes are made, the Express server needs to be restarted. Nodemon and Node Watch alleviate this problem by monitoring code changes and restarting the Express server when necessary.

Learning Objectives

  • Install Nodemon as a global package
  • Implement a node script to run a development server using Nodemon
  • Install Nodemon as a development dependency
  • Understand the difference between global and development packages
  • Learn what NPX is
  • Implement a node script to run Nodemon using npx
  • Learn about the experimental Node Watch feature
  • Implement a node script to run node–watch

Intended Audience

  • This course is intended for anyone who wants to learn about Express

Prerequisites

Transcript

Introduction to Express - Nodemon and Node Watch. In this video, I'm going to introduce a time saving option when working with NodeJs. Currently on the screen, I have a Node Express API running with an existing GET route. On the right side of the screen, I have Insomnia open with the current route URL in the address bar. I will hit 'Send' and there is a JSON response on the bottom right demonstrating that this route works as expected. Now I'm going to create another route. I will begin by copying and pasting the existing route and I'm going to modify the copy by adding a endpoint of for/users. To ensure that this route is unique versus the existing API route, I want to change the JSON response from data to users data. Now in order to test this route on the right side of the screen, I'm going to add the for/users endpoint and I will hit 'Send', and now there's an error message, cannot get API for/users. 

And here's the issue when working with an Express application where the server is currently running. In order for the changes to be reflected, I need to restart the server. So, in the terminal, I will hit 'Ctrl+C' to stop the server and then rerun the node server.js command to restart the Express server. Now over to the right, I will hit 'Send' again and that error has been replaced with a JSON response user's data. So, this leads to a problem. In order to test every change made in this application, I will have to constantly stop and restart the server. This is where an npm package known as nodemon can help. To demonstrate this, I will stop the server and I will install this package by typing npm install -g nodemon and hit 'Enter'. 

The -g stands for global. When installing an npm package globally, the node modules will be installed in the same location as the node bin executable file. This will also create a symbolic link allowing you to execute this package if the package supports a mode of execution. Now I'm going to create a development script in order to execute nodemon. Opening up the package JSON file under scripts, I'm going to replace the test with dev. I'm also going to replace the default script with nodemon server.js. With this, I've created the development script to run the Express server using nodemon. I'm going to clear out the terminal and type npm run dev. So, when creating the script, npm run plus the script name will execute the sign script, in this case, dev. And now in the terminal, there's a few messages. This includes the path of where nodemon is running and the file extension's nodemon is monitoring. So, what happens if I make a change to the server.js file?

I'm going to change the endpoint of users to user. A minor change in spelling but enough to trigger nodemon. In the terminal, there's now a message restarting server.js due to changes. Over to the right, I'm going to change the endpoint from users to user and hit 'Send', and the user's data API message does appear at the bottom of Insomnia, and that's the benefit of nodemon as it will restart the server for you whenever any code changes have been made. Now there is one hypothetical that I will discuss because sometimes installing nodemon globally is not an option, your environment may not allow you to do so for whatever the reason. As a solution, nodemon and other npm packages, when needed, can be set as a development dependency. I'm going to stop the server and clear the terminal, and I will type npm install -D nodemon. The D denotes that the npm package should be installed as a dev dependency. 

Packages flagged as dev dependencies are packages that help with the development of an Express application but are not used as part of the distribution process for production. Other examples of dev packages can be such as test frameworks or mock data for testing. Because I've installed this package as a dev dependency, I need to change my dev script. When an npm package is installed as a dev package, there isn't a symbolically created to its executable. In order to execute nodemon in this situation, I need to use the npx command. Going back to the package JSON file, I will insert npx before the nodemon command inside of the dev script. npx is a package runner that will execute the package from the local directory. If the package is not installed locally or globally, it will download and execute the package. Due to this option, sometimes it is better to install the package first before using npx to avoid unintended consequences such as breaking changes due to using the latest version of a node package. 

In the terminal, I will execute npm run dev and nodemon is working just like before. Now I want to discuss something new and experimental. As of node version 18.11.0 LTS, a new watch feature has been implemented. I will stop the server, and in the package JSON file, I will change npx nodemon to node--watch. I will run the server again and there's a warning that this feature is experimental and that it may change. And to demonstrate that this works similarly to nodemon, I'm going to go back to the server.js file. Inside of the user route, I will change the JSON response from users data to user data to create a slight differentiation. In the terminal, there is a message that the server is restarting. To test this out on the right side, I will hit 'Send', and JSON response does say, user data, so this works. And that's it, thanks for watching at Cloud Academy.

 

About the Author
Students
7015
Labs
24
Courses
73
Learning Paths
31

Farish has worked in the EdTech industry for over six years. He is passionate about teaching valuable coding skills to help individuals and enterprises succeed.

Previously, Farish worked at 2U Inc in two concurrent roles. Farish worked as an adjunct instructor for 2U’s full-stack boot camps at UCLA and UCR. Farish also worked as a curriculum engineer for multiple full-stack boot camp programs. As a curriculum engineer, Farish’s role was to create activities, projects, and lesson plans taught in the boot camps used by over 50 University partners. Along with these duties, Farish also created nearly 80 videos for the full-stack blended online program.

Before 2U, Farish worked at Codecademy for over four years, both as a content creator and part of the curriculum experience team.

Farish is an avid powerlifter, sushi lover, and occasional Funko collector.