Now, let's add a new path,
which allows us to output all the users stored
in users.json in a way
that allows the visitors of our page
to see them on this loaded page.
And for this, I'll add a brand new route here
with app, and then it will be a route
that should handle incoming GET requests.
So I'll use the get method here,
and then let's say we wanna handle GET requests sent
to our domain /users.
Though the path, of course, is totally up to you.
Here we then have this handler function
as we did before.
And now in here, I wanna open this file,
read the data and translate it from raw text
into a JavaScript array,
and then send back a response with that data.
Now, of course, for that we can, first of all,
copy some code from there, to be precise, this code
where we build the path, read the file
and parse the data.
And we could outsource this into a separate function,
which we then reuse.
But here that's not the focus
and copying it isn't too bad, so let's do that.
So now we got our stored users here.
Now we can send back a response with that data.
For this, we can use this response object here,
and again use send
and we could now just send back existingUsers like this.
If we try to do this,
and we do stop the existing server and start a new one,
then if we go to localhost:3000/users,
we actually should see our user data like that.
So as a side note here,
you can send just a JavaScript array
and Express will automatically basically translate this
back into some raw text, which it then outputs like that.
So that works.
But I wanna output an actual HTML list
where every username should be a standalone list item.
And for that, I'll add a brand new variable here,
which I'll name responseData,
which is a string that starts with an unordered list tag
that I open up.
So with the opening unordered list tag,
but with no closing unordered list tag.
Now I wanna go through all the existing users
and add list items for every user,
and we could do this with a for of loop.
So with the for keyword,
and then loop through all the users like this.
That's what you learned
in the control structures course section
and it works exactly the same here in NodeJS
because, and I can't emphasize this enough,
NodeJS, in the end, is just regular JavaScript.
So what you learned for regular JavaScript
also regarding loops and if statements also works here.
So with that, we go through all the users
in this existing users array.
And we can now update the response data array
for every user simply by concatenating a string to it
with that += shortcut operator, for example,
which is just a short form
for saying responseData equals responseData +.
We can shorten this to save some space
and write it like this.
And then we add a new string
to this existing string.
At the moment, the existing string
just has the opening unordered list tag.
Now I also want to add a list item
with opening and closing list item tags.
And between those list item tags,
I now wanna have my user data that I got here.
And user will be a single item in this user's array,
hence it will just be a string,
and therefore, I can just put that string
into that longer string between those list items
and it should work just fine.
And once we're done going through all that response data,
we can, of course,
also again concatenate the closing unordered list item
to write semantically correct HTML code.
And now it's this response data,
which we can send back instead of just the existing users.
If you do that and you quit the running server
with Control + C and by then restarting it,
then if you reload here,
you should see a list with those list items.
And whenever I store a new user
by going back to slash
and then adding a new user,
if I thereafter go to /users,
we see that user here as well.
And now even though it's a dummy example,
we can see what NodeJS can do for us
what standard HTML, CSS and JavaScript in the browser can't
because now we are accepting user input
and we are storing that in a file at the moment.
And we are then using that user input
to generate dynamic HTML responses.
The HTML page, which we get here
is not always the same.
Whenever a new user was added, this page changes.
And it changes without any developer being required
to touch an HTML file
and add the new user manually there.
This would not be something you can do
if you're, for example, building an online shop
where products might be changing all the time.
You can't rewrite HTML pages manually.
Now we don't need to do that
because now we wrote some NodeJS code
with help of Express here
that actually reads data stored
in some data source,
in this case, a file,
and then generates dynamical HTML content based on that.
And that now shows us why we use NodeJS,
why we sometimes need a server-side language,
and it also shows us how NodeJS,
especially in conjunction with Express generally works.