WEB – ОРІЄНТОВАНІ ТЕХНОЛОГІЇ. ОСНОВИ FRONTEND ТА BACKEND РОЗРОБОК (денна/заочна)

Силабус освітнього контенту

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

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

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

Силабус освітнього компонента «WEB-орієнтовані технології. Основи Frontend та Backend розробок » складено відповідно до освітньої програми підготовки бакалаврів «Інформаційні управляючі системи та технології» спеціальності 126 – Інформаційні системи та технології Метою навчальної дисципліни є формування та закріплення у студентів наступних компетентностей: (ЗК 1) Здатність до абстрактного мислення, аналізу і синтезу; (ЗК 2) Здатність застосовувати знання у практичних ситуаціях; (ЗК 6) Здатність до пошуку, оброблення та узагальнення інформації з різних джерел; (ФК 4) Здатність проєктувати, розробляти та використовувати засоби реалізації інформаційних систем, технологій та інфокомунікацій (методичні, інформаційні; (ФК 8 ) Здатність управляти якістю продуктів і сервісів інформаційних систем та технологій протягом їх життєвого циклу; (ФК 12) Здатність управляти та користуватися сучасними інформаційно-комунікаційними системами та технологіями (у тому числі такими, що базуються на використанні Інтернет).

Предмет навчальної дисципліни – це сукупність теоретичних знань, практичних вмінь та навичок проектування та розроблення Frontend та Backend розробок, що є основою у підготовці фахівців з інформаційних технологій для проектування та програмування WEB-орієнтованих застосувань у професійній діяльності.

Програмні результати навчання, на формування та покращення яких спрямована дисципліна: (ПРН 3) Використовувати базові знання інформатики й сучасних інформаційних систем та технологій, навички програмування, технології безпечної роботи в комп’ютерних мережах, методи створення баз даних та інтернет-ресурсів,технології розроблення алгоритмів і комп’ютерних програм мовами високогорівня із застосуванням об’єктно-орієнтованого програмування для розв’язаннязадач проєктування і використання інформаційних систем та технологій; (ПРН 5) Аргументувати вибір програмних та технічних засобів для створеннянформаційних систем та технологій на основі аналізу їх властивостей,призначення і технічних характеристик з урахуванням вимог до системи іексплуатаційних умов; мати навички налагодження та тестування програмних ітехнічних засобів інформаційних систем та технологій; (ПРН 6) Демонструвати знання сучасного рівня технологій інформаційних систем,практичні навички програмування та використання прикладних і спеціалізованихкомп’ютерних систем та середовищ з метою їх запровадження у професійнійдіяльності; (ПРН 18) Знати спеціалізовані мови та технології програмування необхідні для розробкипрограмного забезпечення інформаційних управляючих систем та технологійпідтримки прийняття рішень. Розробляти відповідне програмне забезпечення, щовходить до складу інформаційних управляючих систем та технологій підтримкиприйняття рішень

2. Пререквізити та постреквізити дисципліни

Для успішного засвоєння дисципліни студент повинен володіти освітніми компонентами «Програмування 1 - Основи програмування», «Програмування 2 – Структури даних та алгоритми», «Бази даних», «Інтернет технології та проєктування WEB-застосувань», «Розробка програмного забезпечення на платформі Node.JS», «Сучасні технології розробки WEB-застосувань на платформі Node.JS», «Основи Front-end технологій» . Компетенції, знання та уміння, одержані в процесі вивчення освітнього компонента є необхідними для подальшого вивчення освітніх компонентів «Основи WEB – технологій», «Сучасні технології розробки програмного забезпечення», передипломної практики, дипломного проєктування.

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

Розділ 1 Основи клієннських розробок. HTML-документ. Стильове оформлення елементів HTML-документу Тема 1.1 WEB-орієнтовані технології. Структура HTML-документу. Основні теги та атрибути. Структурна розмітка. Валідація коду. Тема1.2 Стильове оформлення елементів HTML-документу. Класифікація селекторів. Псевдокласи стану. CSS-змінні. Оформлення тексту. Псевдоелементи тексту. Тема1.3 Верстка HTML-документу за макетом. Типи макетів. Блокова модель. Геометрія елемента . Структурні псевдокласи. Flexible Box Layout (Flexbox). Тема1.4 Позиціонування елементів. Властивість z-index. Властивість overflow. Анімація. CSS-переходи. CSS-анімація. . Адаптивна верстка. Медіа-запити

Розділ 2. Програмне використання JavaScript у HTML-документах. Тема 2.1 Функціональне використання JavaScript у HTML-документах.. Змінні. Константи.Типи даних. Розгалудження та цикли в JavaScript. Методи масивів. Цикл for...of. Функції. Область видимості. Псевдомасив arguments. Тема 2.2 Об'єкт. Властивості об'єкта. Короткі властивості. Перебирання об'єкта. Цикл for...in. Методи об'єкта. Масив об'єктів. Операції spread і rest. Деструктуризація об'єктів Тема 2.3 Функції зворотного виклику (callback). Метод forEach. Стрілочні функції. Псевдомасив arguments. Стрілочні функції як колбеки. Перебираючі методи масиву. Ланцюжки методів Тема 2.4 Прототипи. Класи. Об'єктна модель документа (DOM). Властивості та атрибути. Події. Об'єкт події. Делегування подій. Throttle і Debounce Тема 2.5 Модульность коду. Node.js. Пакетний менеджер npm. Webpack. Формат JSON. WEB-сховище. Web Storage API. Локальне сховище. Сервіс для localStorage. Тема 2.6 Асинхронність. Проміси. Методи класу Promise Тема 2.7 HTTP-запити. REST API. AJAX. Крос-доменні запити. Пагінація. CRUD

Розділ 3 Створення інтерфейсів WEB-застосувань з використанням React Тема 3.1 Бібліотека React. Browser DOM і Virtual DOM. JSX. Компоненти. Нормалізація стилів. Події. Форми. Тема 3.2 Життєвий цикл. HTTP-запити. React хуки. Контекст та рефи. Маршрутизація. Вкладені маршрути. Індексні маршрути. Програмна навігація Тема 3.3 Бібліотека Redux. Redux Toolkit. Асинхронний Redux. Оптимізація селекторів. createAsyncThunk.

Розділ 4 Основи Backend розробок. Node.js. Тема 4.1 Модульна система Node.js. Робота з json-файлами.Створення консольного додатку. Основи Express. Тема 4.2 CRUD в Express. MongoDB та Mongoose. Тема 4.3 Схеми та методи Mongoose. Деплой на Heroku. Тема 4.4 Аутентифікація. Тести. Модульне тестування. Пошта. Docker. Вебсокети

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

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

1. HTML Підручник. w3schools.com. українською. https://w3schoolsua.github.io/html/index.html
2. HTML. Мова для створення веб-сторінок. w3schools.com. Українською. https://w3schoolsua.github.io/index.html#gsc.tab=0
3. HTML Довідник тегів. https://w3schoolsua.github.io/tags/index.html
4. CSS Підручник. w3schools.com. українською. https://w3schoolsua.github.io/css/index.html#gsc.tab=0
5. HTML.Language for creating web pages. W3Schools in English. https://w3schoolsua.github.io/index_en.html#gsc.tab=0
6. HTML Tutorial. https://w3schoolsua.github.io/html/index_en.html#gsc.tab=0
7. Підручники HTML та CSS. https://htmlbook.at.ua/news/tutorial_html/1-0-1
8. Learn to Code. With the world's largest web developer site. https://www.w3schools.com/

4.2. Допоміжна

1. Український веб-довідник. https://css.in.ua/
2. Довідник по HTML тегам https://css.in.ua/html/tags
3. Довідник HTML тегів https://html-css.co.ua/dovidnuk-html-tags/
4. HTML конструювання. http://htmlbook.in.ua/
5. http://htmlbook.in.ua/tegs-html/ 6.http://htmlbook.in.ua/pr01-html/ 7 CSS-TRICKS. GUIDES. ARTICLES. https://css-tricks.com/

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

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

Очна форма

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

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

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

Заочна форма навчання

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

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

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

Лабораторні самостійні заняття

Години заочної форми навчання:

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

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

Як викладач, так і студент зобов’язані дотримуватись Кодексу честі Національного технічного університету України «Київський політехнічний інститут» Основні положення політики:

• відвідування лекційних та лабораторних робіт є обов’язковою складовою вивчення матеріалу;
• під час проведення лекції, викладач користується власним презентаційним матеріалом з демонстрацією практичної частини на комп’ютері з встановленим інтегрованим середовищем розробки;
• всі матеріали поточної лекції, лабораторних та самостійних робіт, додаткових матеріалів, літератури розміщуються викладачем у середовищі Moodle.
• після виконання лабораторних та самостійних робіт, студенти розміщують посилання на них на Git Hub або у власній папці на гугл-диску або в Moodle;
• до кожної лабораторної роботи студенти виконують проміжний тест, оцінка за який входить до складу загальної оцінки за лабораторну роботу;
• на лекції бажано не відволікати викладача від викладання матеріалу. Усі питання, уточнення та ін. студенти задають в кінці лекції у відведений для цього час;
• у випадку виявлення факту академічної недоброчесності лабораторна або самостійна робота не зараховується;
• заохочувальні бали виставляються за: участь у факультетських та інститутських олімпіадах з навчальних дисциплін, участь у конкурсах з ІТ-технологій, підготовка оглядів наукових праць, ; презентацій по одній із тем СРС дисципліни тощо. Кількість заохочуваних балів не більше 10;
• штрафні бали виставляються за: невчасну здачу лабораторної та самостійної робіт. Кількість штрафних балів не більше 10.

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

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

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

Семестровий контроль - ЗАЛІК

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

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

Вагові бали кожної лабораторної роботи наведені у Таблиці 1. Сумарний ваговий бал за даний контрольний захід складає 63 балів. Критерії оцінювання лабораторних робіт включають якість їх виконання та захист.

Таблиця 1 – Вагові бали та критерії оцінювання лабораторних робіт

Кожна лабораторна робота оцінюється максимальною оцінкою в 4 бали за:

Виконання --- 2 бала Захист ЛР --- 3 бала (тест)
Звітний HTML-документ --- 2 бала де,
“відмінно”, повна відповідь (не менше 95% потрібної інформації); --- 6,65- 7 балів; “добре”, достатньо повна відповідь (не менше 75% потрібної інформації, або незначні неточності) --- 4,98 -6,64 балів; “задовільно”, неповна відповідь (не менше 60% потрібної інформації та деякі помилки) --- 2,98 - 4,97бали; “незадовільно”, незадовільна відповідь. --- < 2,98 балів/

Максимальна сумарна оцінка за 9 лабораторних робіт --- 63 балів

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

Кожна модульна контрольна робота оцінюється максимальною оцінкою в 18,5 балів де, “відмінно”, повна відповідь (не менше 95% потрібної інформації): --- 12,02 - 18,5 балів; “добре”, достатньо повна відповідь (не менше 75% потрібної інформації, або незначні неточності); --- 9,01 - 12,01 балів; “задовільно”, неповна відповідь (не менше 60% потрібної інформації та деякі помилки); --- 5,41 - 9,00 бали; “незадовільно”, незадовільна відповідь. --- < 5,41 балів

Максимальна сумарна оцінка за модульні контрольні роботи --- 37 балів Модульні контрольні виконуються у вигляді тестів

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

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

7.3 Штрафні бали

За кожне заняття запізнення з поданням лабораторної до захисту від встановленого терміну оцінка знижується на 0,5 бал. При наяності довідки або інших вагомих причин – бали не знімаються

7.4 Умови позитивної проміжної атестації

Для отримання “зараховано” з першої проміжної атестації (8 тиждень) студент повинен мати не менше ніж 24 бали (за умови, якщо на початок 8 тижня згідно з календарним планом контрольних заходів “ідеальний” студент має отримати 44 балів). Для отримання “зараховано” з другої проміжної атестації (14 тиждень) студент повинен мати не менше ніж 36 балів (за умови, якщо на початок 14 тижня згідно з календарним планом контрольних заходів “ідеальний” студент має отримати 60 балів).

7.5 Розрахунок шкали рейтингу R_D:

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

Необхідною умовою отримання залікової оцінки є:

• виконання 9 лабораторних робіт на оцінку не нижче ніж “задовільно” +звітний документ ;
• виконання МКР не нижче ніж на оцінку “задовільно”.

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

Таблиця 2 – Таблиця відповідності рейтингових балів оцінкам за університетською шкалою

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

Робочу програму навчальної дисципліни (силабус): Складено ст.викладачем Проскурою Світланою Леонідівною Ухвалено Кафедрою ІСТ протокол № 16 від 12.06.24 Погоджено Методичною комісією факультету протокол № 10 від 21.06.24