Template literals

02/08/20181 Min Read — In JavaScript, ES6

Template literals can be great for creating markup

const person = {
  name: 'Ash',
  job: 'Frontend development director',
  town: 'Eastbourne',
  bio: 'Bacon ipsum dolor amet capicola ribeye filet mignon alcatra, corned beef pork chop shankle',
};

const markup = `
  <div class="card">
    <h2>${person.name}</h2>
    <p class="job">${person.job}</p>
    <p class="location">${person.town}</p>
    <p class="bio">${person.bio}</p>
  </div>
`;

console.log(markup);