All language subtitles for 031 Challenge 15 Solution_en

All right so here comes the answer to the challenge.

The answer is that inside our home.

ejs instead a console logging the post title or whatever it may be, we want to be able to render it as

HTML element. And we have to render each item inside the post array as an individual

h1 and paragraph element just like what we've got up here with our home as our h1 and our startingContent

being placed into paragraph elements.

That's what we need to do down here.

Some of you might have struggled with this because you try to keep the scriptlet tags in place and then

try to add an h1 inside here.

Well this is actually just pure bog standard h1. So it shouldn't go inside the Javascript scriptlet tags

so let's delete those. Inside our forEach loop

we know that we loop through each post inside our post array and each post needs an h1 for its title

and a paragraph for its content.

So let's go ahead and create an h1. And the content of our h1 is going to be the post in the singular

form so each post .title. And then we're going to have a paragraph element and in our paragraph element

we're going to add the post.content.

So again make sure that these are the singular forms because we want to have a title and content created

for each post inside the array.

That's why we're using a for loop right? Now

in order for this to work, we need to be able to put in the value of post.title into our h1 and

the value of post.content into our paragraph. And we have to do that just as we did up here

because these are going to be Javascript variables right? They're not just plain text that we want to show

because if it looks like this then our home page would end up just having post.title post.content

showing up

and that's just plain text.

So we have to use EJS tags that outputs the value into the template.

Let's go ahead and add those tags around our variables.

It's angle bracket percentage sign equals percentage sign angle bracket to close it off.

All right so now that we've used the value tags let's go ahead and check and refresh our home page.

And now you should be able to see the title and the body being rendered inside the paragraph and h1

tags.

And to further confirm that this is doing it for every single post, we can go ahead and add another post

through our compose page. And you can see that when we update our home page we've got everything being

rendered and we're looping through each and every blog post in our posts array to render it on the screen.