Koddo
начать бесплатно
проект · JavaScript

Музыкальный сервис «Волна»

Соберёшь логику музыкального сервиса: каталог, плейлисты и очередь треков. Добавишь статистику прослушиваний и генератор микса.

Для старта: Знаешь переменные, функции и массивы JavaScript; работа с DOM не нужна

  • JavaScript
  • 5 модулей
  • 25 задач
  • 5 задач бесплатно
начать бесплатно посмотреть программу

После регистрации проект откроется в приложении.

результаты практики

Что освоишь на практике

Автор программы:
  • Работа с массивами: map, filter, reduce и иммутабельные операции
  • Управление очередью воспроизведения: позиция, перемотка, вставка
  • Агрегация статистики: счётчики, процентные метрики, поиск лидера
подробнее о задачах и навыках

Что получится

Музыкальный сервис «Волна» на чистом JavaScript — каталог треков, конструктор плейлистов, очередь воспроизведения, статистика прослушиваний и генератор «Микса дня». Каждый модуль — реальная фича стримингового сервиса: от кнопки «добавить в плейлист» без дублей до детерминированного тасования и отчёта об итогах месяца.

Для кого

Ты знаешь основы JavaScript — переменные, функции, массивы — и готов впервые написать что-то большее, чем учебный скрипт. Опыт с DOM или браузером не нужен: весь проект — чистые функции и структуры данных.

Что ещё отработаешь

  • Детерминированное тасование без Math.random
  • Сборка конвейера из независимых функций-модулей
  • Числовые ключи объектов и неочевидное поведение при автоприведении типов
программа

Программа проекта

Каждый модуль добавляет часть проекта. В финале ты объединишь их в рабочее решение.

25 задач · 5 модулей
1.1
Подпись трека
Соберите единую подпись трека «Исполнитель — Название» — первый модуль музыкального сервиса «Волна»
1.2
Трек по id
Найдите трек в каталоге по идентификатору — базовый поиск, на который обопрётся вся «Волна»
1.3
Треки исполнителя
Посчитайте треки исполнителя в каталоге — счётчик со строгим сравнением для страницы артиста
1.4
Полка жанра
Соберите названия треков жанра в новый массив — жанровая полка каталога не трогает оригинал
1.5
Карточка трека
Соберите карточку «Транзит — Кофеин (3:08)» из двух готовых модулей каталога и форматирования длительности
2.1
Длительность плейлиста
Сложите секунды треков плейлиста, молча пропуская id, которых в каталоге уже нет
2.2
Уже в плейлисте?
Проверьте вхождение трека в плейлист и верните честный boolean — на нём держится кнопка «добавить»
2.3
Добавить без дублей
Добавьте трек в плейлист, только если его там нет, — и всегда верните новую копию массива
2.4
Слить два плейлиста
Объедините два плейлиста: first целиком, новинки из second — и ни одного нового дубля
2.5
Сводка плейлиста
Соберите шапку плейлиста из готовых модулей: имя, счётчик треков, общая длительность и самый долгий трек
3.1
Что играет
Мини-плеер спрашивает у очереди id текущего трека — число или null, когда играть нечего
3.2
Кнопки перемотки
«Вперёд» и «назад» в плеере: новая позиция очереди с зажимом в границы — за края не выпадаем
3.3
Играть следующим
Пункт меню «Играть следующим»: вставка id сразу после текущей позиции — дубли в очереди легальны
3.4
Дальше в очереди
Экран очереди берёт копию хвоста: текущий трек и все будущие, прошлое не показываем
3.5
Шаг плеера
Иммутабельный шаг на следующий трек: новая очередь с копией массива — спред { ...queue } здесь тихо ломает всё
4.1
Сколько раз слушали
Сосчитайте запуски трека в журнале прослушиваний — дослушан он или нет, запуск уже состоялся
4.2
Счётчики прослушиваний
Сверните журнал событий в объект-счётчик и узнайте, почему число 102 становится ключом "102"
4.3
Дослушиваемость
Посчитайте целый процент дослушанных треков — и спасите отчёт пустого журнала от «NaN%» ранним return
4.4
Хит слушателя
Найдите по готовым счётчикам самый игранный трек — и верните его id числом, а не строковым ключом
4.5
Экран «Итоги»
Соберите отчёт слушателя из четырёх готовых модулей: запуски, дослушиваемость и хит, переживший чистку каталога
5.1
Свежие треки
Отберите для «Микса дня» треки, которых нет в истории прослушиваний, — порядком каталога и новым массивом
5.2
Тасование разрезом
Перемешайте микс без Math.random: чётные индексы, затем нечётные — порядок воспроизводится при каждом построении
5.3
Лимит микса
Обрежьте перетасованный список до maxCount треков; полная копия — всё равно новый массив, а не сам вход
5.4
Подписи микса
Соедините готовые поиск и подпись: id микса превращаются в строки «Исполнитель — Название», битые id молча выпадают
5.5
Микс дня сборка проекта
Капстоун «Волны»: соберите конвейер из семи готовых модулей — свежее, тасование разрезом, лимит и подписи в одном объекте микса
полный доступ Платные модули этого проекта входят в Premium. Условия подписки можно посмотреть на странице тарифов. от 490 ₽ / мес посмотреть тарифы первые 5 задач — бесплатно, без карты
первый шаг в этом проекте

Начни с задачи «Подпись трека»

После регистрации откроется проект «Музыкальный сервис «Волна»». Начни с модуля «Каталог треков»: редактор и проверка доступны на странице задачи.

5 задач бесплатно

начать бесплатно

После регистрации проект откроется в приложении.

другие курсы и сборники на этом языке
куда дальше

Другие курсы и сборники

все курсы