Using the new ES6 template engine



  • The early releases of DADI Web relied on a single templating engine, DustJS. It's powerful, lightweight, extendable, and has just the right amount of logic. But it's not to everyone's taste. So in Web 3.0 we introduced template engine support, giving the engineer a choice of templating languages and making it quick and easy for them to roll their own.

    We recently built an RSS feed using DADI Web. This is a relatively straight forward task, so rather than using DustJS we decided to make use of the new ES6 engine.

    Here's a snippet of the item iterator:

    ${articles.results
      .map(i =>
        `<item>
          <guid isPermaLink="false">${i._id}</guid>
          <title>${clean(i.title)}</title>
          <link>${i.url}</link>
          <pubDate>${utcDate(i.publicationDate)}</pubDate>
          <category>${clean(i.category.name)}</category>
          <category domain="${i.category.domain}">${clean(i.category.name)}</category>
       </item>`
    })
    

    Just like DustJS, we have helpers. Small JS files that are called during render to mutate values. In this example I created two.

    1. clean which cleans html special characters, similar to PHP's htmlspecialchars
    2. utcDate which converts an epoch timestamp into an RSS compatible utc date string

    The total line count for the templates is just 37, with another 12 for the helpers.

    Want to try it yourself? Read more about choosing an engine.


Log in to reply
 

Looks like your connection to DADI Forum was lost, please wait while we try to reconnect.