In this lesson, you will expand your ability to create dynamic web pages by learning about an external library, Handlebars.js!
Invitations are a great example of a “real life” template. Invitation cards usually include the invitee’s name, the venue location, the time and date, and maybe a short description. If you had to write all of that information out, then you would realize that most of the information is repeated — the only change you really need to make is the name! Creating a template with a blank space for the name would make it much easier for you to invite all your friends and family!
The idea of templating becomes even more useful for web pages that have thousands or even millions of views. Take for instance this exercise that you’re working on right now — it has the same material for every visitor, the only major difference is your own personal icon on the top right corner. You wouldn’t want to create a unique page for every single visitor, use a template and sub in the values you need to.
Take a look at the text on the web page and note all the instances that ‘vanilla’ comes up.
In main.js, re-assign the value of
flavor in the
context object to
'chocolate'. Then run your code.
Notice all the changes you made with one edit!