Шаблонизатор html для новчиков: как сделать первые шаги?

Question

[Kote]

Добрый день, интересует пошаговая инструкция для чайника.

Есть: mac osx, установил в консоли Node (для примера) + nunjacks (показался хорошим для старта)

Задача: я бы хотел иметь в папочках куски шаблонов, и с помощью того или иного шаблонизатора (наиболее простого, нужны по сути иклуды + переменные) получать результирующий собранный файлик html. При редактировании кусочков - автокомипилляцию результирующего файла.

К сожалению, все что я нахожу в сети - это тупо вставка js версии шаблонизатора и сборка на лету в браузере - мне это не подходит.

Я с консолью на "вы" и понятия не имею, как пользоваться и с чего начать.

Поможете пошагово написать простыми действиями - как сделать пару кусков шаблона и копились их в 1 на маке osx?

Благодарю заранее.

Comments

[Cyber_bober]

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

[Kote]

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

Answer 1

[Андрей Хохлов]

Разберитесь Gulp
gulpjs.com
+ тысячи ссылок в гугле и вопросов на тостере, не ленитесь поискать

Затем рекомендую взять Jade в качестве шаблонизатора
https://www.npmjs.com/package/gulp-jade
jade-lang.com
Или Handlebars
handlebarsjs.com

Можете взять что-то готовенькое
https://github.com/tars/tars
https://github.com/CSSSR/csssr-project-template
но мне кажется будет сложнее разобраться сразу в таком комбайне.

Comments

[Kote]

гульп - видел, но как я понимаю, это вопрос уже автоматизации. джейд - да, тоже смотрел, однако его дока для меня сложна. Я консоль вижу впервые в жизни и для набор спи команд - пока темный лес.

Вероятно, было наивно полагать что кто либо распишет механику на простом примере - что ж, спасибо, будем методом проб и ошибок пытаться завести!

[Андрей Хохлов]

Kote: Я считаю автоматизация с gulp'ом вопрос первоочередной. Потому что напрямую из консоли в данном случаем все будет не очень удобно.

Почитайте про node.js и npm, что такое локальная установка пакета и что такое глобальная.

Допустим вы выбрали Jade. Пока не трогаете Gulp, просто хотите чтобы из файла page.jade получился page.html.

Инструкция на простом примере уже есть:
jade-lang.com/command-line

на маке у вас скорее всего нужно будет сделать так:
sudo npm install jade -g
теперь jade установлен и можем им пользоваться
jade page.jade page.html
из файла page.jade получаем page.html

Все просто)

Answer 2

[Максим]

из всего того что Андрей Хохлов предложил Jade я использую , вещь но без него я делаю быстрее но самый лучший препроцессор html это php