FRONT-END-ПРОГРАМУВАННЯ

Робоча програма навчальної дисципліни (Силабус)

Реквізити навчальної дисципліни

Рівень вищої освіти Перший (бакалаврський)
Галузь знань 12 Інформаційні технології
Спеціальність 126 Інформаційні системи та технології
Освітня програма Інтегровані інформаційні системи
Статус дисципліни Вибіркова
Форма навчання очна(денна)/ дистанційна
Рік підготовки, семестр 4 курс, весняний семестр
Обсяг дисципліни 150 годин (8 годин – Лекції, 36 годин – Лабораторні, 106 годин – СРС)
Семестровий контроль/ контрольні заходи Залік/залікова робота, модульна контрольна робота
Розклад занять http://rozklad.kpi.ua
Мова викладання Українська
Інформація про
керівника курсу / викладачів

Лектор, лабораторні: к.ф.-м.н., Жереб Костянтин Анатолійович,

zhereb@gmail.com,

моб. +38(095)874-28-32

Розміщення курсу https://campus.kpi.ua

Програма навчальної дисципліни

Опис навчальної дисципліни, її мета, предмет вивчання та результати навчання

Опис дисципліни. При проходженні даної дисципліни, студенти ознайомляться з поняттям «front-end розробка», сучасними інструментами розробки веб-застосунків, підходами створення багатофункціональних систем з веб-інтерфейсом. На лабораторних заняттях опанують бібліотеки та інструментальні засоби для розробки клієнтської частини веб-застосунків, зокрема Angular, React, Vue. Студенти також ознайомляться з перспективними технологіями, що підтримуються сучасними браузерами та описані останніми версіями стандартів. В курсі передбачений контроль якості отриманих знань у вигляді експрес-контрольних та модульних контрольних робіт.

Предмет навчальної дисципліни: front-end розробка, бібліотеки та фреймворки для створення багатофункціонального веб-інтерфейсу, інструментальні засоби підтримки front-end розробки.

Міждисциплінарні зв’язки. Дисципліна Front-end-програмування базується на дисциплінах: Операційні системи; Програмування – 1. Основи програмування; Програмування – 2. Структури даних та алгоритми.

Мета навчальної дисципліни. Підготовка висококваліфікованих фахівців, які володіють основними поняттями front-end розробки, проектуванням сучасних багатофункціональних веб-інтерфейсів, використанням сучасних інструментальних засобів, бібліотек та фреймворків, налаштуванням інструментальних конвеєрів для front-end розробки, використанням перспективних можливостей сучасних веб-браузерів.

Основні завдання навчальної дисципліни

Знання:

  • ролі та місця front-end розробки в процесах розробки сучасних інформаційних систем;

  • підходів до проектування сучасних багатофункціональних веб-інтерфейсів;

  • можливостей сучасних інструментальних засобів, бібліотек та фреймворків;

  • принципів функціонування веб-додатків;

  • протоколів та програмних інтерфейсів, що використовуються в сучасних веб-браузерах.

Уміння:

  • аналізувати вимоги до розробки веб-застосунків з багатофункціональним інтерфейсом;

  • обирати найбільш вдалу технологію для реалізації веб-застосунків;

  • встановлювати, налаштовувати та використовувати сучасні інструментальні засоби front-end розробки;

  • володіти мовами HTML, CSS, JavaScript, a також сучасними розширеннями цих мов, зокрема TypeScript, JSX;

  • будувати веб-застосунки на основі бібліотечних засобів Angular, React, Vue;

  • використовувати можливості та програмні інтерфейси сучасних веб-браузерів.

Пререквізити та постреквізити дисципліни (місце в структурно-логічній схемі навчання за відповідною освітньою програмою)

Пререквізити: вміти користуватися комп’ютером на рівні адміністратора, вміти використовувати інструменти командного рядка, вміти програмувати на популярних мовах програмування, вміти проектувати інформаційні системи, зокрема з використанням UML діаграм.

Постреквізити: проектування та реалізація веб-застосунків з багатофункціональними інтерфейсами.

Після проходження дисципліни студенти зможуть проектувати, розробляти та впроваджувати веб-застосунки з багатофункціональним інтерфейсом на основі сучасних інструментальних засобів та з використанням перспективних можливостей веб-браузерів. Встановлювати та налаштовувати інструментальний конвеєр засобів front-end розробки. Реалізовувати веб-застосунки з використанням засобів Angular, React, Vue.

Зміст навчальної дисципліни

Очна форма

Лекційні заняття

Розділ 1. Сучасні підходи та технології front-end розробки

Розділ 2. Встановлення та налаштування інструментальних засобів front-end розробки

Розділ 3. Використання бібліотек/фреймворків Angular, React, Vue

Розділ 4. Перспективні можливості та програмні інтерфейси сучасних веб-браузерів.

Лабораторні заняття

1. Мови HTML, CSS, JavaScript, TypeScript.

2. Встановлення інструментальних засобів npm, webpack та інших..

3. Розробка на основі фреймворку Angular.

4. Розробка на основі фреймворку/бібліотеки React.

5. Розробка на основі фреймворку/бібліотеки Vue.

6. Робота з даними та станом в front-end застосунках.

7. Використання можливостей та програмних інтерфейсів сучасних веб-браузерів.

Навчальні матеріали та ресурси

Базова література

  1. Marijn Haverbeke. Eloquent JavaScript, 3rd Edition: A Modern Introduction to Programming — No Starch Press, 2018. — 472 p. Also available online https://eloquentjavascript.net/

  2. David Flanagan. JavaScript: The Definitive Guide: Master the World's Most-Used Programming Language. — 7th Edition — O'Reilly Media, 2020. —706 p.

  3. Boris Cherny. Programming TypeScript: Making Your JavaScript Applications Scale. — O'Reilly Media, 2019. — 324 p.

  4. Aristeidis Bampakos, Pablo Deeleman. Learning Angular: A no-nonsense beginner's guide to building web applications with Angular 10 and TypeScript. — 3rd Edition — Packt Publishing, 2020. — 430 p.

  5. Alex Banks, Eve Porcello. Learning React: Modern Patterns for Developing React Apps. — 2nd Edition O'Reilly Media, 2020. — 310 p.

  6. Heitor Ramon Ribeiro. Vue.js 3 Cookbook: Discover actionable solutions for building modern web apps with the latest Vue features and TypeScript. — Packt Publishing , 2020. — 562 p.

Допоміжна література

  1. Jon Duckett. Web Design with HTML, CSS, JavaScript and jQuery Set. — Wiley, 2014. — 1152 p.

  2. MDN web docs. https://developer.mozilla.org

  3. Angular. https://angular.io/

  4. React. https://reactjs.org/

  5. Vue.js. https://vuejs.org/

Навчальний контент

Методика опанування навчальної дисципліни (освітнього компонента)

Очна форма

Лекційні заняття

№ з/п Назва теми лекції та перелік основних питань
(перелік дидактичних засобів, посилання на літературу та завдання на СРС)
1

Тема 1.1. Структура та зміст курсу. РСО.

Тема 1.2. Загальні поняття дисципліни. Сучасні підходи та технології front-end розробки.

Тема 1.3. Мови HTML, CSS, JavaScript

Лекція 1. Вступ. Загальні поняття. Сучасні підходи та технології front-end розробки.

Структура курсу Front-end-розробка, РСО. Загальні поняття front-end розробки. Місце front-end розробки в веб розробці та розробці сучасних інформаційних проектів. Підходи та популярні технології front-end розробки. Мови HTML, CSS, JavaScript.

Література: [1], [2], [7]

Завдання на СРС. Порівняння технологій front-end розробки. Приклади веб-сайтів та веб-застосунків, що використовують цікаві можливості веб-інтерфейсу. Порівняння веб розробки, мобільної розробки, desktop розробки

2

Тема 2.1. Встановлення та налаштування інструментальних засобів front-end розробки.

Тема 3.1. Використання фреймворку Angular

Лекція 2. Встановлення та налаштування інструментальних засобів front-end розробки. Фреймворк Angular.

Поняття інструментального конвеєра (toolchain) для front-end розробки. Популярні засоби: Node.js, npm, webpack, Gulp та інші. Мова TypeScript. Фреймворк Angular – архітектура, основні компоненти, можливості.

Література: [1], [3], [4], [9]

Завдання на СРС. Порівняння інструментальних засобів front-end розробки з іншими засобами розробки. Аналоги та альтернативи популярних засобів. Порівняння мов JavaScript та TypeScript. Додаткові можливості Angular. Еволюція від Angular 1.x до сучасних версій Angular, та її причини.

3

Тема 3.2. Використання фреймворку/бібліотеки React

Тема 3.3. Використання фреймворку/бібліотеки Vue

Тема 3.4. Засоби для роботи з даними та станом front-end застосунків.

Лекція 3. Розробка на основі React та Vue. Засоби для роботи з даними та станом.

Бібліотека/фреймворк React. Основні можливості, архітектура компонентів. Мова JSX. Бібліотека/фреймворк Vue. Засоби для роботи з даними та станом redux, mobx.

Література: [3], [5], [6], [10], [11]

Завдання на СРС. Порівняння можливостей сучасних бібліотек/фреймворків front-end розробки. Аналоги та альтернативи. Мова Elm та бібліотеки на її основі. Можливість використання Vue замість jQuery, порівняння їх можливостей.

4

Тема 4.1. Перспективні можливості та програмні інтерфейси сучасних веб-браузерів

Лекція 4. Перспективні можливості та програмні інтерфейси сучасних веб-браузерів.

Сучасні стандарти веб-технологій. Підтримка в різних версіях браузерів. Підтримка мультимедійних можливостей: canvas, audio, video. Local storage. Web sockets. Web workers. Web components. Інші перспективні технології.

Література: [1], [2], [7],[8].

Завдання на СРС. Порівняння моделей розробки та можливостей, доступних в сучасних веб-браузерах, з бібліотеками/фреймворками для front-end розробки.

Лабораторні заняття

Назва лабораторної роботи Кількість ауд. годин
1

Лабораторна робота 1. Дизайн та розробка веб-сторінки.

Необхідно реалізувати прототип веб-інтерфейсу з використанням засобів HTML, CSS, JavaScript. Результатом виконання даної лабораторної роботи є працюючий прототип, розгорнутий з використанням GitHub Pages, а також звіт про використані технології та можливості

Література: [1], [2], [7], [8]

4
2

Лабораторна робота 2. Налаштування інструментального конвеєра front-end розробки.

Необхідно встановити та налаштувати інструментальні засоби для front-end розробки. Результатом виконання даної лабораторної роботи є docker-образ з встановленими інструментальними засобами, а також звіт про використані технології та можливості

Література: [1], [2], [7], [8]

2
3

Лабораторна робота 3. Розробка на основі фреймворку Angular.

Розробити повноцінний веб-застосунок на основі прототипу з лабораторної роботи №1, використовуючи засоби Angular. Результатом виконання даної лабораторної роботи є працюючий застосунок, розгорнутий на загальнодоступному веб-сервері, а також звіт про використані технології та можливості

Література: [3], [4], [9].

6
4

Лабораторна робота 4. Розробка на основі фреймворку/бібліотеки React.

Розробити повноцінний веб-застосунок на основі прототипу з лабораторної роботи №1, використовуючи засоби React. Результатом виконання даної лабораторної роботи є працюючий застосунок, розгорнутий на загальнодоступному веб-сервері, а також звіт про використані технології та можливості.

Література: [5], [10]

6
5

Лабораторна робота 5. Розробка на основі фреймворку/бібліотеки Vue.

Розробити повноцінний веб-застосунок на основі прототипу з лабораторної роботи №1, використовуючи засоби Vue. Результатом виконання даної лабораторної роботи є працюючий застосунок, розгорнутий на загальнодоступному веб-сервері, а також звіт про використані технології та можливості, включно з порівнянням різних бібліотек/фреймворків, використаних в лабораторних роботах №№3, 4, 5.

Література: [6], [11]

6
6

Лабораторна робота 6. Робота з даними та станом в front-end застосунках.

На основі одного із застосунків, розроблених в лабораторних роботах №№3, 4, 5, реалізувати більше функціональності щодо обробки даних та переходів між станами з використанням засобів redux та mobx. Результатом виконання даної лабораторної роботи є працюючий застосунок, розгорнутий на загальнодоступному веб-сервері, а також звіт про використані технології та можливості.

Література: [1], [3]

6
7

Лабораторна робота 7. Використання можливостей та програмних інтерфейсів сучасних веб-браузерів.

Необхідно реалізувати прототип веб-застосунку з використанням сучасних можливостей та технологій, доступних у веб-браузері. Результатом виконання даної лабораторної роботи є працюючий прототип, розгорнутий з використанням GitHub Pages, а також звіт про використані технології та можливості, зокрема порівняння підтримки використаних технологій в різних браузерах

Література: [1], [7], [8]

6

Самостійна робота студента/аспіранта

Очна форма

№ з/п

Назва теми, що виноситься на самостійне опрацювання Кількість годин СРС
1 Порівняння технологій front-end розробки. 4
2 Приклади веб-сайтів та веб-застосунків, що використовують цікаві можливості веб-інтерфейсу. 8
3 Порівняння веб розробки, мобільної розробки, desktop розробки. 6
4 Порівняння інструментальних засобів front-end розробки з іншими засобами розробки. 8
5 Аналоги та альтернативи популярних засобів. 10
6 Порівняння мов JavaScript та TypeScript. 6
7 Додаткові можливості Angular. 8
8 Еволюція від Angular 1.x до сучасних версій Angular, та її причини. 4
9 Порівняння можливостей сучасних бібліотек/фреймворків front-end розробки. 8
10 Аналоги та альтернативи сучасних бібліотек/фреймворків front-end розробки. 6
11 Мова Elm та бібліотеки на її основі. 6
12 Можливість використання Vue замість jQuery, порівняння їх можливостей. 4
13 Порівняння моделей розробки та можливостей, доступних в сучасних веб-браузерах, з бібліотеками/фреймворками для front-end розробки. 10
14 Підготовка до заліку по всьому матеріалу модуля. 18

**
**

Політика та контроль

Політика навчальної дисципліни (освітнього компонента)

Система вимог, які ставляться перед студентом:

  • відвідування лекційних та лабораторних занять є обов’язковою складовою вивчення матеріалу;

  • на лекції викладач користується власним презентаційним матеріалом; відпрацьовує практичну частину з використанням встановлених інструментальних засобів; використовує Google Drive для викладання матеріалу поточної лекції, додаткових ресурсів, лабораторних робіт та інше; викладає код розглянутих прикладів в репозиторій на GitHub; викладач відкриває доступ до певної директорії Google Drive для скидання електронних лабораторних звітів та відповідей на МКР;

  • лабораторні роботи захищаються у два етапи – перший етап: студенти виконують завдання на допуск до захисту лабораторної роботи; другий етап – захист лабораторної роботи. Бали за лабораторну роботу враховуються лише за наявності електронного звіту;

  • модульні контрольні роботи пишуться на лабораторних заняттях; результат пересилається у файлі до відповідної директорії Google Drive;

  • заохочувальні бали виставляються за: активну участь на лекціях; участь у факультетських та інститутських олімпіадах з навчальних дисциплін, участь у конкурсах робіт, підготовка оглядів наукових праць; презентацій по одній із тем СРС дисципліни тощо. Кількість заохочуваних балів не більше 10;

  • штрафні бали виставляються за: невчасну здачу лабораторної роботи. Кількість штрафних балів не більше 10.

Види контролю та рейтингова система оцінювання результатів навчання (РСО) (очна форма)

Рейтинг студента з дисципліни складається з балів, що він отримує за:

  1. виконання контрольних робіт (2 експрес-контрольні на лабораторних заняттях);

  2. виконання та захист 7 лабораторних робіт;

  3. виконання 2 модульних контрольних робіт (МКР);

  4. заохочувальні та штрафні бали.

Система рейтингових балів та критерії оцінювання

Експрес-контрольні роботи:

«відмінно» – повна відповідь (не менше 90% потрібної інформації) – 5 балів;

«добре» – достатньо повна відповідь (не менше 75% потрібної інформації) або повна відповідь з незначними недоліками – 3-4 бали;

«задовільно» – неповна відповідь (не менше 60% потрібної інформації) та незначні помилки – 1-2 бали;

«незадовільно» – відповідь не відповідає вимогам до «задовільно» – 0 балів.

Лабораторні роботи:

«відмінно», повна відповідь на питання під час захисту (не менш ніж 90% потрібної інформації) та оформлений належним чином електронний протокол до лабораторної роботи – 10 балів;

«добре», достатньо повна відповідь на питання під час захисту (не менш ніж 75% потрібної інформації) та оформлений належним чином електронний протокол до лабораторної роботи – 8-9 балів;

«задовільно», неповна відповідь на питання під час захисту (не менш ніж 60% потрібної інформації), незначні помилки та оформлений належним чином електронний протокол до лабораторної роботи – 6-7 балів;

«незадовільно», незадовільна відповідь та/або не оформлений належним чином електронний протокол до лабораторної роботи – 0-5 балів.

За кожне заняття запізнення з поданням лабораторної роботи до захисту від встановленого терміну оцінка знижується на 2 бали.

Модульні контрольні роботи:

«відмінно», повна відповідь (не менш ніж 90% потрібної інформації) – 10 балів;

«добре», достатньо повна відповідь (не менш ніж 75% потрібної інформації), або повна відповідь з незначними помилками – 8-9 балів;

«задовільно», неповна відповідь (але не менш ніж 60% потрібної інформації) та незначні помилки – 6-7 балів;

«незадовільно», незадовільна відповідь (неправильний розв’язок задачі), потребує обов’язкового повторного написання в кінці семестру – 0-5 балів.

Заохочувальні бали

– за виконання творчих робіт з кредитного модуля (наприклад, участь у факультетських та інститутських олімпіадах з навчальних дисциплін, участь у конкурсах робіт, підготовка оглядів наукових праць тощо); за активну роботу на лекції (питання, доповнення, зауваження за темою лекції, коли лектор пропонує студентам задати свої питання) 1-2 бали, але в сумі не більше 10;

– презентації по СРС – від 1 до 5 балів.

Міжсесійна атестація

За результатами навчальної роботи за перші 7 тижнів максимально можлива кількість балів – 55 балів (3 лабораторні, МКР-1, 1 експрес-контрольна). На першій атестації (8-й тиждень) студент отримує «зараховано», якщо його поточний рейтинг не менший ніж 33 бали.

За результатами 13 тижнів навчання максимально можлива кількість балів – 80 балів (5 лабораторних, МКР-2, 2 експрес-контрольні). На другій атестації (14-й тиждень) студент отримує «зараховано», якщо його поточний рейтинг не менший ніж 48 балів.

Максимальна сума вагових балів контрольних заходів протягом семестру складає:

RD = 7*rлаб+2*rмкр+2*rек + (rз - rш)=7*10+2*10+2*5+ (rз - rш)=100 + (rз - rш),

де rлаб – бал за лабораторну роботу (0…10);

rмкр – бал за написання МКР (0…10);

rек – бал за написання експрес-контрольної роботи (0…5);

rз – заохочувальні бали за активну участь на лекціях, презентації, участь в олімпіадах, конкурсі роботи, наукові роботи за тематикою дисципліни (0…10);

rзш – штрафні бали.

Залік:

Умовою допуску до заліку є зарахування всіх лабораторних робіт, написання обох модульних контрольних робіт та стартовий рейтинг не менше 40 балів.

Студенти, які виконали умови допуску і отримали RD ≥ 60 , отримують відповідну до набраного рейтингу оцінку без додаткових випробувань.

Студенти, які виконали умови допуску і отримали 40<RD<60, складають залікову контрольну роботу (або проходять залікову співбесіду) на останньому за розкладом занятті з дисципліни в семестрі.

Сума стартових балів та балів за залік переводиться до загальної оцінки згідно з таблицею:

Таблиця 1. Переведення рейтингових балів до оцінок за університетською шкалою

Кількість балів Оцінка
100-95 Відмінно
94-85 Дуже добре
84-75 Добре
74-65 Задовільно
64-60 Достатньо
Менше 60 Незадовільно

Є не зараховані лабораторні роботи або

не зарахована модульна контрольна робота

Не допущено

Додаткова інформація з дисципліни (освітнього компонента)

  • передбачена можливість закривати частину лабораторного та лекційного матеріалу шляхом здобування сертифікатам по online курсам (наприклад, COURSERA) відповідних розділів та тем дисципліни;

  • перелік теоретичних питань, які виносяться на семестровий контроль наведено в Додатку 1;

  • на початку семестру викладач аналізує існуючі курси по тематиці дисципліни та пропонує пройти відповідні безкоштовні курси студентам. Після отриманням студентом сертифікату проходження дистанційних чи онлайн курсів за відповідною тематикою, викладач закриває відповідну частину курсу (лабораторні чи лекції) за попередньою домовленістю з групою.

Робочу програму навчальної дисципліни (Силабус):

Складено к.ф.-м.н., Жереб Костянтин Анатолійович

Ухвалено кафедрою АУТС (протокол № 1 від 27.08.2020 р.)

Погоджено Методичною комісією факультету[1] (протокол № 1 від 02.09.2020 р.)

Додаток 1

Перелік теоретичних питань на залік

1. Поняття веб-застосунків.

2. Серверна (back-end) та клієнтська (front-end) частини веб-застосунків.

3. Взаємодія між back-end та front-end частинами веб-застосунків.

4. Протокол HTTP. Можливості, особливості, переваги та недоліки порівняно з іншими мережевими протоколами.

5. Компоненти веб-браузера. Rendering engine, script engine, інші можливості браузера.

6. Сучасні веб-браузери. Порівняння можливостей, стратегій розвитку.

7. Мова HTML. Призначення, особливості, порівняння з іншими мовами.

8. Теги HTML. Синтаксис, призначення, приклади використання.

9. Атрибути HTML. Синтаксис, призначення, приклади використання.

10. Мова CSS. Призначення, особливості, порівняння з іншими мовами.

11. Селектори CSS. Синтаксис, призначення, приклади використання.

12. Властивості CSS. Синтаксис, призначення, приклади використання.

13. Правила CSS. Синтаксис, призначення, приклади використання.

14. Пріоритети правил CSS.

15. Мова JavaScript. Призначення, особливості, порівняння з іншими мовами.

16. Основні конструкції мови JavaScript. Порівняння з іншими С-подібними мовами.

17. Особливості системи типів в JavaScript. Приведення типів. Порівняння з урахуванням типів.

18. Елементи об’єктно-орієнтованого програмування в JavaScript. Порівняння з іншими об’єктно-орієнтованими мовами.

19. Механізм прототипів. Використання для змін поведінки об’єктів. Питання безпеки.

20. Елементи функціонального програмування в JavaScript. Порівняння з іншими функціональними мовами.

21. Програмні інтерфейси (API) браузера. Інтерфейс DOM. Механізми пошуку елементів на сторінці.

22. Програмні інтерфейси (API) браузера. Інтерфейс DOM. Механізми доступу та модифікації властивостей елементів на сторінці.

23. Програмні інтерфейси (API) браузера. Інтерфейс DOM. Механізми додавання нових елементів на сторінці.

24. Програмні інтерфейси (API) браузера. Інтерфейс DOM. Механізми додавання та обробки подій в браузері.

25. Програмні інтерфейси (API) браузера. Засоби для взаємодії із зовнішніми веб-ресурсами. Інтерфейс XMLHttpRequest.

26. Програмні інтерфейси (API) браузера. Засоби для взаємодії із зовнішніми веб-ресурсами. Інтерфейс fetch.

27. Інструментальний конвеєр (toolchain) для front-end розробки.

28. Платформа Node.js. Засіб встановлення пакетів npm.

29. Інструментальний засіб webpack.

30. Інструментальний засіб gulp.

31. Інструментальні засоби для мінімізації коду.

32. Інструментальні засоби аналізу коду.

33. Інструментальні засоби тестування.

34. Препроцесори CSS. Засоби Less, Sass.

35. Front-end бібліотеки та фреймворки. Призначення, функціональність, приклади.

36. Прості бібліотеки на зразок jQuery. Функціональність, особливості, переваги та недоліки використання.

37. Front-end MVC фреймворки. Функціональність, особливості, переваги та недоліки використання.

38. Фреймворк Angular. Функціональність, особливості, переваги та недоліки використання.

39. Архітектура Angular. Основні компоненти, зв’язки між ними. Структура проєкту.

40. Мова TypeScript. Особливості, відмінності від JavaScript, переваги та недоліки використання.

41. Директиви Angular. Синтаксис, призначення, приклади використання.

42. Прив’язування властивостей в Angular. Синтаксис, призначення, приклади використання.

43. Прив’язування подій в Angular. Синтаксис, призначення, приклади використання.

44. Сервіси Angular. Синтаксис, призначення, приклади використання..

45. Модулі Angular. Синтаксис, призначення, приклади використання..

46. Фреймворк/бібліотека React. Функціональність, особливості, переваги та недоліки використання.

47. Архітектура React. Основні компоненти, зв’язки між ними. Структура проєкту.

48. Мова JSX. Особливості, відмінності від JavaScript та HTML, переваги та недоліки використання.

49. Компоненти React. Синтаксис, призначення, приклади використання.

50. Перехід від моделі до подання даних в React. Метод render(). Синтаксис, призначення, приклади використання.

51. Перехід від подання даних до моделі в React. Обробка подій. Синтаксис, призначення, приклади використання.

52. Робота з даними в React. State та props. Відмінності та способи використання.

53. Підхід Virtual DOM. Принципи функціонування, переваги та недоліки.

54. Фреймворк/бібліотека Vue. Функціональність, особливості, переваги та недоліки використання.

55. Архітектура Vue. Основні компоненти, зв’язки між ними. Структура проєкту.

56. Компоненти Vue. Синтаксис, призначення, приклади використання.

57. Необхідність обробки даних та стану в front-end застосунках.

58. Фреймворк/бібліотека redux. Функціональність, особливості, переваги та недоліки використання.

59. Фреймворк/бібліотека mobx. Функціональність, особливості, переваги та недоліки використання.

60. Можливості та стандарти сучасних веб-браузерів. Група технологій та стандартів HTML5

61. Робота з графікою. Елемент canvas. Функціональність, приклади використання.

62. Робота з мультимедіа елементами. Елемент audio. Функціональність, приклади використання.

63. Робота з мультимедіа елементами. Елемент video. Функціональність, приклади використання.

64. Засоби Local Storage. Функціональність, приклади використання.

65. Засоби Web Sockets. Функціональність, приклади використання.

66. Засоби Web Workers. Функціональність, приклади використання.

67. Засоби Web Components. Функціональність, приклади використання.

[1] Методичною радою університету – для загальноуніверситетських дисциплін.