https://github.com/yevheniidatsenko/goit-advancedjs-hw-01
Advanced JS: Image Gallery, Video Player, Feedback Form
https://github.com/yevheniidatsenko/goit-advancedjs-hw-01
goit goit-advancedjs-hw-01 javascript json npm vite
Last synced: 4 months ago
JSON representation
Advanced JS: Image Gallery, Video Player, Feedback Form
- Host: GitHub
- URL: https://github.com/yevheniidatsenko/goit-advancedjs-hw-01
- Owner: yevheniidatsenko
- Created: 2023-11-12T20:27:15.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2023-11-13T21:21:10.000Z (almost 2 years ago)
- Last Synced: 2025-02-10T08:49:21.603Z (8 months ago)
- Topics: goit, goit-advancedjs-hw-01, javascript, json, npm, vite
- Language: JavaScript
- Homepage: https://yevheniidatsenko.github.io/goit-advancedjs-hw-01/
- Size: 5.02 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Домашня робота з Advanced JS №1
Ця домашня робота з Advanced JS містить три завдання:
- Завдання 1: Бібліотека SimpleLightbox
- Завдання 2: Відеоплеєр
- Завдання 3: Форма зворотного зв'язку
Кожен із цих завдань має свої власні вимоги, які описані нижче.
## Завдання 1: Бібліотека SimpleLightbox
У цьому завданні вам потрібно додати бібліотеку SimpleLightbox як залежність
проєкту та використовувати її для створення галереї зображень.
**Вимоги:**
- Бібліотека SimpleLightbox повинна бути встановлена як залежність проєкту через
npm.
- Скрипт повинен використовувати код з вашої останньої домашньої роботи з
JavaScript Fundamentals, але повинен бути рефакторингований з урахуванням
того, що бібліотека була встановлена через npm.
- CSS код бібліотеки повинен бути підключений до проєкту.
## Завдання 2: Відеоплеєр
У цьому завданні вам потрібно написати скрипт, який буде зберігати поточний час
відтворення відео у локальне сховище і, після перезавантаження сторінки,
продовжувати відтворювати відео з цього часу.
**Вимоги:**
- Бібліотека Vimeo плеєра повинна бути встановлена як залежність проєкту через
npm.
- Плеєр повинен бути ініціалізований у файлі скрипта.
- Поточний час відтворення відео повинен зберігатися у локальне сховище.
- Під час перезавантаження сторінки час відтворення повинен бути відновлений із
збереженої позиції.
- Час відтворення повинен оновлюватися у сховищі не частіше, ніж раз на секунду.
## Завдання 3: Форма зворотного зв'язку
У цьому завданні вам потрібно написати скрипт, який буде зберігати значення
полів у локальне сховище, коли користувач щось друкує.
**Вимоги:**
- Скрипт повинен відстежувати подію input на формі.
- Поточні значення полів форми повинні зберігатися у локальне сховище.
- Під час завантаження сторінки поля форми повинні бути заповнені даними з
локального сховища, якщо вони там є.
- Під час сабміту форми поля форми повинні бути очищені, а також у консоль
повинен бути виведений об'єкт із поточними значеннями полів.
- Час відновлення даних із локального сховища не повинен перевищувати 500
мілісекунд.
**Для виконання завдань вам знадобляться наступні бібліотеки:**
- SimpleLightbox
- VimeoPlayer
- lodash