Traverse deep categoryTree recursively

renderCategories.js

function rootTemplate(categories) {
  return `
    <div class="root-container">
      ${ getCategoryMarkup(categories) }
    </div>
  `
}

function itemsTemplate(items, level) {
  return `
    <div class="cat-items">
      ${items.reduce((titles, item) => `
        ${titles}
        <h${level}>${item.title}</h${level}>
      `, '')}
    </div>
  `
}

function categoryTemplate(category, title, level) {
  return `
    <div class="cat cat--level-${level}">
      <h${level}>${title}</h${level}>
      ${ getCategoryMarkup(category, level + 1) }
    </div>
  `
}

function getCategoryMarkup(category, level = 1) {
  return Object.keys(category).reduce((markup, key, index) => {
    var node = category[key]
    var newMarkup = key === 'items' ?
      itemsTemplate(node, level) :
      categoryTemplate(node, key, level)
    return markup + newMarkup
  }, '')
}

// For debugging
var el = document.createElement('div')
el.innerHTML = rootTemplate(categories)
el.firstElementChild