Frontend Engineer
Опануйте повний стек навичок для роботи Junior Frontend Engineer і додайте 2 пет-проєкти у портфоліо.
Андрій Римарук
Senior JavaScript Frontend Developer in Welltech
Ex JavaScript Engineer у Ciklum
42 онлайн-заняття
[щовівторка та щочетверга]
Комплексна програма для опанування тонкощів фронтенд-інженерії. Отримаєте потрібний скілсет, аби орієнтуватися у Web Development, здійснювати серверний рендеринг, оптимізувати код і архітектуру вебзастосунків. У результаті зможете претендувати на позиції Frontend Developer/Engineer і створювати власні проєкти з нуля.
Фронтенд — це звʼязок між функціоналом сайту та його користувачем. Зручно, гарно та без багів — основні задачі розробника, які він розв'язує за допомогою CSS, HTML та JavaScript на базовому рівні. Але щоби розвиватися далі та пропонувати найбільш ефективні рішення, необхідно розбиратися в структурі коду та вміти його оптимізувати, працювати з патернами проєктування та використовувати різні типи рендерингу.
За 4 місяці на цьому курсі ви здобудете повний стек навичок для роботи Junior Frontend Engineer, щоб не тільки реалізовувати задум дизайнера «на автопілоті», а й осмислено пропрацьовувати архітектуру застосунків, які працюватимуть без багів за умов складного інтерактивного інтерфейсу.
Ознайомитеся з інструментами верстки сторінки (CSS/HTML) та принципами UI/UX-дизайну, щоб створювати макети з адаптивною сіткою, вправно працювати з текстом, кольором, фоном і розробляти зручні користувацькі інтерфейси.
Розберете всі аспекти мови JavaScript: від структури коду і базового синтаксису — до роботи з бібліотеками Redux і ReactJS. Навчитеся працювати з різними типами структур даних, маніпулювати масивами, створювати нові обʼєкти й будувати інтерактивні застосунки.
Вивчите патерни, які дозволяють ефективно розвʼязувати задачі проєктування ПЗ, і навчитеся застосовувати їх на практиці, щоб рефакторити власний код, спрощувати та пришвидшувати процес розробки.
Опануєте техніки для прискорення завантаження сторінок. Навчитеся «кешувати» дані, щоб зменшувати затримку обробки серверних запитів, і дізнаєтеся, як зробити так, щоб сторінки не «висли» від складного інтерактивного інтерфейсу.
Розробите роадмап професійного розвитку, отримаєте рекомендації щодо оформлення CV та професійного профілю в соцмережах. Отримаєте поради від лектора та рекрутера, які допоможуть пройти інтервʼю на позицію Junior Frontend Developer/Engineer.
- Розберете основні принципи роботи веббраузерів.
- Зрозумієте значення кросбраузерності та ознайомитеся з основними відмінностями в інтерпретації коду між ними.
- Ознайомитеся із задачами веброзробника, які пов'язані з роботою в клієнтській частині вебзастосунків.
- Зрозумієте принцип роботи з системою контролю версій Git та створите актуальний акаунт на github і репозиторій для роботи з курсом.
- Дізнаєтеся, як створювати структуру HTML-документа, включно з заголовком, тілом, розділами, абзацами, списками, формами тощо.
- Навчитеся використовувати семантичну розмітку.
- Дізнаєтеся, як застосовувати різні теги та атрибути для форматування тексту, створення посилань, вставки зображень та інших елементів.
- Навчитеся описувати template та перевикористовувати його зі slot.
- Вивчите основи синтаксису мови JavaScript.
- Навчитеся працювати з function, callbacks, prototype, а також із глобальними об'єктами document, window, navigator тощо.
- Дівзнаєтеся, що таке HTML5 API та його доступні різновиди.
- Навчитеся застосовувати кожен із запропонованих API на практиці.
- Отримаєте знання різних типів відображення, методів позиціювання тощо.
- Навчитеся працювати з текстом, кольором, фоном і технологією Flexbox.
- Навчитеся створювати макети зі статичною або адаптивною сіткою (layout anatomy).
- Розберетеся в принципах UI/UX-дизайну, щоб створювати просту та зручну для сприйняття розмітку вебзастосунку чи сайту.
- Навчитеся використовувати пакетний менеджер yarn для встановлення пакетних залежностей, додаткових бібліотек, модулів тощо.
- Навчитеся підключати SASS-препроцесор до проєкту, використовувати змінні, міксіни, цикли та інші функціональності SCSS.
- Дізнаєтеся, як виконується JavaScript у браузері, та зрозумієте основні принципи його інтерпретації.
- Навчитеся використовувати структуру коду, змінні, типи даних, оператори, цикли та функції.
- Дізнаєтеся, як здійснювати логічні порівняння та приймати рішення на основі результатів цих порівнянь.
- Навчитеся виконувати операції або обробку даних на основі визначених умов.
- Розберете всі етапи створення функції, в тому числі й ті, які можуть бути призупинені та відновлені під час виконання.
- Дізнаєтеся, як створювати та працювати з різними типами структур даних, зокрема з масивами (Array) та обʼєктами (Object).
- Навчитеся створювати багаторівневі структури даних.
- Працюватимете з різними структурами даних, навчитеся отримувати доступ до певних елементів або виконувати операції на різних рівнях структури.
- Навчитеся маніпулювати з масивами, використовуючи різні методи, зокрема push, pop, shift, unshift, splice тощо.
- Дізнаєтеся, як використовувати об'єкт Reflect для виконання різних операцій: наприклад, створення нових об'єктів, виклик методів, отримання та встановлення властивостей тощо.
- Дізнаєтеся, як розробити базове RESTful API, використовуючи різні HTTP-методи, та які UR-шаблони використовуються для маршрутизації запитів.
- Навчитеся використовувати Fetch API для відправлення HTTP-запитів з клієнтської сторони вебзастосунку, налаштувати заголовки запиту, передавати дані та обробляти відповіді.
- Навчитеся використовувати Promise для управління асинхронним кодом і async-await для зручного написання асинхронного коду.
- Дізнаєтеся, як налагоджувати мережеві запити за допомогою devTools.
- Розберете основні концепції ООП: класи, об'єкти, спадкування, поліморфізм, інкапсуляція.
- Навчитеся використовувати кожну концепцію на практиці.
- Вивчите основні патерни проєктування на JavaScript, які допомагають розробляти ефективний та підтримуваний код.
- Зрозумієте значення патернів у проєктуванні вебзастосунків.
- Ознайомитеся з принципами програмування.
- Навчитеся писати чистий та зрозуміли код на старті, щоб не розбиратися годинами в «брудному» коди потім.
- Зрозумієте, як чистий код і рефакторинг дозволяють економити час та ресурси на розробку.
- Вивчите типи вебрендерингу та навчитеся їх розрізняти.
- Навчитеся вибирати тип рендерингу залежно від ситуації.
- Ознайомитеся зі структурою React-застосунку та його основними компонентами.
- Навчитеся працювати з розширенням синтаксису JSX для опису інтерфейсу користувача.
- Дізнаєтеся, що таке хуки та як із ними працювати.
- Отримаєте практичний досвід створення Custom Hooks.
- Навчитеся працювати з react route.
- Розберетеся в глобальному та локальному контексті в ReactJS.
- Розглянете бібліотеку Redux для керування станом додатка.
- Отримаєте знання з Bootstrap та Tailwind CSS, щоб використовувати їх у розробці вебінтерфейсів.
- Отримаєте рекомендації щодо розробки SPA-застосунку на рівні реального вебзастосунку з використанням ReactJS.
- Навчитеся працювати з SCSS, CSR (Client-Side Rendering) та фреймворком Tailwind (або bootstrap).
- Розробите повноцінний single page application із керуванням стану та використанням css framework.
- Розберете принципи серверного рендерингу та можливості Next.js для побудови універсальних вебзастосунків.
- Зрозумієте особливості Data fetching: getServerSideProps, getStaticProps, getStaticPaths, та дізнаєтеся, для чого і коли використовувати кожен з них.
- Дізнаєтеся, як працювати з NextJS.
- Навчитеся описувати внутрішнє API для повернення JSON-даних із сервера.
- Навчитеся використовувати картинки на рівні SSR із Next.js, працювати з LazyLoading і кешуванням.
- Отримаєте практичні навички з розробки server-side application із використанням Next.JS.
- Навчитеся підключати фреймворки для стилізації за типом Tailwind і налаштовувати кастомні теми.
- Навчитеся працювати з маршрутизатором, кешуванням, SSR і CSR на практиці.
- Дізнаєтеся, як створювати git репозиторію з підключенням до системи деплоймента.
- Навчитеся налаштовувати деплоймент репозиторію з вебзастосунком на рівні Vercel.
- Навчитеся використовувати змінні через PullRequest у GitHub.
- Розумієте кожен етап створення вебзастосунку: від ідеї ― до деплойменту.
- Можете самостійно створити повноцінний вебзастосунок з нуля.
- Розробите план розвитку кар'єри в ІТ
- Дізнаєтесь, як шукати роботу на міжнародному ринку
- Напишете ефективне резюме та супровідний лист
- Підготуєтеся до інтерв'ю з рекрутером та hiring-менеджером
- Навчитеся вести переговори під час укладання job-офера