All language subtitles for 003 Challenge 1_en

All right.

So at this stage you should have already downloaded the starting project and you would have installed

all of the required NPM modules.

If you haven't, make sure you take a look at the last lesson where we did this so that we're ready to

proceed.

Now once you're done then you're ready to tackle Challenge 1.

So in order to complete challenge 1, you should be able to head over to localhost:3000

and when you hit enter it should render the home page and it will have an h1 but just says Home.

So in your home.ejs you'll need to create an h1 that says Home and by writing some code inside

app.js, you should be able to get this to show up on localhost:3000.

So that's Challenge 1.

Pause the video and see if you can complete the challenge.

All right so if you completed that challenge and you manage get the same result as I showed you when

I introduced the challenge then that means you get a gold star for this challenge.

Then you can skip the rest of this lesson and head over to the next lesson

where I'll show you how I implemented the answer.

Now if you're stuck on this challenge and you don't know how to proceed then after the spoiler alert

there will be a five second countdown.

Now you can either pause during the countdown, try and work out the challenge yourself or you can let

the video play and I'll give you your first hint.

So here comes the countdown.

All right.

So this is Hint number 1.

So the first hint is we know that inside home.

ejs

we've got our h1. And this page is what we need to render from our server.

So the place where we normally write our routes and where we render our EJS pages is between the app

.set app.use and our app.listen.

So we've got a gap right here that's already prepared for you to add your code.

Now if you're remember, we create routes inside our server by saying app.get. And then we specify

what route we want to target and then we add a callback function

so a req and a res. And we open up a set of curly braces and inside the set of curly braces is where

we render our Web page.

So have a think about what you need to put in between these quotation marks in order to render the home

page and then have a think about what you need to write inside here

in order to render our home.ejs.

So pause the video now and use that hint to complete the challenge. Still stuck?

OK.

Here's hint number 2.

In between the quotation marks we need to specify the route that we want to target. And in our case we

need to target the home route or what's known as the root route.

So when we have something like "www.facebook.com/", that is the root route.

So in our case that's just localhost:3000.

So that means inside here, all we have to write is just a single forward slash to specify that we want

to target this route.

Now inside our app.get is where we're going to render our home.

ejs.

And the method for that is res.

So this is the result that we are going to send back from the server to the user who's requesting this

page and we're going to use the render method that Express gives us to be able to render our home.

ejs.

So have a think about what else you might need to put in between those parentheses in order to get this

code to work.

Have a play around with the code and pause the video now to see if you can now complete the challenge.