NEW: Add <head> content (#26)

closes #26
dwhieb · May 15, 2024 · bf8d9a7 · bf8d9a7
1 parent 1445da7
commit bf8d9a7
Show file tree

Hide file tree

Showing 8 changed files with 51 additions and 6 deletions.
diff --git a/.gitignore b/.gitignore
@@ -128,3 +128,6 @@ dist
 .yarn/build-state.yml
 .yarn/install-state.gz
 .pnp.*
+
+# Project
+nodemon.json
diff --git a/app/handlebars.js b/app/handlebars.js
@@ -5,6 +5,7 @@ const hbs = new ExpressHandlebars({
   defaultLayout: `main/main.hbs`,
   extname:       `hbs`,
   layoutsDir:    path.resolve(import.meta.dirname, `../layouts`),
+  partialsDir:   path.resolve(import.meta.dirname, `../layouts/main`),
 })
 
 export default hbs
diff --git a/app/locals.js b/app/locals.js
@@ -0,0 +1,8 @@
+import path         from 'node:path'
+import { readFile } from 'node:fs/promises'
+
+const metaPath = path.resolve(import.meta.dirname, `../package.json`)
+const json     = await readFile(metaPath, `utf8`)
+const meta     = JSON.parse(json)
+
+export default { meta }
diff --git a/assets/images/textile.jpg b/assets/images/textile.jpg
diff --git a/assets/trillium.svg → assets/images/trillium.svg b/assets/trillium.svg → assets/images/trillium.svg
diff --git a/index.js b/index.js
@@ -6,6 +6,7 @@ import express                 from 'express'
 import handleUncaughtException from './app/errors.js'
 import hbs                     from './app/handlebars.js'
 import helmet                  from 'helmet'
+import locals                  from './app/locals.js'
 import logger                  from './middleware/logger.js'
 import path                    from 'node:path'
 import serveStatic             from './middleware/static.js'
@@ -17,6 +18,8 @@ process.on(`uncaughtException`, handleUncaughtException)
 // Initialize Express app
 const app = express()
 
+Object.assign(app.locals, locals)
+
 // Settings
 app.enable(`trust proxy`)
 app.engine(`hbs`, hbs.engine)

diff --git a/layouts/main/head.hbs b/layouts/main/head.hbs
@@ -0,0 +1,35 @@
+<head>
+
+  {{!-- critical metadata --}}
+  <meta charset=utf-8>
+  <meta name=viewport content='width=device-width, initial-scale=1, shrink-to-fit=no'>
+  <title>Nisinoon | {{ title }}</title>
+
+  {{!-- metadata --}}
+  <meta name=author content='{{ meta.author.name }}'>
+  <meta name=description content='{{ meta.description }}'>
+  <meta name=keywords content='{{#each meta.keywords}}{{#if @last}}{{@this}}{{else}}{{@this}}, {{/if}}{{/each}}'>
+  <meta name=rating content=general>
+  <meta name=robots content='index,follow'>
+
+  {{!-- linked metadata --}}
+  <link rel=author href=https://danielhieber.info>
+  <link rel=license href=https://github.com/dwhieb/Nisinoon/blob/main/LICENSE>
+
+  {{!-- Facebook sharing --}}
+  <meta property=og:description content='{{ meta.description }}'>
+  <meta property=og:image content=https://nisinoon.net/images/textile.jpg>
+  <meta property=og:image:height content=4553>
+  <meta property=og:image:width content=2727>
+  <meta property=og:locale content=en_US>
+  <meta property=og:title content=Nisinoon>
+  <meta property=og:type content=website>
+  <meta property=og:url content=https://nisinoon.net>
+  <meta property=og:site_name content=Nisinoon>
+
+  {{!-- Twitter sharing --}}
+  <meta name=twitter:card content=summary>
+  <meta name=twitter:creator content=@dwhieb>
+  <meta name=twitter:image:alt content='trillium textile applique'>
+
+</head>
diff --git a/layouts/main/main.hbs b/layouts/main/main.hbs
@@ -1,11 +1,6 @@
 <!DOCTYPE html>
 <html dir=ltr lang=en>
-  <head>
-    {{!-- critical metadata --}}
-    <meta charset=utf-8>
-    <meta name=viewport content='width=device-width, initial-scale=1, shrink-to-fit=no'>
-    <title>Nisinoon | {{ title }}</title>
-  </head>
+  {{> head }}
   <body>
     {{{ body }}}{{!-- This is actually <main> but express-handlebars calls this variable `body`. --}}
   </body>