safemaio.blogg.se

Pug template engine example
Pug template engine example





pug template engine example

Inability to use partials is one of the headaches with HTML Creating a modular page, wherein a header and footer files are separate and they are included in the layout file, with content block coming from respective page files is impossible with HTML. Using partials (partial views) is another benefit of the Pug.This helps you in using simple logic in the templates like setting classes and few other things.Ī.navbar-item.is-tab(class=(page = 'blog' ? 'is-active' : undefined) href="blog") BlogĪs seen from above example, I am able to set the class of anchor tag to is-active if the page is the blog. In fact, you can include regular JavaScript expressions inside Pug. Pug template engine allows using variables in the template.P.level-item.has-text-centered Get in touch The following example will make it clear on how indentations work in Pug.ĭiv. Plus if you are coming from Python background, it will be an added advantage because Pug will make you feel like home. A coding standard is forced on you which makes the teamwork and sharing of code easier than HTML. Indentations give the code a cleaner look.

pug template engine example

So my journey with the Pug template engine started. I was ok with the additional step of transpiling Pug to HTML, as anyway, I had setup Gulp to automate the process. These two reasons were sufficient for me to try out this new cool kid on the block. It always felt extremely bloated and not so human-friendly. I am a Python programmer, hence I am habituated with indentations. Yes, that was the first and foremost reason, I liked Pug. So why I decided to try Pug template engine?

pug template engine example

But since the browser cannot understand pug files, they need to be transpiled to HTML. So basically an alternative to typing HTML. You need to create ‘.pug’ files and transpile them to HTML. For those who do not know what Pug templating engine is let me give a brief introduction. So when I heard of this new template engine Jade (It is now renamed as Pug), I was quite excited by it, as Pug required indentations and not opening and closing tags like HTML. I like all the cool and latest things that can increase my productivity as a developer.







Pug template engine example