Ускоряемся с помощью yeoman

Наверняка у каждого найдется набор заготовок для использования в проектах различного назначения. Например:

• для блога берем актуальный релиз wp
• загружаем и настраиваем определенную CMS для интернет магазина
• yii для проекта определенной структуры
• нам нужно заверстать psd, и мы берем уже готовые собственные наработки (в виде scss, css, html, less файлов)
• берем html5-boilerplate, тему bootstrap либо другую "базу" для доработки
• создаем android приложение "с нуля"
• создаем мультиплатформенное приложение, скажем на базе Apache Cordova

Для всего этого (и не только) предназначен генератор yeoman, именно генерировать первоначальную структуру проекта. Вы спросите: зачем мне использовать генератор если у меня и так все получается путем copy-past?
Плюсов много, но главные из них это:

1. Уменьшаем затраты своего времени, т.к. многое из того что делаем вручную можно сделать в полу-автоматическом режиме (например установку-настройку-запуск wordpress c помощью генератора можно пройти за минуту)
2. Использовать лучшие практики построения проектов. Если это касается frontend-а то: bower, grunt, glup. Если это касается backend-части то вы получаете продуманно сгенерированную файловую структуру проекта.
3. Достаточно большое количество уже готовых решений, зачем изобретать велосипед? Используйте сторонние разработки, возможно их подход будет более продвинутым.

Прежде чем приступить к использованию генераторов, необходимо:

1. Установить node.js (если у кого не установлен, используем документацию или эту статью)
2. npm (менеджер пакетов ноды, устанавливаем все вместе по документации из первого пункта)
3. Установить минималистичекский набор пакетов для создания полноценного фронтенда (npm install -g yo bower grunt-cli gulp)
4. Несколько минут свободного времени

Для примера, давайте попробуем создать скелет backbone приложения с помощью генератора. Примеры будут показаны на ubuntu-хосте, но в других случаях результат будет схожим.
Открываем терминал (или cygwin, если еще кто-то сидит на windows) и убедимся что у нас есть node+npm:

$ node -v # проверяем версию nodejs

v0.10.25
$ npm -v # проверяем версию npm

1.3.10

Если мы видим примерно такой результат, то можем продолжать, иначе вам нужно установить node.js (ссылки на документацию и статьи выше).
Создадим папку backbonde-tests для наших тестов.

$ mkdir backbonde-tests && cd $_

Установим yeoman, grunt, glup:

$ npm install -g yo bower grunt-cli gulp
npm http GET https://registry.npmjs.org/grunt-cli
npm http GET https://registry.npmjs.org/bower
npm http GET https://registry.npmjs.org/gulp
..................

Устанавливаем генератор backbone приложения (его будет использовать yeoman):

$ npm install generator-backbone
npm http GET https://registry.npmjs.org/generator-backbone
npm http 200 https://registry.npmjs.org/generator-backbone
.................

Запускаем генератор в папке проекта, создаем проект под именем "backbone-tests":

$ yo backbone backbone-tests

     _-----_
    |       |
    |--(o)--|   .--------------------------.
   `---------´  |    Welcome to Yeoman,    |
    ( _´U`_ )   |   ladies and gentlemen!  |
    /___A___   '__________________________'
     |  ~  |
   __'.___.'__
 ´   `  |° ´ Y `

Out of the box I include HTML5 Boilerplate, jQuery, Backbone.js and Modernizr.
? What more would you like?
❯◉ Twitter Bootstrap for Sass
 ◯ Use CoffeeScript
 ◯ Use RequireJs

На данном этапе мы выбираем опции генератора, выберем только генерацию sass. После этого будет произведена загрузка необходимых пакетов и генерация структуры. Посмотрим что сгенерировалось в итоге:

$ ls
app  bower.json  dist  Gruntfile.js  node_modules  package.json  test

Готово, в результате мы получили готовую структуру, и несколько дополнительных плюсов. А именно: теперь мы можем генерировать backbone-модели, backbone-контролеры, и многое другое. Например генерируем модель order:

$ yo backbone:router order
   create app/scripts/routes/order.js
   create test/routers/order.spec.js
$ yo backbone:collection order
   create app/scripts/collections/order.js
   create test/collections/order.spec.js
$ yo backbone:model order
   create app/scripts/models/order.js
   create test/models/order.spec.js
$ yo backbone:view order
   create app/scripts/templates/order.ejs
   create app/scripts/views/order.js
   create test/views/order.spec.js

В Gruntfile.js уже внесено несколько задач, допустим можно сделать сборку, или запустить livereload и вносить изменения интерактивно. Попробуем:

$ grunt serve
Running "serve" task

Running "clean:server" (clean) task
>> 1 path cleaned.

Running "createDefaultTemplate" task

Running "jst:compile" (jst) task
File .tmp/scripts/templates.js created.

Running "sass:server" (sass) task

Running "connect:livereload" (connect) task
Started connect web server on http://localhost:9000

Running "open:server" (open) task

Running "watch" task
Waiting...

Таким образом, конкретные генераторы устанавливаются и запускаются отдельно, yo выступает в качестве стартера, и декларирует оформление генераторов. Вы можете оформить собственный генератор, опубликовать его на githab-e, и использовать его в повседневных проектах.
В данном посте рассматривался небольшой набор возможностей одного из генератора. Поискать готовые генераторы, и ознакомиться с полный функционалом, можно на соответствующем странице проекта yeoman.