Now we're basically done with this introduction to express
though, of course, there's way more to learn.
But before we learn more, let's fix one annoyance,
let's make our life as developer a little bit easier.
Remember that we always had to quit a running server
and then restart a new server by repeating
that node app.js command whenever we made
and saved changes in our file, over time this,
can get annoying because if you are developing and you're
making changes all the time to try out new things,
then it can be really cumbersome and well simply annoying to
stop and restart all the time.
And at some point you will forget it and you will wonder why
your website doesn't behave the way you expect it to,
hence manually restarting all the time is something we wanna
avoid here, and thankfully we can avoid it.
We can install an extra package into this project,
which we won't use in our code.
So which doesn't add anything that we need
in our actual website code, but which will allow us
to run this server in a more convenient way
by automatically watching our code files and
restarting the server for us when our code changed.
And for that, we'll again use this NPM install command
here to install a new package and the package
which we do want to install now
is nodemon written like this. If you search for nodemon
you should find its entry on npmjs.com and
just as before for express, you can learn more about
the package there. And in the end,
this is a package, which as I mentioned,
does not offer any functionalities that we use
in our code, but instead it is a package
that will help us during development.
And that is something important to recognize and understand.
In web development and especially also
in node.js development, you very often installed packages
that help you as a developer during development,
just as we're using an IDE with certain extensions,
to have an easier time, we can install our packages,
our tools into our project that offer more support,
and nodemon is one such package, which we can use
and install. Now there's one tiny addition we wanna make on
this NPM install commando, we don't wanna
execute it like this,
but instead you should add dash dash save dash dev after
the nodemon name and after a blank.
This marks this package as a so-called development
dependency, telling note.js that it's not actually
a dependency, a package that we use for our final code,
but a package that we only use during development.
If you now it entered, this package gets downloaded
and installed just as express.JS did.
And hence, you'll see it in the node modules folder.
If we scroll down to N we'll find nodemon there,
and of course we'll also see it in package.json though,
there it's listed under this Devdependencies node,
because it is, as I just mentioned a package,
which we only use during development.
Now, how do we use tho?
Well, with the nodemon installed,
we can basically execute app.js with nodemon instead
of node. And that will then start this server
as it did before. But in addition, it will also watch
this code file and any other code files we might eventually
have in this project and then restart our
server whenever we make changes to our code files,
so to our JavaScript files specifically,
and we save those changes.
Now you could think that you there for now simply need
to run nodemon app.js, but that won't work.
If you try to execute that you get:
command: not found nodemon. The reason for this is
that nodemon was only installed as
a package into this project, not as
a globally available tool on our overall machine.
Node and NPM are such globally available tools because we
installed node.js through an installer on our system.
nodemon is not globally available, but we can still use it,
for this we go back to package.json
and here to these scripts part.
Scripts are a feature that we can use in any note.js
project to automate certain tasks.
And we can add a new script here by adding a comma after
this first script, this test script,
which we can also delete actually,
if we want to, so that we have no script.
And then between double quotes,
we choose any script name of our choice,
though there are a couple of special names that you can use.
For example, the start script name,
which is the name we should use here.
Then we add a colon and then between double quotes,
the command that should be executed by that script.
Now you can write really advanced scripts here,
but that's not the goal right now. Instead here,
we can now write nodemon app.js,
because we will soon execute this script with help of NPM.
And it will then have access to any project specific tools,
which are not accessible in the standard command line to us
and then for nodemon, since we installed it here,
will be available in such a script.
And we can then execute the app.js file
with nodemon like that.
How can we now execute that script?
Well, you need to save package.json,
and then you can open your standard command line.
So it is integrated terminal in the visual studio code
and just run NPM start.
because we set this start script here.
If you use the different name,
it will not be NPM and then your name,
but NPM run and then your script name.
So then you need that run command in addition.
For a start that's not needed because start is a
reserved script name, a special kind of script,
which you can trigger by just running NPM start,
which is basically a short form for NPM run start.
You could say.
So if you're now hit run, NPM start,
you see nodemon executes and we get some log output there.
And now we got our running server again,
but powered by nodemon, which under
the hood still uses node.js, but which will stop
and restart our server whenever one
of our code faults changed.
So if I now go back to local host 3000,
we see that page here.
And if I then for example, go to app.js
and I shrink that a little bit, but I keep it running.
And here on this form, I maybe say
your name colon and a white space.
So I changed his text and therefore
the content of this script file.
Watch what happens down there if I now save that file,
you see it says restarting due to changes.
And now if I reload here in the browser, I see those changes
and we didn't have to restart this manually.
And that's a little extra convenience,
which we definitely wanna use.
And therefore I will actually now stick to nodemon.
And from now on also in the next core sections,
we will be using this nodemon extension with such a script
to start our server during development,
because that will make our life a bit easier.