Прокачайся в код-ревью: для первых 50 участников — курс бесплатный

время чтения: 4 мин

Что-то на айтишном: Front-End Developer

Чем занимается Front-End Developer? Что ждет его на реальных проектах? Какие слова и выражения нужно знать? И причем тут (внезапно) манеры, грация и абстрактное мышление?

Software Engineer Anywhere Club Александр Щербаков


Чем занимается Front-End Engineer

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

Из условно верстальщика с узким профилем работы профессия выросла до подобия any-key-специалиста (готового взяться за любую проблему). Помню, один очень мудрый и разбирающийся в инженерии специалист сказал: «Нет больше никакого разделения, вы не строго DevOps, вы не строго 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 на проекте. Если по-простому: как текут, куда текут, при каких триггерах, при каких зависимостях ваши данные внутри вашего приложения. Можно представить себе картину прожженного управленца, сидящего за столом, который только пальцем показывает, что и куда. А почему и зачем — вас волновать не должно. Этакий one and primary source of truth — нужно только помнить, что большая система требует гранулярности, поэтому вместо одного прожженного зачастую появляется тысяча, и все они отвечают за свой слой ответственности. Хорошими примерами могут выступать такие библиотеки, как Redux/Reatom. Ознакомьтесь с их вариантами решений. Возможно, и вне разработки они вам помогут.

Что еще нужно знать

— Давайте поговорим о том, что точно надо постичь, чтобы стать Front-End-разработчиком, — предлагает Александр, Это язык, манеры, грация, абстрактное мышление и умение задавать правильные вопросы. Джентльменский набор, как-никак.

Язык

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

Манеры

— Знание языка не означает, что вы умеете с ним обращаться. Можно писать рабочий код, но плохой с точки зрения оптимизации и архитектуры. Потерли ручки, да вот не тут-то было, другой джентельмен из вашей команды шлепнул по лицу перчаткой и сказал: «Так с нашим приложением себя не ведут». И будет прав. Есть правила этикета, есть паттерны общения. Так и в разработке. Учитесь писать чистый, оправдывающий ресурсы код. Что толку от необъятного количества слов, если выхлоп сводится к одному предложению?

Грация

— Все ведь знакомы с фразой: «Красивое решение». Лично я, когда вижу красивое решение в коде, — буквально в экстазе. Этот навык достигается боевым опытом, путем проб и ошибок. Чем больше вы будете писать сами код, тем быстрее найдется оптимальное и красивое решение для той или иной задачи.

Абстрактное мышление

— С абстрактным мышлением сложнее. Не всем дано с рождения мыслить нематериальными образами. Чем глубже вы пойдете в изучение чего бы то ни было в мире разработки, тем больше абстракций вам будет встречаться. Зачастую в литературе, чтобы объяснить то или иное сложное понятие, прибегают к упрощенной аналогии. Не ограничивайте себя в этом, упрощайте все, что попадается на глаза. Лично мою жизнь во фронтенде упростило рисование. Если какой-то термин не поддается объяснению — дайте волю фантазии, думайте абстрактно.

Умение задавать правильные вопросы

— Все уже успели познакомиться с новыми модными тулами типа ChatGTP или Copilot? Если вкратце, то эти штуки взорвали индустрию разработки в начале 2023. AI, который не задает лишних вопросов, а пишет код за тебя. Не буду греха таить, я даже немного побоялся за свою карьеру. Но немного разобравшись, я решил, что до превосходства AI над разработчиком (человеком) еще далеко. Да, машина хорошо пишет код, хорошо (иногда) понимает контекст и проблему. Но она никогда не будет ее формулировать за вас, у нее не будет той гибкости в размышлениях, как у человека. Грамотная формулировка — это 80% успеха, — считает Александр.

Заключение

— В заключение хотелось бы добавить еще один важный элемент джентльменства в мире фронтенда. С чего начинают свой день сэры и пэры? — задается вопросом Александр, — С чашечки кофе и газетки. Мир фронтенда развивается супербыстро, моргнуть не успеете, как появится какая-то штуковина, которая упростит вам жизнь. Читайте, учитесь, не покладая рук. Начинайте день со сканирования фронтенд-дайджестов. Это очень упростит жизнь и подкинет тем для разговора с коллегами. И конечно — энтузиазм и еще раз энтузиазм!

Изучай сленг других профессий в IT: