Log in from a computer to take this course

You'll need to log in from a computer to start Learn Handlebars. But you can practice or keep up your coding streak with the Codecademy Go app. Download the app to get started.

apple storegoogle store
Learn

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 expressions.
  • Handlebars uses expressions which are wrapped inside double braces like: {{someVariable}}
  • A script tag with a type of "text/x-handlebars-template" is used to deliver a template to the browser.
  • Handlebar.compile() returns a templating function from a template script intended for Handlebars.
  • A template created from .compile() will take an object as an argument and use it as context to generate a string containing HTML.
  • Handlebars has built in block helpers which can be included in a Handlebars script.
  • Block helpers have a starting expression and an ending expression. The starting expression will have a # appears before a keyword. The ending expression will have the same keyword but with a / character to denote the end.
  • The {{if}} will conditionally render a block of code.
  • An {{else}} expression can be inserted into an if helper block and used as part of the conditional statement.
  • {{each}} is another built-in helper expression which accepts an array to iterate through.
  • In the block helper functions, the {{this}} expression gives context and serves as a placeholder for the current value.

Instructions

If you want to challenge yourself:

  • Add more elements and properties to the array in the languages property.
  • Re-write the code in the code editor from scratch.
  • Wrap an {{each} block inside an {{if}} block.
  • Create a separate Handlebars script and insert the finished template into a different section of the web page.

Sign up to start coding

Mini Info Outline Icon
By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.

Or sign up using:

Already have an account?