Templating With Handlebars

Learn to create semantic templates using a popular and lightweight templating engine, Handlebars!

Start[missing "en.views.course_landing_page.build-interactive-websites.course_illustration" translation]
Learn Handlebars
Lesson 1 of 1
  1. 1

    In this lesson, you will expand your ability to create dynamic web pages by learning about an external library, Handlebars.js! A library is a collection of code that is already written that makes...

  2. 2

    Watch the video to get an in-depth overview of the code used in the previous exercise. In case you want to watch it at a later time, here is the YouTube link. The major steps of using Handleb...

  3. 3

    The power of Handlebars lies in its reusability and extensibility. Handlebars expressions allow us to accomplish this. Inside a script, Handlebar expressions are wrapped with double braces, [....

  4. 4

    So far, you've only used Handlebars expressions to insert values in your templates. If you want to check for a specific object property before you insert a value, Handlebars provides you with the ...

  5. 5

    In the previous exercise, you used [...] to determine if the compiled HTML should include a block of code. But, if that argument turns out to be falsy then you'll just have a blank section in you...

  6. 6

    Another helper that Handlebars offers is the [...] block which allows you to iterate through an array. Just like the [...] block, there is an opening [...] expression and closing [...] expr...

  7. 7

    Using [...] also gives you access to the properties of the element being iterated over. For instance, if you're using the following array inside the [...] object: [...] And your template l...

  8. 8

    In the previous exercises, you've mostly worked with individual expressions, however, you have the ability to combine expressions! In this exercise, you will combine the [...] block and the [.....

  9. 9

    Great work you now know the fundamentals of using Handlebars! Let's recap a few key points: * Handlebars is an external library used to create templates which are a mix of HTML, text, and expressi...

What you'll create

Portfolio projects that showcase your new skills

Pro Logo

Templating With Handlebars

Start[missing "en.views.course_landing_page.build-interactive-websites.course_illustration" translation]