All language subtitles for 028 Challenge 13 Solution_en

All right.

So here comes the answer for challenge 13.

We don't need to change anything inside our app.js because we're already passing over this posts

array to be dealt with inside our home.

ejs.

So this is where we're going to create our FOR loop and log

each of the titles inside our posts array.

Whenever you're writing code inside an EJS file

I recommend to start writing the Javascript code without these little scriptlet tags because they make

everything look a lot more cluttered and

it's difficult to see what's going on when you're just trying to write your code.

The basic FOR loop looks something like this.

We start off with a var called i that starts at zero

and it increases by one until the upper bound that we define.

Then we can use that i to tap into each element inside our array.

So let's write our FOR loop here.

We'll write

for var i = 0

so this is our starting point, i is less than the upper bound and the upper bound

in our case is the length of this post array.

So the number of items are currently inside our posts array

so we'll say posts.length. And the final thing will be i++ so that we increase by 1 each

time. Inside our FOR loop, we're simply going to console log the titles of each of our posts.

So all we need to do is console.log

and the thing we're going to log is posts at index i.

So this is how we tap into each element inside posts.

We use the square brackets and we tell it which one we want to access.

So i will start off being 0 and we'll grab the first item in our posts array and then i will increase

until it gets to our upper bound which is the total number of posts inside the array.

Posts at index

i.title because remember the posts array contains post object and each object has a key of title

and content that contains each of the post titles and bodies. Inside here

this is the code that we need.

And so now we're ready to cap everything off and go ahead and add all EJS scriptlet tags.

And remember that each of these tags have to be added on every single line

so even on the closing curly braces and any semicolons you've got. So let's hit save and let's try it

out.

So let's head over to compose and let's add a title

Day 1. And now let's head back to compose again

and let's add

Day 2.

And now we're on the home page so this is where our console.log is.

And now you can see we're logging Day 1 then Day 2 both the titles without the rest of the array

because we're looping through it and tapping into that title each time. If you need a refresher on FOR loops,

then this might be a good time to have a look back in the course when

we first introduced it or just to check out the MDN docs on FOR loops and to read up on that document

to remind us of how they work.