Frontend разработчик - распределение обязаностей и требования

Всем привет. Помогите пожалуйста понять следующее…

Frontend разработка очень комплексная вещь, которая (если в общем) включает в себя дизайн, верстку, и имлементацию бинес логики с помощью JS.

На рынке труда сейчас существует така позиция как Frontend Developer.
Какие обязанности, в реалиях, ложаться на тебя и какими навыками ты должен обладать?

  • нужно ли тебе быть дизайнером, или нужно ли тебе уметь работать в Photoshop, Fireworks, … Не все же в дизайне разбираються…
  • нужно ли тебе знать в совершенстве HTML/CSS и уметь сверстать все чего только клиенту вздумается, или же все еще есть отдельно верстальщики, которые отдельно этим и занимаються, а тебе нужно иметь базу знаний для работы с этим
  • нужно ли тебе знать JS. Конешно нужно. Плюс библиотеки и фреймворки. Достаточно ли быть продвинутым в JS, но быть не таким опытным в верстке? Или же это, как говорится, маст хев, и это нужно обязательно подтягивать.

Тоесть, хотелось бы услышать из реального опыта, какие навыки обязательно нужно прокачивать.
Думаю логичным было бо подкрепить это деталями (языки, технологии, библиотеки, фреймворки…)

Спасибо!

1 лайк

Я думаю что frontend developer должен знать хорошо JS, CSS, HTML. Ведь нужно разбираться что по чем и где и как… Конечно на это нужно время и усердие, но работа frontend очень интересная)) У меня друг Senior JavaScript developer и он прекрасно знает все верстку, дизайн и язык программирования)) Мы всегда будем учиться и чем больше мы будем знать оно нам не помешает. Знания всегда где-то понадобятся…

2 лайка

Очень интересный вопрос, исходя из того, что сейчас идут холивары относительно профессии “верстальщик”.

Всё сводится к тому, что верстка сайтов умерла с появлением адаптивных дизайнов (а если копать еще глубже - то начала отмирать с появлением блочной верстки). И на рынке труда сейчас всех верстальщиков медленно и уверенно вытесняют веб-дизайнеры, которые шарят html и css. Не стоить забывать и про специализированные системы, которые превращают макет в код разметки (и ежегодное развитие этих систем)

Учитывая это и тот факт, что сейчас пишутся библиотеки (как css, так и js) на все случаи жизни, можно предположить, что в перспективе будет человек, отвечающий полностью за клиентскую часть сайта.

Правильно ли я понимаю, что дела идут к тому, что со временем работа front-end dev’a будет сводится к написанию библиотек для веб-дизайнера, работой с AJAX а также написанию приложений для сайта (мини игрушки и т.д.)?

Думаю, пишут библиотеки очень мало, процентов так не менее 90 юзают готовые (в данном контексте - ищут библиотеки для веб-дизайнера), но, опять-таки, не совсем понятно, какие библиотеки вы имеете в виду

Да, уже давно

Да, всякую сложную логику писать дизайнеру уже сложнее

Меня интересует один момент. Нужны ли front-end dev’у навыки из сферы дизайна. Если да, то какие и зачем?

Я пока как то не горю желанием постигать тонкости UI и UX дизайна.

1 лайк

Это интересный пункт - делать фронтенд, но не хотать постигать тонкости. В общем виде иметь представление желательно. Но можно найти работу где эти навыки абсолютно не требуются.

Обязательно - технические навыки. Имея их, уже можно найти работу:

  • HTML, CSS, JavaScript - на низком уровне надо знать. Фреймверк выучить, зная общие принципы - не проблема. Я говорю не о знании что такое тег, а об умении его применить. Проводя параллели с шахматами, например: недостаточно знать как ходит конь, чтобы выиграть партию, нужно уметь выстроить стратегию.
  • Базовые навыки программирования, логика.
  • Базовые навыки работы с редакторами изображений. Так или иначе тебе придется превращать дизайны в кусочки, из которых потом будет составлена страница.

Остальные навыки - те, которые здорово расширяют твои возможности, увеличивают количество вакансий, под которые ты подходишь (я подкидываю ключевые слова для поиска направлений):

  • знание вспомогательных технологий: CVS (git - лучше, svn - норм)
  • понимание процессов и ролей в команде (product manager, product owner, bug tracker)
  • знание инструментов (редакторы кода, сборщики проектов, валидаторы)
  • понимание как работает веб (клиент-сервер технологии, dns, http, websockets, gzip, cookies)
  • понимание как работает браузер (reflow, repaint, cache, page rendering)
  • представление о UI (Раскин, блоги дизайнеров)
  • фреймверки и библиотеки

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

10 лайков

Спасибо большое за информацию.
Да ты прав, неполный список слегка деморализует, НО чесно говоря, такой список буде для каждой должности в ИТ, но по сути большинство всего уже доучиваешь в бою.
Просто както так сложилось, что когда HR-ы создают вакансию, они включают туда почти все что можна и не можно). Когда приходишь на собеседование, спрошвают совсем другое :)

1 лайк

Вставлю свои пять копеек:

Да ты прав, неполный список слегка деморализует

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

когда HR-ы создают вакансию, они включают туда почти все что можна и не можно)

Они преследуют две цели. Первая - найти бетменов, которые это умеют. Но так как бетменов мало, а работы много, компании берут и не совсем бетменов при условии, что человек может быстро обучаться. А вторая цель - отсеять людей, которые прочитали книгу по HTML и думают, что они уже могут претендовать на должность как минимум джуна. С любым кандидатом необходимо проводить собеседование, а это время как HR`а, так и технического специалиста, у которого вагон задач, которые нужно было сделать еще вчера.

Когда приходишь на собеседование, спрошвают совсем другое

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

Так бывает не везде, в каждой компании свой подход к собеседованиям. Поэтому есть вероятность столкнуться с совершенно неожиданными вещами. Например с тем, что технический специалист будет тебя откровенно троллить :smile: Это абсолютно нормально, этому можно удивляться, но бояться этого не стоит.

Как-то так.

3 лайка

нужно ли тебе знать в совершенстве HTML/CSS и уметь сверстать все чего только клиенту вздумается

ух, очень, очень, очень надеюсь что не нужно, иначе “разработчик” как-то абсолютно не в тему в описании вакансии. по-моему идеальный вариант когда ты работаешь с js + фреймворки (тот же ангулар или эмбер) + тебя есть задания на серверной стороне на node.js или .net (встречал таких людей) ну или всякое может быть, может и на java. best of both worlds)).

если же работа будет сводится к верстке и рисованию… обидно в общем будет))

Вполне согласен. Одно дело програмировать, другое - заниматься дизайном и програмами графической обработки. Но по как-то мне кажеться что совсем от верстки и дизайна осторониться не получиться. Думаю, опять же, все завист от проэкта. Эхххх…

  1. Подскажите пожалуйста, как проходит собеседование с техническим специалистом на должность Front-end Dev?
    Например на Java Intern гоняют по Java Core (очень много вопросов с подковырками, которые не используются в продакшене), общие вопросы по ОПП (Итог: 90% теория)
    Как обстоят дела с Junior Front-end?
    Спрашивают теорию по html? Базовые вещи или вопросы на знание редко используемых тегов <dd></dd>?
    Теория больше по чистому JS или JQuery?
    И как проверяется знание графических пакетов? (нужно по памяти кнопки в Photoshop называть?)
    Или для Front-end Dev больше играет роль практическая составляющая? И собеседование больше проходит как выполнение технического задания под пристальным взглядом тех специалиста.

  2. Какая примерная вилка зарплат (другими словами: сколько просить) для Jun Front-End в Харькове или других городах?

1 лайк

Фотошоп на собеседовании фронт-энда врядли будут спрашивать.
Я бы посоветовал не искать какую то систему в собеседованиях, что бы знать ответы на вопросы.

Джуниору, это мое субьективное мнение, важно иметь портфолио с различными задачками. Что видишь то и делаешь. Можно поспрашивать у людей, знакомых, где угодно.
Джуниору легче рассказать о задачах, которые он делал, как он думал, когда решал, с какими проблемами сталкивался. Эти работы могут сказать что-то о человеке как о специя ищет иалисте.

Конечно может быть и иначе, но отсутствие портфолио у Джуниора может говорить о том, что он много читал но ничего не делал.

Мне кажется лучше не ходить на собеседования в таких случаях и не тратить время тех, кто собеседует. Я встречался с парнями, нормальными, интересными, но они совсем немного почитали в интернете о программировании и решились идти на работу. Естественно для них сам опыт собеседования - большой плюс. Можно узнать что требуют. Но только в следующий раз спросят обязательно что то другое :smile:
Печально, когда у человека, который тебя собеседует - ты уже 10й такой на этой неделе.

В каком русле пойдет собеседование зависит полностью от вас. Главное не бояться, все люди нормальные, у всех знания.
Думаю важно понимать, что когда кампания ищет человека, ей нужно от вас в первую очередь выполнение определенного рода бизнес задач. Если вы никогда не решали задачь, то стоит потренироваться. Если вы решили 50 задач с применением разных технологий, всем будет абсолютно фиолетово, что вы не знаете, что такое тег < dd> и < dt> .
Как то так.
Ну и главное не отчаиваться, когда собеседование проходит неудачно, это реально классный опыт. Никто не унижает людей на собеседованиях, и нормальных парней с радостью принимают во второй и третий раз, если они настойчивы в своих стремлениях.

1 лайк
  • Любят спрашивать про замыкания в разной форме
  • Всплытие переменных (hoisting)
  • Прототипное наследование
  • Как работает асинхронность
  • Передача данных по ссылке и по значению

Про DOM спрашивают

  • Обработка событий
  • AJAX (все формы, не только XMLHTTP request)
  • iframe (как получить доступ в него и из него)

Любят просить про section и header html5 теги. Про списки (dd в том числе, кстати этот тег часто используется), семантику.

Такое тоже любят спросить. Мало кто из собеседующих действительно умеет проводить собеседования. Так что набирайся терпения.

3 лайка

ну раз уж пошла такая пьянка то добавлю 1 супер классическую задачу из собеседований про замыкания (надеюсь это не противоречит правилам форума): написать функцию которая принимает массив чисел и возвращает массив функций такой что i-я функция возвращает i-е число. Работать должно так:

// та самая функция
function foo(arr) {
    // ...
}

console.log( foo( [5, 7, 4] )[1]() );    // напечатает 7
console.log( foo( [5, 7, 4] )[2]() );    // напечатает 4

кстати пробовала решить эту задачку. и протупила в одном маленьком месте, то есть если бы я решала ее на интервью, люди бы поняли что я понимаю замыкания но…
если интересно отдебажить и знать самим на какие грабли не наступать
прошу

1 лайк

дак это ж классическая задача со стрелками у Кантора, только по-другому подана))
Кстати, как по мне так решение намного красивее и нагляднее если не как у него через оберточную функцию которая “на месте” вызывается делать, а через функциональный метод reduce.

1 лайк

вот мое решение http://jsbin.com/wowuyedada/1/edit но в конечном итоге все-таки нет желаемого результата. гляньте, добрые люди, укажите в чем проблема?

ты не возвращал ничего из функции, поправил, но не знаю сохранилось ли http://jsbin.com/saluqehade/2/edit

спасибо большое)