All right guys. In the last few modules we've covered a lot of stuff and it's really really important 1
stuff. 2
So it's time to challenge yourself and see if you've understood the concepts that were presented in 3
the last few modules. 4
So this module is the EJS challenge although it also relies on your knowledge and skills from the Express 5
module as well as everything that we've learned about Node. 6
Now this challenge is slightly different from previous challenges because we're now at a point where 7
you can create fully fledged Node.js backed websites. 8
We're going to take you to the next level. 9
So by the end of this module we would have made a beautiful personal blog or personal diary website 10
that would look like this. 11
So it's very minimalistic and it's got a header up here with a nav bar and your brand 12
and then at the bottom it's got a sticky footer 13
and you can put in your footer text. 14
And here we've only got three pages: 15
the home page, the about us page and also a contact us page. And all of this is going to be generated using 16
EJS partials, 17
so using those layouts that we learned about in the last module. 18
Now when you head over to the home page, this is going to have all of your blog posts on here listed 19
in chronological order but the actual blog content will be truncated to only 100 characters. 20
Now when you click on read more, it will take you to an individual page of each of your blog posts and 21
you can read them independently on a single page. 22
Now there's also a hidden page which will allow you to compose your diary. 23
So if we create a new post here 24
and let's just copy and paste some Loren Ipsum into the post and hit publish. 25
Then you can see it gets put right on the home page and a brand new page has been created just for that 26
new post. And now right in the URL 27
we can change this to something like /posts/another-post 28
so the title of our new post that we created. And we hit enter and we get taken to the page where that blog 29
posts exists. So you can see by using EJS we're able to create dynamically single pages, 30
new web pages for each and every blog post that we're making. 31
And through the challenge you're going to realize just how easy it is to use templating to achieve this. 32
Now just before we get started, I want to show you what to expect in terms of the format of the challenges 33
because there is a pretty dramatic step up from the previous ones that you've attempted. 34
Now firstly you should complete the challenges in order because they are the steps that are required 35
to create the final product. 36
And when you view the challenge video, I'm first going to introduce to you what it is that I want you 37
to achieve by the end of the challenge, 38
so what is the goal of that particular challenge. 39
And then you can pause the video and try to complete the challenge. 40
But if you get stuck at any point and you really can't figure out how to proceed, instead of rewinding 41
back and watching previous modules videos, I want you to go ahead and press play on the video again which 42
will take you to a hint. 43
And this is where I'm going to give you a couple of hints that should help you complete the challenge. 44
And once you've gone through a hint, you should pause the video and head back to the challenge and 45
give it another go. 46
Now if that hint wasn't enough there might be a second hint or a third hint. 47
So after each hint there is going to be 10 seconds for you to pause the video. So to complete the challenge 48
I want you to use as few hints as you possibly can but the ultimate goal is to complete the challenge 49
by yourself. 50
So if you find that you need more hints then just press play and watch the next hint and then pause 51
and try and see if that helps you with the challenge. 52
Now at some point you're going to see a red screen on the video and it's going to tell you that if you 53
proceed any further 54
this is basically the spoiler right? 55
This is where I'm going to reveal to you the answer to completing that challenge. 56
So if you don't want to see the answer before you've given a proper go at the challenge, then I recommend 57
you really pause and give the challenge at least an hour to try and see if you can figure it out. 58
Now in the resources of each lesson, you'll find a download link to the solution code. 59
So if after completing the challenge watching through all the hints and answers and your code still doesn't 60
seem to work the same way that you see on screen, 61
then you should download the completed code for that lesson and compare against yours to see whether 62
if you've made any typos or if you've created any bugs. 63
Now the point of these challenges is to test yourself and to break down a large problems such as creating 64
this web app into small chunks that you can tackle one by one. And it's really really important that 65
you promise me that you'll give it a real good go because this really is the way that you're going to 66
learn. 67
This is the part that's really going to take you from a student to an actual developer. 68
And I've put so much thought and heart and soul into creating these challenges so that they can benefit 69
you. So please please please give it a real good go before you go through to the next hint or to the 70
answer. 71
Now if you got through the challenge without looking at a single hint then you get a gold star. 72
Whereas if you had to look at one hint, then you get a silver and if you had to look at two hints then 73
you get a bronze. 74
But we've done a lot of research on this and we've tested this method on real students through many 75
many iterations and in person trials and this works fantastic as long as you have the perseverance 76
and the will to give it a go. 77
For the students who've gone through it, you'll realize just how fun and experience this is and how you 78
can really see your skill level grow through these challenges. 79
Now without further ado, if you head over to the next lesson we're going to get started with challenge 80
1.