Что нужно знать Front-end разработчику в 2014 году?

Question

[Никита Pewget]

Занимаюсь разработкой сайтов, но отвлекся года на 3 на другие занятия и хотел бы быстро войти в курс дел, как сейчас обстоят дела с версткой. Сам серьезно верстать не планирую, но при приеме на работу Front-end разработчика, хотелось бы досконально понимать текущую ситуацию. В связи с этим планирую сам недельки позаниматься версткой.

Вопросы следующие:

1. Какие библиотеки, фреймворки, методологии и технологии должен знать Frontend-разработчик в 2014 году?
Я пока разобрался с Bootstrap, SCSS/LESS, БЭМ от Яндекса, AngularJS.
2. Пока что мне кажется, что новый проект следует начинать с использованием Bootstrap + свою верстку делать по правилам БЭМ, прав ли я?
3. Какие сайты стоит читать, чтобы быть в курсе текущих трендов?
Сейчас ограничиваюсь habrahabr.ru, frontender.info.

Answer 1

[Анна Бакурова]

Ответы:

1) Grunt - для удобства.
Bootstrap - не всегда правда нужен, но знать обязательно.
Ознакомьтесь с Mocha (читается как мокко или мокка, но не моча... мокка - сорт кофе)
Выбирете для себя препроцессор
Хотя бы посмотрите что такое node.js.
Git обязателен (ну кнечно можно выбрать другую систему контроля версий).
Для больших поддерживаемых проектов Bower.

2) Не факт... разные бывают проеты и разная стилистика иногда достаточно только сетку взять и то это тоже бывает не нужно. Иногда встречаются проекты с кодом css примерно 800 строк кода (вместе с reset и общих стилей). По поводу БЭМ - его нужно в меру тоже. Верстать по БЭМ вслепую, не задумываясь а нужен ли он тут, тоже может привести к неприятным последствиям. Если это мелкий лэндинг который на 95% не будет расти то тотальная стилистика БЭМ будет лишней. Но что касается больших проектов то Вы полностью правы.

3) hexlet

Comments

[Sergey Romanov]

я бы пользовался gulp вместо grunt :)

[Анна Бакурова]

Sergey Romanov: кто с чего начал

[Sergey Romanov]

Ну это да. Я тоже начинал с грунта. Ведь когда он появился галпа ещене было. Но ты молодец. Я восхищен что девушка в курсе таких инструментов и пользуется ими. Круто.

[Анна Бакурова]

Sergey Romanov: thank U! =)

Answer 2

[rie]

1) Фреймворков для фронтенда сейчас великое множество, тот же ангуляр, кнокаут, и прочее, мне лично нравится эмбер. Я бы порекомендовал акцентировать свое внимание на небольшом пуле сложных либ, и обязательно знать backbone. NodeJS тоже бы неплохо знать, но сейчас мало кто пишет на чистой ноде, многие пишут на expressjs и аналогах. Так же порекомендовал бы изучить сборщики, грант, галп, или что-то другое, попроще, так же можно написать свой скрипт и привязать его к гитхуку. Q.js.

На счет LESS/SCSS/Stylus это все хорошо, и начать на них верстать достаточно просто, да и нужно, но тут кроется главная ошибка, у многих просто не получается следовать простоте и широкому спектру возможностей, и они генерят слишком сложные структуры и вложенности.

2) Бем слишком громоздкая структура, да что-то из нее можно для себя вынести, но следовать полностью Бему, я бы никому не советовал.
Брать готовый бутстрап - забей, проще и правильней взять исходники и сделать свою либу нужных миксинов.

3) Лучше подпишитесь на твитеры мейнтенеров нужны вам либ, и людей которые пишут вдумчивые и внятные статьи. Например такое https://twitter.com/JavaScriptDaily

Answer 3

[Евгений Петров]

Вёрстка в духе БЭМ получается, когда используется простая и понятная разработчику структура. То, во что она превращается при разворачивании структуры — HTML, CSS, разработчик не трогает вручную, да и не должен.
Не сомневаюсь, что вы знаете фреймворки для работы с БЭМ, но когда люди вручную пишут крокодилы «как в БЭМ», меня просто умиляет:)) Как котята. Хотя нет, котята — отстой.

И, как мне кажется, серьёзная часть разработки уже базируется на Node.js. Включая всевозможные grunt, gulp etc.

ПыСы Яндекс перешёл на Stylus.

Comments

[Тимофей Дергачёв]

В этом докладе Владимир Гриненко говорит что используют Roole.

[Евгений Петров]

@exeto разные офисы и разные проекты могут использовать разный набор. Кроме того, больше за год много чего может поменяться. Они же не вернулись к SASS или LESS?))

Answer 4

[Петр Петров]

1.
CSS – SASS/SCSS, LESS, Stylis
JS – AngularJS, CoffeeScript, Handlebars
HTML – Jade
Build – Gulp, Bower
IDE – Brackets, SublimeText3
Plugins – Emmet, jsHint

2
Стараюсь писать свои стили, если заказчик не требует бутстрап

3
www.smashingmagazine.com

Answer 5

[Sergey Romanov]

Жаль что валидность этого вопроска всего несколько недель. Нужно было это спрашивать в январе этого года. Сейчас нужно спрашивать уже про 2015.

Мой ответ JavaScript в основе и все что с ним связано.

Angular, Ember, Knockout, jQuery, WinJS, Nodejs, Bower, Gulp, Bootstrap, Foundation, Material, Meteor, Express, ...

Я не говорю о HTML, CSS, CoffeeScript, WebStorm, ... потому что это ни имет отношения к 2014 или 2015. Это просто что нужно было вчера и будет завтра и не имеет отношения к природе вопроса о тенденциях.

Answer 6

[Антон Тихомиров]

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

Comments

[Pavel Yakovlev]

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

[Антон Тихомиров]

@Kith_Debeetham вот-вот! И я, кстати, совсем не удивлен тому, что этот мой вопрос так и останется без ответа. На такие вопросы редко отвечают, ибо правда глаза режет. К ней всегда не готовы.

[Ирина Фомина]

Какие глаза ваша правда режет? Автор же русским языком написал, что хочет взять на работу фронд-энд-разработчика, и для этого хочет войти в курс дел

[Антон Тихомиров]

Ирина Фомина: да, этот коммент я писал под воздействием другого вопроса, просто не там оставил( К сожалению, в те времена еще нельзя было удалять комменты, вот он и остался...

Answer 7

[IVAN SAVCHENKO]

EcmaScript 6

Answer 8

[Владимир Т.]

Вот ещё подборка

Answer 9

[betula]

Shadow DOM, SVG, Polymer, SPA
А вообще конечно проектов где нужен хороший фронт, гораздо больше чем проектов где он запланирован в обозримом будущем. Потому смотрите по вакансиям, что востребовано то и изучайте, скорее всего в ближайшее время компонентные подходы в вебе будут развиваться все сильнее, но обычные сайты так и останутся ожившей на jQuery разномастной вёрсткой.