CODEWITHSUNDEEP
htmlnode.jsexpresspug
Cris Towi
Cris Towi

Reputation: 1211

HTML in Express and node.js?

I don't know if this a really noob question, but I have seen a lot of documentation about use Express in node.js and Express. But What I see is that they always use another lenguage called "Jade" for rendering an HTML file. Why? I'd like to know if its necesary use Jade or I can render templates in Express with HTML.

Upvotes: 2

Views: 575

Answers (2)

Plato
Plato

Reputation: 11072

If you do decide to use Jade, there are multiple ways of inserting your data, including placing raw HTML in an element in your jade file. You can also insert fragments of HTML if you manually bypass the sanitizers with !{ locals.someHtmlString }

You can check out a demo of the below Jade code (albeit without passing in the locals variables) here: http://cssdeck.com/labs/qkkrzfes

//app.js
app.get('/', function(req, res){
  locals.someData = {foo:'Bar'};
  locals.someHTML = '<span>hello</span>'
  res.render('someTemplate');

//someTemplate.jade
!!!
html
  head
  body
    p.someClass This is plain text that goes in the paragraph
    p#someId You can insert data into the text: #{locals.someData.foo}
    p <a href='/'>You can just slap HTML in willy nilly</a>
    p HTML is escaped by default: #{locals.someHTML}
    p Escape HTML with \!{}: !{locals.someHTML}
    pre
      code=JSON.stringify(locals.someData, null, 2)

Upvotes: 0

Jonathan Lonowski
Jonathan Lonowski

Reputation: 123563

No, it's not necessary to use Jade with Express. It's just a popular option since Jade is the default for generated applications and is maintained by the same developer as Express.

They also tend to stay up-to-date with each other, such as the addition of template inheritance in jade as express dropped support for layouts.

But, there are a number of other view engines that offer built-in support for Express. And, the consolidate project can be the mediator/glue so you have even more options:

  • atpl
  • dust
  • eco
  • ect
  • ejs
  • haml
  • haml-coffee
  • handlebars
  • hogan
  • jade
  • jazz
  • jqtpl
  • JUST
  • liquor
  • mustache
  • QEJS
  • swig
  • templayed
  • toffee
  • underscore
  • walrus
  • whiskers

Note: I believe I misunderstood your question and answered too broadly at first. But, leaving the rest of what I wrote below in case it's still useful.

It's not necessary to use a view engine with Express, but can be helpful.

Express can simply .send() a value as the response:

res.send(new Buffer('whoop'));
res.send({ some: 'json' });
res.send('some html');

But, a view engine like Jade can help with generating more complex, data-driven content from a view/template. They can also help to keep your project organized by intent (separation of concerns), since views are typically kept in their own files.

Albeit, a view engine is necessary if you want to use res.render(). This method depends on the 'view engine' application setting or that you've configured an app.engine().

app.set('view engine', 'jade'); // or ejs, swig, etc.

# ...

res.render('a-view'); // looks for `a-view.jade` based on `'view engine'`

app.engine('jade', require('consolidate').jade);

# ...

res.render('a-view.jade'); // matches the extension to the `.engine()`

Upvotes: 4

Related Questions