Курс Front-end розробка

Online
Для начинающих
Frontend


Образовательный центр:	Beetroot Academy
Формат:	Курс
Язык обучения:	Ukrainian
Длительность обучения:	4 месяцев
Начало курса:	Дата формируется
Стоимость обучения:	Уточняйте

Подробности и регистрация

На курсі ти зможеш опанувати інструменти, що знаходяться на передовому рівні та використовувати останні стандарти веб-розробки. Під час навчання отримуватимеш практичні завдання над проєктами як в команді, так і самостійно, створиш кілька веб-сайтів і веб-застосунків, а також зможеш верстати сайти для мобільних пристроїв. Після завершення курсу, твоє портфоліо буде готовим для того, щоб зробити перші кроки в кар'єрі Front-End розробника.

Програма курсу

HTML & CSS

Вступний урок, знайомство
Що таке сайт. Налаштування робочого процесу. Вступ до HTML
Системи контролю версій Git та сервіс GitHub
Семантика, посилання і HTML5 теги
Figma для Front-End розробника
Побудова форм
Знайомство з CSS
CSS-селектори
Блокова модель документа (CSS Box Model)
Flexbox, Bootstrap
Вебшрифти, Font Face
CSS-позиціювання і трансформація
Масштабована векторна графіка (SVG)
Робота з пре- і постпроцесорами
(optional) Підходи до організації та архітектури CSS-коду: SMACSS або BEM
Респонсивний вебдизайн (RWD)
Респонсивна навігація
Адаптивна графіка
Система компонування в CSS (CSS Grid Layout)
CSS-анімації
Стилізація форм CSS
Практика - верстання макета
Проєкт 1. Перший вебсайт з HTML та CSS

JavaScript

Основи JavaScript
Типи даних та оператори
Цикли й умови
Події
Об’єкти
Document Object Model (DOM)
Масиви
Функції
Вебсховище
Знайомство з jQuery та плагінами Slick Slider/Swiper
Асинхронний JavaScript та XML (AJAX)
Проєкт 2. Архітектура - базовий вебсайт + JS

Front-end бібліотеки та плагіни

Gulp. Набір інструментів JavaScript з відкритим вихідним кодом. Знайомство з Webpack, пакетним модулем JavaScript з відкритим кодом
Класи
Класи. Наслідування
Знайомство з React
React state та props
React: Routing
List & Conditional rendering
React: Hooks
Stateful vs Stateless components. Forms, events. Popular libraries for React
Проєкт 3 - Responsive Website with JS
Презентація фінального проєкту
Випускний

Бонус: Навички роботи з ШІ для кар'єри майбутнього

Що таке штучний інтелект?
- Чому ШІ важливий?
- Що насправді означає ШІ та як він працює?
- Що може і чого не може ШІ?
Корисні інструменти та приклади використання:
- Deepl
- ChatGPT
- Bard
- Grammarly
- clipdrop.co
- Adobe Firefly
- Photoshop
- Perplexity.ai
Як використовувати ШІ для зручного пошуку роботи
- Сайти вакансій з елементами штучного інтелекту
- Покращення твого CV за допомогою ШІ
- Приклади ефективних резюме та супровідних листів
- Підготовка до інтерв'ю
Підбірка ШІ тулзів для пошуку роботи:
- Bard та ChatGPT
- Kickresume
- JobProfile.io
- Resumaker.ai
- Jobscan
- Yoodli
- Interviewsby.ai
- Interview Warmup
- Interviewing.io
Корисні матеріали, які допоможуть розширити та заглибитись в тему (статті, відео та безплатні курси)
Де варто/не варто використовувати ШІ?
Штучний інтелект: переваги, ризики та обмеження
Інструменти ШІ для веброзробників
Дослідження можливостей GitHub Copilot для Front-End
Створення додатка за допомогою Copilot та React

Бонус. English club

Під керівництвом викладача англійської
Фокус на розмовну англійську
Формування словникового запасу англійської для ІТ
Написання СV та підготовка до співбесіди в іноземній компанії
Поділ на групи відповідно до рівня:
- A1-A2
- A2-B1
- B1-B2/C

Бонус. Кар'єрне консультування

Навчишся створювати конкурентоспроможні резюме і супровідний лист та отримаєш на них фідбек від професійного рекрутера
Підготовка до інтерв'ю. Типові питання та підводні камені
Створиш зразковий профіль в LinkedIn
Дізнаєшся, де знаходити круті вакансії та як на них подаватися