10 навыков, которые помогут фронтендеру найти первую работу

12
Аватар автора

Сергей Горбачев

фронтендер в Т⁠—⁠Ж

Страница автора
Аватар автора

Андрей Маргиев

тоже фронтендер в Т⁠—⁠Ж

Страница автора

Фронтендеры разрабатывают внешнюю часть приложений и сайтов — то, что видят пользователи. Спрос на таких специалистов высокий, но чтобы найти первую работу, нужно многое уметь. Рассказываем о главных навыках для новичков в разработке.

🌐 Научиться верстать в HTML и CSS

Хотя современный фронтендер больше программирует, чем верстает, знания верстки все равно нужны. На этом этапе важно сразу увидеть результат, прочувствовать процесс создания веб-страниц, чтобы понять, интересно ли это. Наберитесь знаний на Code Basics на русском или на freeCodeCamp на английском

👅 Изучить JavaScript

Единственный язык, который интерпретируют браузеры, поэтому без него не обойтись. Освоиться в JavaScript поможет популярный учебник от learn.javascript.ru, в нем есть задачи на закрепление материала. Перед собеседованиями пригодятся книги из серии You Don’t Know JS. Они детальнее разбирают устройство языка — об этом любят спрашивать на интервью

😎 Поднатореть в сетевых технологиях

Кроме создания интерфейсов фронтендеру важно уметь работать с данными. Поэтому пригодятся основы: как работает протокол HTTP и его надстройка HTTPS, как делать сетевые запросы, обрабатывать данные и обращаться с ошибками. Здесь достаточно почитать об устройстве сети на «Доке»

🌌 Погрузиться в Git

Такой же базовый навык, как владение JavaScript: в современной фронтенд-разработке Git пользуются каждый день. Нужно уметь делать из своего кода версии, готовить коммиты, работать с удаленным репозиторием. Набрать основы можно в интерактивном тренажере, а попрактиковаться — на реальных репозиториях

🇬🇧 Подтянуть английский

Английский нужен каждый день: на нем быстрее искать ответы на специфически вопросы, на нем же написана почти вся документация, которую только можно представить

💾 Разобраться с фреймворками

Когда наработаете базу JavaScript, изучите один из фреймворков для создания интерфейсов. Самые популярные — React и Vue, Angular не такой расхожий. Без них никуда в корпоративной разработке. Выбирайте по ситуации на рынке, учитывая запросы компании, в которую хотели бы устроиться. Потом уже смотрите, например, видеообзоры технологий на YouTube. Сконцентрируйтесь на одном варианте, не заучивайте все

🧠 Усвоить SPA и SSR

Здесь речь не о конкретном техническом навыке, но о понимании концепции — как отрисовать страницу через готовые фреймворки. В первую очередь новичок наталкивается на Single Page Application, SPA. Server Side Rendering, SSR, — следующий виток. Начинающему фронтенд-разработчику достаточно знать, зачем и для чего существует SSR, какие проблемы решает. Для знакомства хватит материала на «Доке»

🤖 Выучить основы TypeScript

В вакансиях для новичков часто упоминается TypeScript, и владение этим инструментом дает соискателю преимущество. Вместе с тем без знания JavaScript изучать TypeScript бесполезно, потому что, грубо говоря, TypeScript — это надстройка над JavaScript для типизации кода. Бесплатный курс есть на Codeacademy

🔢 Узнать алгоритмы

Знание алгоритмов редко требуется в повседневной работе, но полезно на собеседованиях в крупные компании: практически всегда на том или ином этапе проверяют умение решать алгоритмические задачи. Новичку достаточно понять основные структуры данных из JavaScript: массивы, хэш-таблицы. Набить руку можно на LeetCode и HackerRank

🍦 Развить софт-скиллы

Есть универсальный навык, который прокачивается в деле, — умение разбираться в проблеме, искать ее основу. Часто он пересекается с вдумчивым чтением документации и поиском уже готовых решений. Никуда и без умения приходить к компромиссу между качеством и сроками, работать в команде. Новичку важно не стесняться задавать вопросы и не бояться показывать, что он чего-то не знает

Пройти интервью куда угодно

Рассказывают читатели в потоке о собеседованиях. Есть истории о поиске работы за границей, в кризис и во время учебы в университете

Что почитать тем, кто хочет войти в профессию:

Новости из мира образования, советы по карьере и учебе, вдохновляющие истории — в нашем телеграм-канале: @t_obrazovanie

Андрей МаргиевЧто еще нужно знать фронтендерам?
  • d1mmmkРазобраться как работает npm/yarn, что такое package.json, что в нем хранится и зачем, основы работы с консолью, а то после git clone надо зачастую npm install запустить — не у всех получается разобраться в случае возникновения ошибок при установке4
  • frwellmonalisad1mmmk, эти моменты, на мой взгляд, покрывает пункт "Разобраться с фреймворками", так как на этом этапе без пакетных менеджеров уже точно не обойтись и новичок таким образом столкнется с современной экосистемой JS7
  • Смузивый ИТ-бояринОт фотографии типичного фронтендера орнул.8
  • d1mmmkfrwellmonalisa, не всегда, "тренировки на кошках", как правило, происходят в стерильной минимальной среде. В суровой реальности может оказаться что .npmrc содержит ссылку на приватный корпоративный репозиторий, версии пакетов в котором могут отличаться от "большого интернета". Бонусом может стоять какой-нибудь зоопарк eslint и stylelint с десятком плагинов, husky для хуков прекоммита и т.п. Вот словишь какой-нибудь peer dependency, потому что лид забил на обновление пакетов (либо просто legacy и обновлений нет) и чего с этим потом делать? А если версия npm устаревшая стоит и надо обновиться?0
  • frwellmonalisad1mmmk, перечисленное вами абсолютно валидно, но является нюансами, с которыми рано или поздно новичок столкнется на работе и намного реже встретится в "тепличных условиях" при обучении. Материал же называется "10 навыков, которые помогут фронтендеру найти первую работу". Незнание хуков пре-коммита, тонкостей сборки проекта и линтеров не будет мешать пройти удачно собеседование джуниору, хотя и конечно, может являться плюсом в рамках широкого кругозора.3
  • d1mmmkfrwellmonalisa, но изначально мой коммент был — уметь самостоятельно разобраться с запуском npm install (база), с чем не все справляются.0
  • frwellmonalisad1mmmk, > но изначально мой коммент был — уметь самостоятельно разобраться с запуском npm install, с чем не все справляются. В материале есть цитата: "есть универсальный навык, который прокачивается в деле, — умение разбираться в проблеме, искать ее основу." Так или иначе — остаюсь при мнении, что проблема, указанная в вашем комменте — частный случай того, что верхнеуровнево покрыто списком P.S. Буквально каждый туториал про фреймворкам покажет, как устанавливать ноду, писать npm i и устанавливать доп. зависимости (из субъективного опыта)2
  • Софи Канеевахоть я и не занимаюсь разработкой сайтов, мне было интересно почитать об этом. интересная статья, спасибо!3
  • фывфывЕсли вы новичок и ищите первую работу, то it's over.1
  • Richard BekkerАлгоритмы - сразу в топку. Единственная компания на рынке, которая просит алгоритмы у фронтов - это Яндекс (и похоже Тинькофф Журнал, не ждите меня). Ради одной компании, в которую на таком этапе очень низкий шанс попасть, не стоит растягивать свое обучение, а лучше шлепать учебные проекты, чтобы набить руку и запомнить базовые правила. Встречать вас будут по софтам, а провожать по code style’у. © Frontend Lead из синего банка0
  • Сергей ГорбачевRichard, попасть новичку в большую компанию, в принципе сложно, а не только из-за алгоритмов. Сам факт наличия алгоритмической секции при отборе уже отсекает значительную часть кандидатов, поэтому при должной подготовке, я бы не зарекался про очень низкие шансы 🌚 Конечно, если кандидату не принципиально важно попасть на первую работу в Яндекс или в Тинькофф и для этого нет мотивации, то можно не углубляться в изучении алгоритмов и структур данных, но это будет полезно для общего развития. И да, в Тинькофф тоже есть программа стажировок, где знания алгоритмов и структур данных обязательно пригодятся при сдаче вступительных испытаний1
  • Сэм БулатовRichard, сначала они пишут что алгоритмы не нужны, а потом у них сложность алгоритма n^3 :D. Не удивительно что большинство браузерных интерфейсов, такие лагучие.0