Вебдизайн та вебпрограмування

Мета вивчення дисципліни
Метою вивчення дисципліни є формування комплексу знань та умінь в галузі сучасних методів і засобів проектування та реалізації веб-сервісів та веб-додатків. Практичне значення та використання отриманих знань
Опанування сучасних технології розробки та проектування веб-сервісів та вебдодатків з урахуванням сучасного дизайну, навантаження у мережі Інтернет, безпеки веб-сайтів та веб-інтеграції з іншими веб-технологіями; вміння застосовувати основи сучасних веб-технологій на стороні клієнта та сервера та реалізовувати їх взаємодію.
Тематика та види навчальних занять
Для денної форми здобуття освіти
Лекційні заняття
Лекція 1. «Основи мови розмітки веб-сторінок HTML. Концепція мови HTML. Теги та атрибути мови HTML. Основні програмні інструменти для роботи з HTML».
Лекція 2. «Основи мови стилізації веб-сторінок CSS. Способи застосування CSS. Синтаксис мови CSS. Селектори та стильові правила мови CSS. Блокові й строкові елементи».
Лекція 3. «Основи застосування мови СSS. Керування кольором в мові CSS. Координати й розміри. Керування видимістю елементів розмітки». Лекція 4. «Основні селектори мови CSS. Комбіновані селектори».
Лекція 5. «Блочна модель елементів розмітки. Медіа-запити. CSS-анімація».
Лекція 6. «Основи Flexbox layout».
Лекція 7. «Основи Grid layout».
Лекція 8. . «Основи мови JavaScript. Основи синтаксису мови JavaScript. Основні типи даних мови JavaScript. JavaScript-літерали та змінні. Умовні оператори, оператори циклів в мові JavaScript».
Лекція 9. «Масиви та об’єкти в мові JavaScript. Javascript-функції як типи даних і як об'єкти. Способи опису користувацьких об’єктів»
Лекція 10. «Об’єктна модель документа (DOM). Основні властивості мови JavaScript, призначені для позиціонування на вузлах DOMдерева. Основні JavaScript-методи маніпуляції вузлами DOM-дерева».
Лекція 11. «Доступ до атрибутів DOM-дерева. Методи зміни DOM-дерева: створення елементів, вставка елементів, видалення елементів, клонування елементів».
Лекція 12. «Обробка браузерних подій на мові JavaScript. Події веб-додатку. Порядок обробки подій. Делегування подій. Генерація подій на елементах DOM-дерева».
Лекція 13. «Програмування форм на мові JavaScript. Властивості елементів форм. Обробка зміни даних в елементах форм. Програмування подій відправки даних з форми»
Лекція 14. «Робота з регулярними виразами на мові JavaScript. Основи мови регулярних виразів. Основні методи мови JavaScript для роботи з регулярними виразами. Валідація форм на основі регулярних виразів».
Лекція 15. «Малювати растрову 2D-графіку, зображення, анімації».
Лабораторні заняття
Лабораторне заняття №1. Вивчення основних можливостей мови HTML.
Мета заняття: вивчення основних можливостей мови HTML — зрозуміти, як створювати структуру та контент веб-сторінок, формувати навички роботи з тегами для розмітки тексту, зображень та посилань, а також розвинути інтерес до веб-розробки.
Лабораторне заняття №2. Форми в HTML-документах.
Мета заняття: взаємодійте з сайтом, введіть інформацію через текстові поля, прапори, комутатори та інші елементи керування. Виконання різних завдань, таких як реєстрація, надсилання повідомлень або заповнення анкет.
Лабораторне заняття №3. Використання каскадних таблиць стилів CSS: робота з селекторами мови CSS..
Мета заняття: зрозумійте основи зв'язування документа CSS з файлами HTML та вміти виконувати просте форматування тексту за допомогою CSS. Навчити розробника точно вибирати та стилізувати елементи HTML на веб -сторінці, використовуючи різні типи селекторів для управління зовнішнім виглядом сайту та його елементів.
Лабораторне заняття №4. Використання каскадних таблиць стилів CSS: використання CSS-анімації.
Мета заняття: оволодіння створенням анімованих елементів веб -сторінок за допомогою анімації CSS, що дозволяє сайтам надавати динамізм сайтів, вдосконалювати досвід користувачів та створювати складні візуальні ефекти.
Лабораторне заняття №5. Використання каскадних таблиць стилів CSS: створення каркасу сайту за допомогою Flexbox layout та Grid layout.
Мета заняття: навчити створювати гнучкі, адаптаційні та складні двовимірні макети веб-сторінок за допомогою мережевої системи, яка забезпечує більш точний контроль над розташуванням елементів і допомагає створити більш чисті та підтримувану HTML.
Лабораторне заняття №6. Основи використання мови JavaScript: робота з основними структурами даних мови JavaScript.
Мета заняття: навчити створювати інтерактивні веб -сторінки та складні веб -додатки, оволодіти принципами мовної роботи, отримувати практичні навички для створення інтерфейсів користувача
Лабораторне заняття №7. Малювати растрову 2D-графіку, зображення, анімації.
Мета заняття: навчити розробників використовувати елемент HTML Canvas для створення та управління динамічною графікою, анімацією, діаграмами, зображеннями та іншими візуальними елементами безпосередньо у веб -браузері Javascript.
Для заочної форми здобуття освіти
Лекційні заняття
Лекція 1. «Основи мови розмітки веб-сторінок HTML. Концепція мови HTML. Теги та атрибути мови HTML. Основні програмні інструменти для роботи з HTML».
Лекція 2. «Основи мови стилізації веб-сторінок CSS. Способи застосування CSS. Синтаксис мови CSS. Селектори та стильові правила мови CSS. Блокові й строкові елементи».
Лабораторні заняття
Лабораторне заняття №1. Вивчення основних можливостей мови HTML.
Мета заняття: вивчення основних можливостей мови HTML — зрозуміти, як створювати структуру та контент веб-сторінок, формувати навички роботи з тегами для розмітки тексту, зображень та посилань, а також розвинути інтерес до веб-розробки.
Лабораторне заняття №2. Форми в HTML-документах.
Мета заняття: взаємодійте з сайтом, введіть інформацію через текстові поля, прапори, комутатори та інші елементи керування. Виконання різних завдань, таких як реєстрація, надсилання повідомлень або заповнення анкет.
Консультації здійснюються впродовж семестру згідно встановленого розкладу.
Форми контрольних заходів та оцінювання результатів навчання
Для здобувачів денної форми здобуття освіти індивідуальна робота відсутня за планом
Контрольна робота для здобувачів заочної форми
Завдання для виконання контрольної роботи здобувач отримує на установчій лекції.
Робота містить 2 теоретичних питання та 3 практичних завдання.
Обсяг відповіді на кожне теоретичне питання: не більше, ніж одна сторінка тексту, оформленого шрифтом Times New Roman 14 pt. Текст відповіді повинен бути виконаний самостійно, а не згенерований засобами штучного інтелекту.
Термін надання виконаної контрольної роботи на перевірку – не пізніше, ніж за місяць до початку сесії.
Форми контрольних заходів та оцінювання результатів навчання

Для денної форми здобуття освіти
Поточний контроль полягає у виконанні:
1) 7 лабораторних робіт. Оцінюються по 5 балів;
2) двох модульних контрольних робіт. Модульні контрольні роботи складаються з теоретичної і практичної частин та проводяться у формі написання програми з коментарями відносно прийнятих рішень. Бездоганне виконання 1 по 30 балів та 2 модуль по 35 балів.
Підсумковий контроль – екзамен. За 100-бальною шкалою.
Бали розподіляються наступним чином: 40 балів – теоретична частина та 60 балів – практична.
Екзаменаційний білет містить 2 теоретичних питання рівної складності, практична – 2 питання рівної складності.
За бездоганну відповідь на кожне теоретичне питання здобувач отримує 20 балів. При цьому відповідь вважається бездоганною, якщо здобувач повністю розкрив суть питання, послідовно і логічно його доповів, навів приклади. Кожне завдання практичної частини іспиту вважається виконаним бездоганно, якщо при його розв’язанні коректно розроблено програму відповідності до завдання.
Максимальна оцінка, яку може отримати студент – 100 балів.
Для заочної форми здобуття освіти
Захист контрольної роботи. Бездоганне виконання контрольної роботи оцінюється у 60 балів. Бездоганнне виконання 2 лабораторних робіт оцінюється загалом у 40 балів.
Підсумковий контроль – екзамен. Екзамен у формі комп'ютерного тестування. Максимальна оцінка, яку може отримати студент – 100 балів.