Mastering Immutable.js

Episode template

Our side-effect will need to insert new HTML elements. For every episode that makes it through the filter, we'll have to insert it into the DOM. For this, we'll use a template element, since we'll have to insert many copies of this HTML fragment:

<template id="episode-template">  <li>    <header>      <h4></h4>    </header>    <section>      <p><strong>Date: </strong> </p>      <p><strong>Director: </strong> </p>      <p><strong>Rating: </strong> </p>    </section>  </li></template>

There are a couple of important details about the structure of this HTML to note here. First, the <h4> tag is empty. Second, each <p> tag has a space at the end of it. In both cases, we'll fill in these blanks with text when we run our side-effects.