Video 49: Advanced Templating
This commit is contained in:
parent
a2d9baf6e7
commit
3bc267a057
@ -1,22 +1,25 @@
|
|||||||
const path = require('path')
|
const path = require('path')
|
||||||
const express = require('express')
|
const express = require('express')
|
||||||
|
const hbs = require('hbs')
|
||||||
|
|
||||||
const app = express()
|
const app = express()
|
||||||
|
|
||||||
// Define paths for Express config
|
// Define paths for Express config
|
||||||
const publicDirectoryPath = path.join(__dirname, '../public')
|
const publicDirectoryPath = path.join(__dirname, '../public')
|
||||||
const viewsPath = path.join(__dirname, '../templates')
|
const viewsPath = path.join(__dirname, '../templates/views')
|
||||||
|
const partialsPath = path.join(__dirname, '../templates/partials')
|
||||||
|
|
||||||
// Setup handlebars engine and views location
|
// Setup handlebars engine and views location
|
||||||
app.set('view engine', 'hbs')
|
app.set('view engine', 'hbs')
|
||||||
app.set('views', viewsPath)
|
app.set('views', viewsPath)
|
||||||
|
hbs.registerPartials(partialsPath)
|
||||||
|
|
||||||
// Setup static directory to serve
|
// Setup static directory to serve
|
||||||
app.use(express.static(publicDirectoryPath))
|
app.use(express.static(publicDirectoryPath))
|
||||||
|
|
||||||
app.get('', (req, res) => {
|
app.get('', (req, res) => {
|
||||||
res.render('index', {
|
res.render('index', {
|
||||||
title: 'Weather App',
|
title: 'Weather',
|
||||||
name: 'Jason Williams'
|
name: 'Jason Williams'
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
@ -30,7 +33,9 @@ app.get('/about', (req, res) => {
|
|||||||
|
|
||||||
app.get('/help', (req, res) => {
|
app.get('/help', (req, res) => {
|
||||||
res.render('help', {
|
res.render('help', {
|
||||||
helpText: 'This is some helpful text.'
|
helpText: 'This is some helpful text.',
|
||||||
|
title: 'Help',
|
||||||
|
name: 'Jason Williams'
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
|
1
web-server/templates/partials/footer.hbs
Normal file
1
web-server/templates/partials/footer.hbs
Normal file
@ -0,0 +1 @@
|
|||||||
|
<p>Created by {{name}}</p>
|
7
web-server/templates/partials/header.hbs
Normal file
7
web-server/templates/partials/header.hbs
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
<h1>{{title}}</h1>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<a href="/">Weather</a>
|
||||||
|
<a href="/about">About</a>
|
||||||
|
<a href="/help">Help</a>
|
||||||
|
</div>
|
@ -7,9 +7,9 @@
|
|||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<h1>{{title}}</h1>
|
{{>header}}
|
||||||
<img src="/img/me.jpg">
|
<img src="/img/me.jpg">
|
||||||
<p>Created by {{name}}</p>
|
{{>footer}}
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
@ -7,8 +7,9 @@
|
|||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<h1>Help</h1>
|
{{>header}}
|
||||||
<p>{{helpText}}</p>
|
<p>{{helpText}}</p>
|
||||||
|
{{>footer}}
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
@ -8,8 +8,8 @@
|
|||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<h1>{{title}}</h1>
|
{{>header}}
|
||||||
<p>Created by {{name}}</p>
|
{{>footer}}
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
Loading…
Reference in New Issue
Block a user