Скажи щось айтішною: Front-End Developer

Чим займається Front-End інженер

— Думаю, що всі пам’ятають, як починалося бурхливе зростання розробки, — згадує Software Engineer Anywhere Club Олександр Щербаков. — Цей процес почався в 2019 році, коли здавалося — ось він, останній шанс увійти в IT, поки ще спектоно. Спойлер: прохолодніше не стало. Ще досить гаряче. Front-End — один із хайпових напрямків в IT. Сам процес розробки — робота не бий лежачого: верстай, роби правки (і тільки спробуй це робити без задоволення), спілкуйся з дизайнерами й катайся, як сир у маслі, — посміхається Олександр. — Ось тільки запити клієнтів змінилися. А слідом за ними — обов’язки фронтенд-інженерів.

З умовного верстальника з вузьким профілем роботи професія виросла до подоби any-key-фахівця (готового взятися за будь-яку проблему). Пам’ятаю, один дуже мудрий фахівець, який розуміється на інженерії, сказав: «Немає більше ніякого поділу, ви не 100% DevOps, ви не 100% FE-інженер, ви не BE-інженер. Ви — інженер». Я згоден із цим твердженням. Дисперсія обов’язків збільшилася, а з нею — і кількість роботи. З власного досвіду знаю: якщо ви захопилися якоюсь мовою програмування, то осягнути будь-яку іншу — справа часу й посидючості.

Словничок Front-End-розробника

— Звичний набір понять фронтендера має такий вигляд:

1. MR/PR Review (merge request review, pull request review) — стратегія в системі контролю версій, що дає змогу зробити зріз відмінностей від головної версії (prod-like) гілки, присвячених новій фічі/фіксу бага колег. Завдання, що вимагає не меншоого фокусування уваги, ніж писати код самому. А часто й складніше, оскільки доводиться щоразу занурюватися в контекст і деталі фічі, яку ти не писав. Перевіряєш написаний код на дотримання консентів, прийнятих у команді. Чистота коду, його читабельність, покриття unit/e2e тестами, гарненький UI, потенційна наявність edge-кейсів (кейсів, які не було враховано в acceptance criteria, але які потенційно можливі у флоу юзера), найменування змінних, функцій, класів, дотримання принципів SOLID/DRY тощо. Загалом, усе, що ми всі так любимо й шануємо, як ніби писали код для себе коханого.
2. Tech stack. У фронтенді через обставини часу всі звикли все спрощувати: бандлери (збирачі проєктів), фреймворки, бібліотеки. Тому навіть зараз, коли бум розробки ще тільки набирає обертів, величезним плюсом вважається навичка освоєння схожих за призначенням тулів. І в них є потреба не через легке життя. Усе в межах сучасних тенденцій на оптимізацію роботи застосунку, поліпшення DX (developer experience) або клієнтських запитів.
3. State managing. Одна з найвагоміших, на мій погляд, речей — це управління data flow на проєкті. Якщо простими словами: як і куди течуть ваші дані всередині вашого додатка, за яких тригерів і за яких залежностей це відбувається. Можна уявити собі картину затятого управлінця, який сидить за столом і тільки пальцем показує, що й куди. А чому й навіщо — вас не має це хвилювати. Таке собі єдине джерело істини — треба лише пам’ятати, що велика система вимагає гранулярності, тому замість одного затятого часто з’являється тисяча, і всі вони відповідають за взяті на себе окремі обов’язки. Гарними прикладами можуть бути такі бібліотеки, як Redux/Reatom. Ознайомтеся з їхніми варіантами рішень. Можливо, вони вам допоможуть і поза розробкою.

Що ще треба знати

— Поговорімо про те, що точно треба засвоїти, щоб стати Front-End-розробником, — пропонує Олександр. — Це мова, манери, грація, абстрактне мислення та вміння ставити правильні питання. Адже це — джентльменський набір.

Мова

— Мову: html/css/js (базовий набір FE-бійця) потрібно знати й шанувати. Копайте всередину, щоб дізнатися, як це влаштовано, як працює, зрозумійте суть, а з цим прийде вміння будувати питання. І навіть не переймайтеся, якщо не пам’ятаєте, як працює метод .map або як відцентрувати div. Я, звісно, перебільшую, але суть зрозуміла. Базу краще знати. Усе прийде з досвідом і дійде до автоматизму. Копайте глибше, читайте тих, хто копає й пережовує.

Манери

— Знання мови не означає, що ви вмієте з нею поводитися. Можна писати робочий код, але поганий з погляду оптимізації й архітектури. Потерли ручки, та ба, інший джентльмен із вашої команди ляснув по обличчю рукавичкою і сказав: «так з нашим додатком себе не поводять». І він матиме рацію. Є правила етикету, є патерни спілкування. Так і в розробці. Учіться писати чистий код, що виправдовує ресурси. Який сенс від неосяжної кількості слів, якщо вихлоп зводиться до одного речення?

Грація

— Усі знайомі з фразою: «красиве рішення». Особисто я, коли бачу гарне рішення в коді, — буквально в екстазі. Ця навичка досягається бойовим досвідом, шляхом спроб і помилок. Що більше ви будете писати код самі, то швидше знайдеться оптимальне й красиве рішення для того чи іншого завдання.

Абстрактне мислення

— З абстрактним мисленням складніше. Не всі від народження мислять нематеріальними образами. Що глибше ви підете у вивчення чого б то не було у світі розробки, то більше абстракцій вам зустрічатиметься. Найчастіше в літературі, щоб пояснити те чи інше складне поняття, вдаються до спрощеної аналогії. Не обмежуйте себе в цьому, спрощуйте все, що трапляється на очі. Особисто моє життя у фронтенді спростило малювання. Якщо якийсь термін неможливо пояснити словами — дайте волю фантазії, думайте абстрактно.

Вміння ставити правильні запитання

— Усі вже встигли познайомитися з новими модними тулами типу ChatGTP або Copilot? Якщо коротко, то ці штуки підірвали індустрію розробки на початку 2023 року. ШІ, який не ставить зайвих запитань, а пише код за тебе. Не буду гріха таїти, я навіть трохи забоявся за свою кар’єру. Але трохи розібравшись, я вирішив, що до переваги ШІ над розробником (людиною) ще далеко. Так, машина добре пише код, добре (іноді) розуміє контекст і проблему. Але вона ніколи не буде її формулювати за вас, у неї не буде тієї гнучкості в роздумах, як у людини. Грамотне формулювання — це 80% успіху, — вважає Олександр.

Висновок

— На завершення хотілося б додати ще один важливий елемент джентльменства у світі фронтенду. З чого починають свій день сери й пери? — запитує Олександр. — З філіжанки кави й газетки. Світ фронтенду розвивається супершвидко, моргнути не встигнете, як з’явиться якась штуковина, що спростить вам життя. Читайте, вчіться, не покладаючи рук. Починайте день зі сканування фронтенд-дайджестів. Це дуже спростить життя й підкине тем для розмови з колегами. І, звісно, робіть усе з ентузіазмом!

Досліджуйте сленг інших професій в IT:

• Скажи щось айтішною: тестувальник
• Скажи щось айтішною: бізнес-аналітик
• Скажи щось айтішною: Data-аналітик