#3 Начинаем программировать

main.js

const mainContainer = document.querySelector(`div.app section.main`);
const template = document.querySelector(`#templates`);

const screens = [
  template.content.querySelector(`.main--welcome`),
  template.content.querySelector(`.main--level-genre`),
  template.content.querySelector(`.main--level-artist`),
  template.content.querySelectorAll(`.main--result`)[0],
  template.content.querySelectorAll(`.main--result`)[1]
];

let currentScreenIndex = 0;

const showScreen = (screenIndex) => {
  while (mainContainer.firstChild) {
    mainContainer.removeChild(mainContainer.firstChild);
  }

  mainContainer.appendChild(screens[screenIndex]);
};

showScreen(currentScreenIndex);

document.addEventListener(`keydown`, (e) => {
  const backArrow = 37;
  const forwardArrow = 39;

  if (e.altKey && e.keyCode === backArrow) {
    if (currentScreenIndex > 0) {
      showScreen(--currentScreenIndex);
    }
  } else if (e.altKey && e.keyCode === forwardArrow) {
    if (currentScreenIndex < screens.length - 1) {
      showScreen(++currentScreenIndex);
    }
  }
});