{"id":3165,"date":"2017-12-15T17:56:00","date_gmt":"2017-12-15T12:26:00","guid":{"rendered":"https:\/\/code4developers.com\/?p=3165"},"modified":"2017-12-15T17:56:00","modified_gmt":"2017-12-15T12:26:00","slug":"pug","status":"publish","type":"post","link":"https:\/\/code4developers.com\/pug\/","title":{"rendered":"Pug"},"content":{"rendered":"
\n

Pug<\/a> is a template language for Javascript that I have grown to enjoy a lot. My impression is that a lot of people use it, if they use a template engine for server side rendering using Node.<\/p>\n

<\/p>\n

The big question is if you need it or not in 2017. I personally believe that there is a place for it, when you just want to put together something really simple, where the interactivity of a full fledged front end system like React or Angular would be overkill. But you could probably make something similar yourself with template literals if your needs are really simple.<\/p>\n

But I personally just go with pug, because the syntax is elegant and easy to learn. It performs well. And it is really easy to use it with Express.<\/p>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

Pug is a template language for Javascript that I have grown to enjoy a lot. My impression is that a lot of people use it, if they use a template…<\/p>\n","protected":false},"author":7,"featured_media":3166,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[1],"tags":[80,79,81],"powerkit_post_featured":[],"class_list":{"0":"post-3165","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-uncategorized","8":"tag-node","9":"tag-pug","10":"tag-template-engine"},"jetpack_featured_media_url":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/12\/PugJs.png?fit=225%2C225&ssl=1","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/s8NAi4-pug","jetpack-related-posts":[{"id":3457,"url":"https:\/\/code4developers.com\/native-html5-games-with-phaser-and-capacitor\/","url_meta":{"origin":3165,"position":0},"title":"Native HTML5 Games with Phaser and Capacitor","author":"Arif Khoja","date":"April 17, 2018","format":false,"excerpt":"Building HTML5 games with Phaser has been somewhat of a hobby of mine over the past few years, and I will be writing a few tutorials about Phaser with a focus on developing HTML5 games for mobile. However, despite having created a few mostly finished games most of them never\u2026","rel":"","context":"In "Phaser"","block_context":{"text":"Phaser","link":"https:\/\/code4developers.com\/category\/phaser\/"},"img":{"alt_text":"phaser-starter-demo","src":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2018\/04\/phaser-starter-demo-1-300x227.gif?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":3194,"url":"https:\/\/code4developers.com\/react-hello-world-and-jsx\/","url_meta":{"origin":3165,"position":1},"title":"React: Hello World and JSX","author":"Arif Khoja","date":"January 8, 2018","format":false,"excerpt":"This is a typical Hello World implementation in React in JSX file. It shows one of two ways you can write components, and how you pass data to a components. import React, { Component } from 'react'; import ReactDOM from 'react-dom'; class App extends Component { render() { return (\u2026","rel":"","context":"In "React"","block_context":{"text":"React","link":"https:\/\/code4developers.com\/category\/react\/"},"img":{"alt_text":"react","src":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/12\/react_2.png?fit=375%2C375&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":3007,"url":"https:\/\/code4developers.com\/angular-4-components\/","url_meta":{"origin":3165,"position":2},"title":"Angular 4 Components","author":"Nisarg Dave","date":"July 28, 2017","format":false,"excerpt":"In this article, we will discuss about what is a component in Angular 4? In Angular 4 everything is component. Rather we can say components are the basic building blocks of Angular 4 applications. Component based web development is the future of web development.\u00a0The advantage of the component-based approach is\u2026","rel":"","context":"In "Angular"","block_context":{"text":"Angular","link":"https:\/\/code4developers.com\/category\/angular\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/06\/angular-2.png?fit=240%2C240&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":3106,"url":"https:\/\/code4developers.com\/javascript-template-literals\/","url_meta":{"origin":3165,"position":3},"title":"Javascript: What Are Template Literals?","author":"Arif Khoja","date":"September 30, 2017","format":false,"excerpt":"ES6 introduced two types of literals: Template Literals and Tagged Template Literals to tag Template Literals. In this post, we cover both of them in depth! In ES6, two types of literals were introduced: Template Literals for string concatenation and expression embedding in a string Tagged Template Literals to tag\u2026","rel":"","context":"In "JavaScript"","block_context":{"text":"JavaScript","link":"https:\/\/code4developers.com\/category\/javascript\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/06\/thumb-1-e1498942297714.png?fit=240%2C269&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":2613,"url":"https:\/\/code4developers.com\/ui-routing-basics\/","url_meta":{"origin":3165,"position":4},"title":"UI-Routing – Basics","author":"Arif Khoja","date":"June 17, 2017","format":false,"excerpt":"Introduction In the present scenario, AngularJS is the most trusted framework for the creation of Single Page Applications (SPA), and UI-Routing is one of the most important aspects. We want to keep our navigation feeling like a normal site and want to load the pages without refreshing the Browser. For\u2026","rel":"","context":"In "AngularJs"","block_context":{"text":"AngularJs","link":"https:\/\/code4developers.com\/category\/angularjs\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":3576,"url":"https:\/\/code4developers.com\/angular-6-features\/","url_meta":{"origin":3165,"position":5},"title":"Angular 6 Features","author":"Yatendrasinh Joddha","date":"May 9, 2018","format":false,"excerpt":"On 4th May 2018 angular team announced new version of Angular i.e., Angular V6. In this major release they are not much focusing on Framework but on toolchain. They have tried to unify the framework, CLI, and Material more. In this article we will talk about some of the major\u2026","rel":"","context":"In "Angular"","block_context":{"text":"Angular","link":"https:\/\/code4developers.com\/category\/angular\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/06\/angular-2.png?fit=240%2C240&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]}],"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/posts\/3165","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/comments?post=3165"}],"version-history":[{"count":1,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/posts\/3165\/revisions"}],"predecessor-version":[{"id":3167,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/posts\/3165\/revisions\/3167"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/media\/3166"}],"wp:attachment":[{"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/media?parent=3165"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/categories?post=3165"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/tags?post=3165"},{"taxonomy":"powerkit_post_featured","embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/powerkit_post_featured?post=3165"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}