Що таке frontend?
Frontend — це частина сайту або застосунку, яка виконується у браузері користувача: верстка, стилі, анімації та вся логіка інтерфейсу. Усе, що людина бачить і з чим взаємодіє, — зона відповідальності фронтенду.
Базовий набір фронтенд-розробника — HTML, CSS і JavaScript, поверх яких працюють фреймворки на кшталт React, Vue чи Angular. До них додаються адаптивна верстка під різні екрани, доступність, оптимізація швидкості завантаження та робота з макетами дизайнера.
Фронтенд отримує дані від бекенду й відображає їх, а дії користувача надсилає назад на сервер. Зовні це виглядає як один застосунок, але за екраном — дві різні системи, що спілкуються через API.
Де застосовується
Фронтенд-розробник забирає макет із Figma і перетворює його на робочий інтерфейс: верстає сторінки, підключає дані з API, обробляє форми й помилки, домагається однакової поведінки в різних браузерах і на різних екранах. У продуктовій команді він працює пліч-о-пліч із дизайнером, бекендером і QA.
Вакансії діляться приблизно на три групи. Лендинги та корпоративні сайти — тут цінують швидкість верстки й увагу до деталей. Вебзастосунки на React чи Vue — особисті кабінети, панелі керування, CRM. І окремий шар — оптимізація: швидкість завантаження та Core Web Vitals, від яких напряму залежить позиція сайту в пошуку і конверсія.
Приклад
Користувач натискає «Показати ще» в каталозі. Фронтенд надсилає запит за наступною сторінкою товарів, поки триває відповідь — показує скелетон замість карток, при помилці мережі виводить повідомлення з кнопкою «Повторити». Сервер при цьому віддав лише дані, все інше — робота фронтенду.
Часті запитання
З чого почати вивчення фронтенду?
Порядок майже завжди один: HTML, потім CSS із флексбоксом і гридом, потім JavaScript. Лише після цього фреймворк на кшталт React. Спроба стартувати одразу з React — найчастіша помилка новачків: без розуміння мови чужий код перетворюється на набір заклинань.
Скільки часу потрібно, щоб стати junior frontend-розробником?
За системних занять близько восьми-дванадцяти місяців до рівня, з яким беруть на першу роботу. Вирішальним виявляється не кількість переглянутих уроків, а кількість доведених до кінця проєктів: два-три повноцінні застосунки в портфоліо важать більше за довгий список пройдених курсів.
Чи потрібна фронтендеру математика?
Для типової продуктової розробки — ні, вистачає шкільного рівня. Математика стає потрібною у вузьких галузях: робота з графікою та canvas, тривимірні сцени, анімації за фізичними законами, обробка даних для візуалізацій. Це окремі спеціалізації, а не вхідний бар'єр.
Чим фронтенд відрізняється від верстки?
Верстка — це перетворення макета на HTML і CSS. Фронтенд ширший: сюди входить логіка на JavaScript, робота з API, стан застосунку, маршрутизація, тести й збірка. Верстка сьогодні частіше сприймається як частина роботи фронтендера, а не окрема професія.