kolomyaka/Netris

Запуск проекта

npm install - Устанавливаем зависимости
npm run start - Запуск проекта

Необходимо реализовать веб-приложение, обладающее следующим функционалом:

● Отображение тестового видео с возможностью постановки на паузу и возобновлением воспроизведения по клику на область видео

● Отображения списка событий аналитики с возможностью позиционирования видео на момент, указанный в событии

● Список событий должен быть отсортирован по дате возникновения, само событие должно отображаться в списке в виде времени своего возникновения в формате (минуты:секунды:миллисекунды). Пример: 00:03:012, 01:05:123,

● В момент возникновения события в плеере поверх видео должен рисоваться зелёный прямоугольник, соответствующий области, определённой в событии. Прямоугольник должен отображаться как при переходе к событию по клику из списка событий, так и в случае обычного воспроизведения и навигации по видео. При наступлении даты окончания события, прямоугольник должен скрываться. Возможна ситуация что одновременно показываются 2 и более прямоугольника.

Требования

Приложение должно быть написано с использованием TypeScript.
Реализация должна использовать React
Решение должно быть опубликовано на GitHub

Скрипты

npm run start - Запуск frontend проекта на webpack
npm run build - Сборка в prod-режиме
npm run lint:ts - Проверка ts файлов линтером
npm run lint:ts:fix - Исправление ts файлов линтером
npm run lint:scss - Проверка scss файлов style-линтером
npm run lint:scss:fix - Исправление scss файлов style-линтером
npm run test:unit - Запуск unit тестов с jest

Конфигурация проекта

Для разработки проект содержит конфиг:

Webpack - ./config/build

Вся конфигурация хранится в /config

/config/build - Конфигурация webpack
/config/jest - Конфигурация тестовой среды

CI pipeline

Конфигурация github actions находится в /.github/workflows. В ci прогоняются все виды тестов, сборка проекта и линтинг. После прохождения тестов создаются отчеты с подробной информацией.

kolomyaka / Netris