Jade, для чего это нужно?

Question

[Максим]

Для чего нужен препроцессор ?

Не только Jade но и Sass , Less , и прочие Не ужели Emmet не справляется со свей задачей ?

Но ведь что бы пользоваться этими плюшками столько требуется устанавливать, лишнего, не нужного. Установить ещё мало но даже что бы что то получилось ещё и компиляция, не ужели это удобнее чем тыкнуть пальцем на три клавиши

Comments

[Максим]

копия моего вопроса на ruSO :ru.stackoverflow.com/questions/545360/jade-%D0%B4%...

Answer 1

[Сергей delphinpro]

Поймите уже что emmet и jade/sass решают разные задачи.
Emmet разворачивает короткие аббревиатуры в полные выражения во время написания кода, что дает значительное ускорение в работе. Но это всё что он умеет.
Препроцессоры и шаблонизаторы обрабатывают ваш код после его сохранения. Они позволяют аккуратно структурировать код, разделяя его на логически завершенные блоки.
Шаблонизатор позволяет не копипастить кучу карточек товара в каталоге (например), а написать цикл и использовать в нем единственный подшаблон карточки. Если потребуется (а во время верстки обычно требуется ), то меняем код карточки только в одном месте, а не десяток-другой накопипасщенных. Это только пара примеров использования шаблонизатора, но и из них видно, что Emmet сюда ну никак не приплетешь.
Препроцессоры тоже дают кучу плюшек и возможностей: переменные, миксины, условные конструкции и циклы, и много всего (emmet здесь тоже не при делах). Честно говоря, все это много раз пережевано в интернете. Вам следовало бы ознакомится с несколькими статьями по теме, а не вопросы задавать.

Comments

[Максим]

например приведите статью - плиз Но на обычном css html так же можно создать блок или карточку и просто его копировать сколько угодно - разве нет ?

[Сергей delphinpro]

Максим Жаров: Вы читали мой ответ? :) Накопировали 20 карточек. Нужно поменять все. Опа.
Ну и просто сравните два кода:
без шаблонизатора

<div class="card card-1">
	<span>Карточка №1</span>
	...  many code
</div>
<div class="card card-2">
	<span>Карточка №2</span>
	...  many code
</div>
<div class="card card-3">
	<span>Карточка №3</span>
	...  many code
</div>
<div class="card card-4">
	<span>Карточка №4</span>
	...  many code
</div>
<div class="card card-5">
	<span>Карточка №5</span>
	...  many code
</div>
<div class="card card-6">
	<span>Карточка №6</span>
	...  many code
</div>
<div class="card card-7">
	<span>Карточка №7</span>
	...  many code
</div>
<div class="card card-8">
	<span>Карточка №8</span>
	...  many code
</div>
<div class="card card-9">
	<span>Карточка №9</span>
	...  many code
</div>
<div class="card card-10">
	<span>Карточка №10</span>
	...  many code
</div>

и вариант с шаблонизатором

{% for card in cards %}
    <div class="card card-{{ card.index }}">
         <span>{{ card.title }}</span>
         ...  many code
    </div>
{% endfor %}

[Сергей delphinpro]

По поводу статьи я даже не знаю что ответить O_O
Ну вот так, наверное: Search in google: "Для чего нужен препроцессор"
или "sass для новичков"

[Максим]

Сергей: спс

[Максим]

Сергей: конечно проще с шаблонизатором

[Сергей delphinpro]

Максим Жаров: Еще и программист, который будет работать с вашей версткой помянет вас добрым словом :)
Ведь ему не нужно будет разгребать тонны голого html, а просто взять повторяющий кусочек из шаблона и легко и непринужденно встроить его в систему шаблонов своей CMS.

[Максим]

Сергей: а кто сказал что тонны статичного html ? я всё вывожу в php циклах , так что блок у меня или что надо всего по одному , просто тот же шаблон статичный а вывод динамичный

Answer 2

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

Чтобы быстрее разрабатывать и проще поддерживать.

Если вы не понимаете зачем нужны эти инструменты - значит вы не умеете ими пользоваться.
Научитесь - и вопрос отпадет сам собой.

Answer 3

[Алексей]

Шаблонизаторы сильно упрощают жизнь при вёрстке нескольких однотипных страниц. С типичными блоками, с несколькими блоками с минимальными различиями.

Answer 4

[sergey]

Когда читаю подобные вопросы, я просто офигиваю. Что вы сравниваете gulp/sass и emmet, вы бы еще велосипед и самолет сравнили. И да обычно такие вопросы задают люди далекие от верстки, потому как верстать без применения препроцессоров это то же самое что идти пешком в другую страну, идти можно но зачем:))), если можно ехать, лететь и т.д. Ладно хватит лирики. Мало-мальский проект, на 15-20 страниц - вы просто запаритесь его пилить вручную, ну насколько же проще когда: заданы переменные, прописаны миксины, составлены таски (gulp) и дальше одной командой ты получаешь готовое решение, компиллированую страницу, причем страницы во многих случаях повторяющиеся (структура некоторых элементов), а это упрощает рутину и т.д. Можно много говорить, лучше возьмите и почитайте, 21 век за окном.
И да emmet к этому всему не имеет никакого отношения, вы путаете понятия.