All right so here comes the answer to the challenge. 1
The answer is that inside our home. 2
ejs instead a console logging the post title or whatever it may be, we want to be able to render it as 3
HTML element. And we have to render each item inside the post array as an individual 4
h1 and paragraph element just like what we've got up here with our home as our h1 and our startingContent 5
being placed into paragraph elements. 6
That's what we need to do down here. 7
Some of you might have struggled with this because you try to keep the scriptlet tags in place and then 8
try to add an h1 inside here. 9
Well this is actually just pure bog standard h1. So it shouldn't go inside the Javascript scriptlet tags 10
so let's delete those. Inside our forEach loop 11
we know that we loop through each post inside our post array and each post needs an h1 for its title 12
and a paragraph for its content. 13
So let's go ahead and create an h1. And the content of our h1 is going to be the post in the singular 14
form so each post .title. And then we're going to have a paragraph element and in our paragraph element 15
we're going to add the post.content. 16
So again make sure that these are the singular forms because we want to have a title and content created 17
for each post inside the array. 18
That's why we're using a for loop right? Now 19
in order for this to work, we need to be able to put in the value of post.title into our h1 and 20
the value of post.content into our paragraph. And we have to do that just as we did up here 21
because these are going to be Javascript variables right? They're not just plain text that we want to show 22
because if it looks like this then our home page would end up just having post.title post.content 23
showing up 24
and that's just plain text. 25
So we have to use EJS tags that outputs the value into the template. 26
Let's go ahead and add those tags around our variables. 27
It's angle bracket percentage sign equals percentage sign angle bracket to close it off. 28
All right so now that we've used the value tags let's go ahead and check and refresh our home page. 29
And now you should be able to see the title and the body being rendered inside the paragraph and h1 30
tags. 31
And to further confirm that this is doing it for every single post, we can go ahead and add another post 32
through our compose page. And you can see that when we update our home page we've got everything being 33
rendered and we're looping through each and every blog post in our posts array to render it on the screen.