Завдання виконано за допомогою React.js

Demo - click on me

Додаток містить дві сторінки:

• сторінка з курсами; - 100%
• сторінка з переглядом курсу; - 100%

Детально про сторінки:

• В стрічці з курсами необхідно відобразити останні 10 курсів. Курс містить:
  • Фото курсу. - 100%
  • Заголовок курсу. - 100%
  • Кількість уроків, навички та рейтинг. - 100%
  • На сторінці виводимо 10 курсів і додаємо пагінацію. - 100%
  • Додатково:
    • при ховері відтворювати відео без звуку. - 0%
• На сторінці з переглядом курсу відображається перше відео з даного курсу, деталі про курс та список уроків: - 100%
  • При кліку на урок (якщо він не заблокований) для перегляду відкриється поточне відео, користувач повинен розуміти, який урок з курсу переглядає. - 100%
  • Необхідно зберігати прогрес перегляду відео та уроку курсу (зберігати локально). - 80%
  • Якщо урок заблокований показати це користувачу. - 100%
  • Додатково:
    1. Зробити функціонал picture in picture (без сторонніх бібліотек): - 100%
       • Відео можна вивести поверх сторінки при кліку. При цьому відео знаходиться у правому нижньому куті сторінки й можна ходити по інших сторінках.
    2. Додати зміну швидкості програвання відео через клавіатуру (без сторонніх бібліотек) (комбінація клавіш на власний розсуд):- 0%
       • Так же вивести інформацію біля відео як цим користуватись.

Додаткові завдання:

• пропрацювати помилки від API (помилка мережі, ...); - 80%
• адаптив під мобільну версію; - 90%
• анімація завантаження відео; - 0%
• код покритий тестами; - 0%