Курс HTML5/CSS3/JavaScript основи

План курсу

Вступ до курсу

Розуміння взаємодії веб-браузерів та веб-серверів. Представляємо інструменти: Інструменти розробника веб-браузера, засоби прототипування веб-сторінок, IDE, робота з GitHub.

HTML

Структура документа HTML, пари тегів, елемент, посилання, вкладеність, перевірка HTML, нові та застарілі теги в HTML, основи зображень, відео та аудіо, додавання карти, створення форми з відправкою на email. Командна робота над проєктом в GitHub.

Основи CSS

Додавання CSS на веб-сторінку, селектори та їх специфічність, приєднання шрифтів, вбудований та блок-потік, позиціонування CSS, стилі браузера за замовчуванням та їх очищення.

Практикум з верстки в CSS

Модель FlexBox та Grid. Медіа-запити. Створення типової сторінки з адаптивною версткою.

CSS-фреймворки. Bootstrap and Tailwind

Введення до CSS-фреймворків, приєднання їх до сторінки та створення типових елементів веб-сторінки.

Поглиблений CSS

Поглиблені теми в CSS, анімація, трансформація. Створення анімованого бургер-меню.

Вступ до JavaScript

Додавання JavaScript на веб-сторінку, коментарі, типи даних, оголошення змінних, перетворення типів, функції, умови, тернарний оператор.

Цикли та масиви в JavaScript

Цикли, масиви та їх методи, анонімні та стрілкові функції.

Робота з об'єктами в JavaScript

Об'єкти, різні способи їх створення, JSON, прототипне наслідування, класи.

Робота з DOM та BOM в JavaScript

Вступ до BOM/DOM, пошук елементів на DOM, модифікація DOM, встановлення обробників подій, створення динамічних елементів (карусель елементів та ін.).

Взаємодія з сервером та основи NodeJS

Основи асинхронного програмування в JavaScript. Використання Fetch для відправки та отримання даних з сервера. Використання NodeJS для створення простого сервера. Доступ до API, у тому числі Open AI для штучного інтелекту.

Інтернет-магазин

Створення простого, але повнофункціонального інтернет-магазину (завантаження списку товарів з бекенду, збереження товарів в корзині, виведення інформації про товар в модальному вікні, відправка замовлення на email).

Бонусний модуль. Вступ до React та NextJS

Перші кроки до створення додатків з React/NextJS.

Після закінчення курсу ти вмієш:

• Створювати коректну розмітку HTML-сторінки і перевіряти її за допомогою валідатора
• Писати селектори в CSS
• Створювати CSS-стилі, зокрема для верстки сторінки з використанням FlexBox та CSS Grid Layout та підтримкою responsive і візуальних ефектів
• Створювати JavaScript-код для вирішення типових задач клієнтського веб-програмування
• Структурувати і проектувати JavaScript-код з використанням функцій та об'єктів, обирати та створювати коректні колекції даних, а також оформлювати код відповідно до Google JavaScript Style Guide
• Інтегрувати JavaScript і HTML, зокрема знати різні варіанти включення JavaScript до HTML, а також задання обробників подій, створення HTML-форм, побудова і використання регулярних виразів у JavaScript і HTML
• Здійснювати пошук помилок за допомогою вбудованого відладчика у браузері, моніторити використання ресурсів, користуватися консоллю для виводу інформації
• Використовувати бібліотеку jQuery для маніпуляції елементами DOM, створення базових ефектів та виконання Ajax-запитів
• Створювати і виконувати Ajax/Fetch-запити, використовувати формати XML і JSON для передачі даних
• Використовувати Git для збереження версій проєкту і публікації сайту на GitHub

Особливості курсу

• Не потрібно розтягувати навчання на роки: опанувати основи HTML, CSS i JavaScript можна за лічені тижні
• Це базовий курс, проходження якого дозволить прискоритись у вивченні інших мов програмування, що використовуються у Web, зокрема C#, Python чи Java
• Доступний кожному: вивчення HTML5, CSS3 i JS не потребує надзусиль чи додаткових знань з комп'ютерних наук
• Знаючи HTML5, CSS3 i JS, ти легко налагодиш взаємодію з веб-дизайнерами чи девелоперам
• HTML/CSS/JS - це комплект із трьох мов, які розуміють усі веб-браузери (Safari, Firefox, and Google Chrome та ін.)
• HTML, CSS і JS дозволять тобі створювати сучасні, адаптовані для мобільних пристроїв та десктопів веб-сайти з високим рівнем SEO-оптимізації
• Підтримка ментора впродовж навчального процесу
• Підсилення твого CV
• Доступ до додаткових е-курсів для навчання у власному темпі
• Онлайн-курси за рівнем англійської та Speaking Club

Викладачі курсу

Vyacheslav Koldovskyy - 20 років професійного досвіду в ІТ