#01. World Wide Web (Frontend/Backend)
Дві програми беруть участь у роботі World Wide Web — браузер і веб-сервер. Frontend’ом називають ті процеси, які відбуваються в браузері, а Backend’ом — процеси на стороні веб-сервера. Наше завдання розібратися, які можливості та інструменти є у веб-розробника та які завдання перед ним стоять. А також ми навчимося працювати з хостингом (розміщенням сайтів в Інтернеті) для запуску своїх проектів у мережі та доменними іменами.
#02. Верстання сторінок (HTML 5.2 & CSS 3)
Все, що нам показує браузер описується кодом. Кодом на мові HTML — який говорить браузеру з яких елементів складається сторінка і коду на мові CSS — завдяки якому браузер дізнається як візуально ці елементи оформити. Версткою називають процес написання HTML та CSS коду. Для написання та роботи з кодом ми будемо використовувати сучасний редактор коду Microsoft Visual Studio Code. А також ми опануємо технології CSS Box Model, Flexbox, CSS Grid та інші.
#03. Адаптивна верстка (Адаптивність)
Сьогодні будь-яка веб-сторінка повинна бути гнучкою, добре виглядати і залишатися зручною
для користувача, і не важливо на якому екрані сторінка відображається, на смартфоні, на моніторі домашнього
комп’ютера або на екрані SmartTV. Верстка сторінок, що адаптуються до розміру екрана, — вимога сучасності та
цієї теми приділено особливу увагу. Ми освоїмо такі інструменти та технології адаптивності як медіа-запити
(media-queries), інструменти розробка (Chrome DevTools) та емулятор мобільних пристроїв.
#04. Bootstrap 5
Ознака професіоналізму — вміння отримати результат застосовуючи в роботі готові сторонні
рішення. Веб-розробка не є винятком. CSS-бібліотека Bootstrap — стандарт де-факто у верстці. Компоненти
бібліотеки — зручні будівельні блоки, які застосовуються у величезній кількості проектів по всьому світу. А
Bootstrap Grid — одна з найпоширеніших технік розміщення елементів на сторінці. Вміння працювати з
бібліотекою Bootstrap — без чого немислимий сучасний веб-розробник/верстальник.
#05. CSS Анімація (Анімаційні ефекти)
Анімація та анімаційні ефекти стали вже звичними на сторінках веб-сайтів. Ми освоїмо два
підходи до побудови анімації, а саме: анімацію переходів (CSS Transition) та анімацію ключових кадрів за
сценарієм (CSS Animation).
#06. Google Fonts & Font Awesome
Типографіка — мистецтво оформлення друкованого тексту. Розуміння принципів роботи з
оформленням текстом та шрифтами та вміння їх застосовувати в роботі – відмінна риса професіоналів. Ми
навчимося працювати з базою шрифтів Google Fonts та задіяти при вирішенні завдань верстки. А також
познайомимося із популярною бібліотекою векторних іконок FontAwesome 5.
#07. JavaScript
Якщо з HTML & CSS можна описати, що є на сторінці і як це буде виглядати, будь-які дії
які користувач виконує на сторінці це завдання для JavaScript. Від найпростіших віджетів до ігор у браузері
все це зона відповідальності мови програмування JavaScript.
#08. Основи програмування на JavaScript
JavaScript — мова програмування. Завдання будь-якої мови
програмування — керувати діями комп’ютера, і нам
необхідно ґрунтовно розібратися в базових концепціях та
принципи мов програмування. Розібрати етапи створення
програмного забезпечення, від складання алгоритму, до
тестування написана програма. Ця частина курсу буде корисною
не тільки для освоєння мови JavaScript, але й для подальшого вивчення
будь-якої іншої мови програмування.
#09. Валідація та обробка даних користувача
Завдання будь-якої програми — обробка даних користувача (будь це веб-додаток, мобільний
додаток або навіть додаток для Windows). В рамках курсу ми розберемо такі завдання, як: організація введення
даних користувачем. Перевірку даних на коректність — Валідацію
даних. І застосування (обробка) даних користувача у роботі веб-програми. Також ми познайомимося
з такою технологією як Регулярні Вирази (Regular Expressions).
#10. SEO/SMO оптимізація
Пошукові системи (Google) та соціальні мережі (Facebook, Instagram etc)
основне джерело відвідувачів, а отже, і прибутку для сайту.
Здавалося б, просування сайту це завдання маркетолога, але є і
технічні аспекти, в яких розробник повинен орієнтуватися,
щоб Google, Facebook та ін. наводили відвідувачів на сайт.
#11. Процес розробки
Як і в будь-якому виробництві розробка сайту включає
безліч етапів, незалежно від того, на чому спеціалізується
людина йому необхідно бачити та розуміти всю картину. Знання
отримані в цьому розділі дозволять не забути ні про що важливо.
створення та розвиток web-сайтів.
#12. Git / GitHub
GitHub — найбільший сервіс для
розміщення коду IT-проектів та спільної роботи над ним. Навички роботи з GitHub, сьогодні необхідні будь-кому, хто працює в сфері IT. В рамках
заняття ми дізнаємося та освоїмо як працювати з кодом у репозиторіях, як вносити зміни та які можливості нам
надає система контролю версій Git та сервіс хостингу репозиторіїв GitHub.
