Что использовать в своем Front-End workflow?

Здравствуйте!
Скоро нужно будет сделать front-end часть нескольких проектов (буду делать один, без команды) и я решил заодно изучить новые технологии в сборке проектов и тому подобное. Много читал по этому поводу, смотрел видео и пока выбор пал на: Gulp ( скорее всего Yeoman c тем же Gulp (генератор gulp-webapp) ) , html шаблонизатор Jade, css-препроцессор Stylus. Ну и Bower, но тут особо нету вариантов, в отличии от 3-х предыдущих.

Также стоит отметить что после завершения этих 2-х проектов я буду искать работу в оффлайне, и надо чтобы это хоть как-то было востребовано, поэтому пока сомневаюсь в выборе. Вроде Gulp мне лучше чем Grunt, но последний более популярен. Также Stylus вроде как только набирает популярность, тот же bootstrap юзает SCSS и LESS. В codepen.io почти все на SCSS написано.

Буду очень благодарен любым советам по тому, что лучше использовать в данный момент и на перспективу. Или просто если вы поделитесь своим workflow для Front-End разработки, возможно ваш какой-то опыт. Спасибо.
  • Вопрос задан
  • 1821 просмотр
Пригласить эксперта
Ответы на вопрос 9
MhMadHamster
@MhMadHamster
По своему небольшому опыту могу сказать, что хотя в большинстве вакансий в сфере front-end и присутствуют строчки вроде gulp/less/sass и т. д. но на собеседованиях этому большое внимание не уделяют, то есть знаешь ну хорошо плюсом будет, но маловероятно что если вы подходите по навыкам и знаниям то вас не возьмут потому что вы использовали раньше less а не sass, почему так? ну, у меня конечно нет статистики подробной но я уверен что большинство верстальщиков, фрилансеров, front-endщиков и т.д. не используют препроцессоры на полную мощь, переменные, вложенные селекторы, пара примесей это все конечно хорошо, но если использовать препроцессор на таком уровне то перейти с одного на другой не составит никакого труда и в принципе на небольших проектах только этим и пользуются, оно и понятно. Другое дело крупные проекты где подходят уже более основательно к выбору препроцессора, смотрят так сказать именно его "фичи" и чем он отличается от своих аналогов (мы сейчас не про синтаксис говорим), но в любом случае если вы делаете, на сколько я понял, относительно небольшие проекты, вы всем этим пользоваться не будете, то есть знаний на уровне: "да использовал этот препроцессор в работе", на мой взгляд более чем достаточно, потому что, как уже сказал, на том уровне, на котором препроцессоры использует большинство разработчиков (занимающихся небольшими проектами) они отличаются не сильно
Ответ написан
artemmalko
@artemmalko
Frontend developer 2gis
Поделюсь workflow front-end разработки на TARS. Отличный инструмент для легкой разработки фронтенда.
Ответ написан
@desuvin
>Вроде Gulp мне лучше чем Grunt, но последний более популярен.
Сейчас только gulp и юзают.
Ответ написан
Комментировать
andykov
@andykov
Shit happens
Популярно не значит хорошо, можно провести аналогию с мостом.
Если коротко, с чем удобней работать и что решает ваши задачи, то и используйте.
Какой сборщик использовать особой разницы нет.
Лично я использую Gulp + пакеты к нему автопрефиксер, генератор спрайтов, генератор стилей для шрифтов, сжатие картинок, browsersync, минимизация CSS/JS, SASS и для меня этого пока достаточно.
Все это можно делать и в Grunt, другое дело что есть разница в скорости сборки.
Ответ написан
Комментировать
k12th
@k12th
console.log(`You're pulling my leg, right?`);
Между Gulp и Grunt особой разницы нету, переход доставляет некоторые неудобство, но по возможностям одинаковы. Gulp старается параллелизовать все таски, насколько возможно, поэтому может быть быстрее.

Jade, наверное, самый мощный шаблонизатор, но только для html/xml, для текста не очень удобно.

Ну и Bower, но тут особо нету вариантов, в отличии от 3-х предыдущих.

Ну вообще-то npm.
Ответ написан
arbuzik
@arbuzik
Обратите внимание на Webpack. Это новая альтернатива gulp/grunt. Если пишете яваскрипт, рекомендую смотреть в сторону компонентной разработки (React/Web Components), и конечно es6/7
Ответ написан
Комментировать
sim3x
@sim3x
Ну и Bower, но тут особо нету вариантов, в отличии от 3-х предыдущих.

npm init
npm install jquery --save-dev


Также Stylus вроде как только набирает популярность
между всеми тремя настолько мало различий, что можно пользоваться всеми одновременно

Gulp мне лучше чем Grunt
гульп лучше, тем что все параллельно запускает. Плагинов куча под оба

С теоретической точки зрения, стоит вводить по одной новой технологии в каждом проекте
6 - перебор
Ответ написан
Комментировать
sosnovskyas
@sosnovskyas
я коноечно ещё только начинаю свой путь разработчика но уже потихоньку прихожу к приглянувшемуся мне workflow
- npm (элементарно устанавливать gulp и есго можули с прочими зависимостями)
- gulp (и грядка модулей для сборки - run-sequence, del, gulp-sourcemaps, gulp-autoprefixer, gulp-concat, browser-sync, gulp-uncss, gulp-changed, gulp-imagemin, gulp-jscs ...... etc)
- jade как html template engine
- в плане CSS препроцессором не определился ещё но Stylus вроде подаёт надежды на светлое будущее ну и SCSS (SASS) поскольку многие используют
- в плане JS пока чистый стараюсь пользовать чтоб матчасть познать, но не брезгую применением jQuery, AngularJS и прочими свистелками и перделками )))
- в качестве IDE пользую WebStorm

на данном этапе развития фронтэнд девелопера мне кажется это вполне разумным набором
Ответ написан
Комментировать
Zoxon
@Zoxon
Веб-разработчик
Попробуйте использовать мой велосипед
gulp-front
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы