Just like the <show-trending> and <search-container> components, you can test the <show-random> Web Component by adding the <show-random> component inside the <my-app> component. But if you want to integrate it all, I have a better option.

Let's take a look at the <my-app> component. If we want all these three components, we will need to include it first:

import SearchContainer from '../search-container';
import ShowTrending from '../show-trending';
import ShowRandom from '../show-random';

export default class MyApp extends HTMLElement {
    ...
    ...
    ...   
}

Now that we have these components imported, lets register these custom elements:

registerOtherComponents() {
  if (typeof customElements.get('search-container') === 'undefined') {
    customElements.define('search-container', SearchContainer);
  }

  if (typeof customElements.get('show-trending') === 'undefined') {
    customElements.define('show-trending', ShowTrending);
  }

  if (typeof customElements.get('show-random') === 'undefined') {
    customElements.define('show-random', ShowRandom);
  }
}

We can also add a showSection variable to keep track of what component to show at what time:

constructor() {
  ...

  // to show what section
  this.shownSection = 1;

  ...
}

We are initially setting it to a value of 1, so that it can show <search-container> by default.

And, to make it work, we will modify the getTemplate() method a little bit to look something like this:

getTemplate() {
  return `
    <div class="app-section">
      ${this.getSection(this.shownSection)}
    </div>
    ${this.getStyle()}
  `;
}

getSection(section) {
  switch(section) {
    case 1:
      return `
        <search-container></search-container>
      `;
    case 2:
      return `
        <show-trending></show-trending>
      `;
    case 3:
      return `
        <show-random></show-random>
      `;
  }
}

This way, you can test the pages manually by changing the value of showSection. 

Now that we have created a way where we can show different page level components by changing the value of the variable showSections, we can now concentrate on the routing aspect of these page level components. Rather than manually changing the page numbers, it is time to automate this page change concept with the implementation of routing.