Ты прям архитектор красоты. Так держать. Перейдем к наполнению главной страницы.

В нашем приложении будет много запросов к серверу. Так же нам необходимо будет отображать разные состояния UI (ошибка, загрузка данных). Механизм кэширования и отслеживания состояния серверных данных не хочется реализовать вручную, есть смысл взять готовое решение. Я предлагаю выбрать react-query для этих целей.

<aside> ❗

• Состояние приложение vs кэш данных </aside>

Задачи

• сверстать главную страницу;
• наполнить главную страницу настоящими данными
  • реализовать получение списка треков с бэкэнда
  • реализовать получение подборок с бэкэнда
• реализовать левое меню (без смены цветовой темы)
• покрыть интеграционными тестами написанный функционал.

<aside> ❗

Механику плеера, фильтров, функционал поиска реализовать на данном шаге не нужно

</aside>

Чек-лист для проверки

• [ ] Главная страница сверстана
• [ ] Я, как пользователь, могу посмотреть список доступных мне треков
• [ ] Я, как пользователь, могу посмотреть список доступных мне подборок
• [ ] Я, как пользователь, могу разлогиниться из сервиса
• [ ] Я, как пользователь, могу перейти на страницу подборок
• [ ] Я, как пользователь, могу перейти на страницу избранных треков