@sarathorn
php программист, веб-дизайнер, коллекционер

Почему стали популярны less, sass, ruby on rails, bower, grunt? И зачем они нужны?

Дамы и господа, много лет назад я был самым обычным php программистом, нас таких было много, а о других языках для веба никто и не слышал. Прошло пару лет, начал набирать веб2.0, где не надо было полностью перезагружать страницу, а подгружать недостающее при помощи, например, jquery. Так я освоил самые азы этого фреймворка и начал сильнее углубляться в css/html. Сейчас я мастер на все руки: отлично кодю на php, делаю неплохой фронт-енд на js+css+html. Казалось бы, всё отлично. В работе полагаюсь на PSPad - блокнот с подсветкой синтаксиса (пытался пересесть на тру notepad++, но пспад уже стал намного привычней). Из фреймворков, как для бэк-энда так и для фронта использую только свои наработки, ну так уж стало проще. Иногда, конечно, использую и чужое. Допустим, слайдер :) К чему я это всё. Мои навыки и мои знания позволяют делать красивые и функциональные проекты. Я не жалуюсь, клиенты довольны.

Суть вопроса в чём, я профукал момент, когда так неожиданно стали популярны такие вещи как less, sass, ruby on rails... А ещё на тостере постоянно мелькают (например, здесь) какие-то bower, grunt... Что это и зачем?
Совсем не понимаю, оно же ведь неплохо получается и без всяких дополнительных вещей? или нет?
  • Вопрос задан
  • 10498 просмотров
Решения вопроса 1
Ну вот, предположим, ты делаешь фронтенд для своего сайта. Нужно заверстать макеты. Можно, конечно, писать и на HTML, но довольно нудно писать все теги и потом их закрывать. Тут как раз предложили emmet. То есть пишешь в редакторе CSS-подобный селектор, нажимаешь Таб, и он превращается в HTML. Отлично, а нельзя ли сразу так и писать? А ведь можно, для этого есть, например, шаблонизатор Jade.

Замечательно. Дальше никуда без CSS. Вот только плохо постоянно копипастить цвета и размеры элементов, да и код кое-где повторяется. И для этого как раз есть CSS-препроцессоры, например, Less и SASS, они умеют переменные, вложение правил, миксины для повторяющегося кода. SASS даже мощнее: есть два стиля написания кода — как в Jade и как в обычном CSS, да и всякие функции — даже БЭМ при желании на нём завести можно.

Отлично, теперь можно скачать Bootstrap, иконки Font-Awesome, jQuery, какой-нибудь фреймворк, ещё парочку библиотек и вперёд. Стоп. У нас XXI век как-никак, пускай компьютер сам и скачает, да ещё и обновлять быстрее будет. Для этого как раз есть менеджер пакетов Bower. Он не просто скачает все компоненты, но и пропишет их в файл с указанием версий, заодно и требуемые зависимости подберёт, а потом одной командой установить или обновить можно будет.

Круто. Вот бы ещё попробовать новую версию JavaScript, ту самую, которая ES6 называлась. Да вот беда, пока что большинство фич из этой версии, те же стрелочки, нативно поддерживается нормально разве что в Файрфоксе и Эдже, что нам явно не подходит. И для этого можно использовать JS-транспилер Babel. Он возьмёт код на ES6 и преобразует в соответствующий код на ES5. Так же можно и CoffeeScript попробовать.

Упс, попробовали новую вёрстку, а она в некоторых браузерах расползлась. Надо вендорные префиксы добавить, можно, конечно, и для CSS-препроцессора миксины добавить, вот только для многих случаев они получатся жутко неудобные. Выход опять же есть — CSS-постпроцессор, например, Autoprefixer. Просто указываешь ему минимальные версии браузеров, а он сам в нужных местах префиксы сделает.

Ужас, это все эти команды вручную вызывать что ли?! Нет, конечно. Для этого и существуют системы сборки, такие как Grunt и Gulp. Мало того, что они просто все вышеперечисленные команды сразу вызовут, так ещё и помогут объединить и минифицировать CSS- и JS-файлы, и последят за изменением исходников, чтобы сразу выполнить требуемые задачи снова, а также и тесты прогонят — TDD, говорят, теперь тоже в моде.

Разумеется, в некоторых фреймворках, таких как Ruby on Rails и Laravel, можно настроить Asset Pipeline для автоматизации работы с исходниками, но это уже, конечно, частное решение.
Ответ написан
Пригласить эксперта
Ответы на вопрос 8
@Spaceoddity
Почему стали? От лени и нежелания думать своим мозгом.
Популярны они сталит благодаря продвижению Гуглом, Яндексом и иже с ними всяких "стандартов написания кода". При том, что и Яндекс и Гугл в этом плане очень далеки от идеала.
Эти фреймворки хороши для сквозной разработки крупных проектов, когда все участники хорошо знакомы с данными методами, давно сотрудничают и т.п. Т.е. для тех же крупных компаний. При том, что в большинстве крупных компаний всё-таки имеются собственные стандарты.
Ну а остальные уже, как обезьяны, подхватили. И требуют БЭМ, SASS, Angular для статичного одностраничника. Начинаешь выяснять для чего заказчику всё это надо - "а мне так наш дизайнер посоветовал"... Или когда берёшься доделывать чужой проект с кучей недоделанных хвостов в SASS - то ещё удовольствие и "оптимизация написания кода" - тупо вручную текстовым поиском приходится по фалам искать потерявшиеся переменные.
Сама настройка, выработка общих стандартов и синтаксиса для этих фреймворков - занимает кучу времени.
Так что по большому счёту вы ничего не пропустили. Браузеры все равно не понимают SASS и иже с ним))
Пишите как вам удобнее. Если клиент настаивает - попробуйте выяснить причины такой настойчивости. Если случай клинический - шлите лесом!
Ответ написан
sayber
@sayber
Да, я программирую на PHP и еще асинхронно!
Просто вы потерялись в середине нулевых, а по некоторым вещам и в начале.
Стоит немного наверстать.

Писать конечно можно и в блокноте. Я в середине нулевых начал пользоваться eclipse, nusphere (phped), теперь же жизнь без PHPStorm не представляю. Для простого кода обычно использую sublime.
Ну и конечно, я так же не представляю жизнь без препроцессоров, современных наработок и т.д. Все что вам кажется дикостью. К примеру вместо PHP на серверной стороне использовать NodeJS или вообще Go.

Помните, в 90е сотовые телефоны были редкостью ? Они были в новинку.
Но сейчас, жизнь без них (я про обычные сотовые, без чатиков) просто не могу представить.

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

Хотел написать много, цитирую как вопрос так и ответы, но передумал.
Коротко:

Мои навыки и мои знания позволяют делать красивые и функциональные проекты.

Совсем не понимаю, оно же ведь неплохо получается и без всяких дополнительных вещей?


Задумайтесь, делаете ли вы проекты или сайты-визитки, корпоративные сайты, интернет-магазины от $100 за пять рабочих дней ?

Ознакомиться нужно сначала с:
www.phptherightway.com
https://github.com/dypsilon/frontend-dev-bookmarks

Руби, пхп, питон или ноджс в подавляющем большинстве - неважно. Но вот я отвечал на подобный вопрос про руби и постарался ответить объективно на вопрос о различиях с пхп: PHP+Symfony или Ruby+RoR?

Если еще короче: раз вы сейчас задаете такие вопросы, значит, не приходилось сталкиваться с задачами, где без этого всего никак. А пока не столкнетесь сами, никто вас "не убедит", что это все необходимо
Ответ написан
Боюсь ошибиться, но это возникает от невозможности или нежелания развивать кругозор, возьмите за правило в воскресный вечер на пару часов заглядывать хотя бы в хаб "Веб-разработка", там люди для Вас уже все данные агрегатируют в статьи, многие темы пересекаются, даже особо не вникая в суть каждого инструмента через месяц-два вы будете прекрасно ориентироваться и в них и в решениях на их основе. Без этого вы не поймете, что Вам нужно, а что нет. Не верьте людям, которые говорят, что препроцессоры CSS, например, бесполезная вещь, мусор для лентяев. Они или сами не знаю что это, либо мазахисты. Еще никто не жаловался из тех кто пробовал. Еще бы... кому интересно станет противно, от того что миксин за тебя пишет вендорные префиксы, переменные хранят весь набор цветов твоего проекта или других прелестей.
Ответ написан
flashg
@flashg
В свое время (PHP4) мы с другом долго спорили, для чего нужен ООП. Пришли к выводу, что только для облегчения командной работы. С тех пор язык развился, теперь ООП дает кучу других преимуществ.
Сейчас такая же ситуация со всеми этими пре- и пост-процессорами, менеджерами и т.д. Удобно для больших проектов, над которыми работает куча народу, а для небольших сайтов это только замедляет разработку.
Вывод: хотите на работу в крупную компанию - изучайте, хотите быть фрилансером - отберите то, что вам будет удобно использовать, а остальное - в топку.
Ответ написан
IonDen
@IonDen
JavaScript developer. IonDen.com
Спрос рождает предложение. Самое обычное дело.
Растет объем и сложность задач, улучшаются старые и создаются новые инструменты для их решения.
Ответ написан
@dimonnwc3
Не парься, эти вещи лишь упрощают и автоматизируют рутину для тех у кого есть мозг. Без них вполне себе можно не спеша работать и делать ВСЕ.

А вот если наоборот, как в моем случае, все эти вещи знаю, а программировать один фиг не могу. Вот тут уже проблема. И less с grunt'ом за меня ничего не напишут.
Ответ написан
@Paul0089
Посмотрите вот тут ролик Трэвиса Нельсона. Он рассказывает о своем видении CSS-фрейморков. Хорошо это или плохо? Какую выгоду можно получить от их использования? Есть ли правильное время для того, чтобы начать изучать фреймворки? И нужны ли они вообще?
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
iGooods.ru Санкт-Петербург
от 120 000 до 180 000 руб.
Shore Мюнхен
от 62 000 до 72 000 eur.
SberMarket Москва
До 220 000 руб.