CODEWITHSUNDEEP
htmlnode.jslayoutexpresshogan.js
K.J.
K.J.

Reputation: 941

Partials with Hogan.js

I would like to start by saying I am new to Node.js.

My question is this. Is there a way in which a single layout can be used for the HTML? Something similar to shared views and Master Layouts in MCV and ASP respectively.

For example:

//. hello_world.hjs

<!DOCTYPE html>
<html>
  <head>
    <title>{{ title }}</title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1>{{ title }}</h1>
    <div id="content">
        <!-- Place changing page content here -->
        {{> part }}
    </div>
    <footer>
        {{date}}
    </footer>
  </body>
</html>

//. hello_world.js

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('hello_world', { 
    title: 'Hello World!', 
    partials: { 
        part: 'part'
    }
  });
});

//. part.html

<h1>This is a part</h1>

I am only looking to change the content in the div with the id "content" in hello_world.hjs This way when an update is made to the footer or navigation bar changes won't have to be made to every document.

folder structure ->

routes
-- hello_world.js

views
--hello_world.hjs
--part.html
--index.hjs

I have tried searching for a solution. However, I am not sure if I am using the proper terminology in my searches.

Upvotes: 1

Views: 1067

Answers (1)

K.J.
K.J.

Reputation: 941

The part.html had to be renamed to part.hjs. However, this still does not answer the entire question. Though I am now able to use partials I need to be able to use a consistent layout and I would like to not have to repeat myself with in the JS files such as:

partials: { 
    part: 'part',
    footer: 'footer'
}

Retyping that across a large website is going to get old and become prone to typos.

Upvotes: 1

Related Questions