add robots.txt & sitemap

Author: lkeegan

.github/workflows/deploy.yml

@@ -6,12 +6,12 @@ jobs:
   build:
     runs-on: ubuntu-latest
     permissions:
-      contents: write
+      contents: read
     steps:
       - uses: actions/checkout@v6
       - uses: pnpm/action-setup@v4
         with:
-          version: 8
+          version: 10
       - uses: actions/setup-node@v6
         with:
           node-version: 22

README.md

@@ -8,24 +8,25 @@
 ## How it works
 
 - the contents of each page are stored in [yaml](https://yaml.org/) format in [src/content](/src/content)
-- there is a corresponding [pug](https://pugjs.org/) HTML template for each page in [src/pug](/src/pug)
+- there is a corresponding [Nunjucks](https://mozilla.github.io/nunjucks/) HTML template for each page in [src/pages](/src/pages)
 - uses CSS and icons from the [Bootstrap](https://getbootstrap.com/) framework
 - uses [pnpm](https://pnpm.io/) and [webpack](https://webpack.js.org/) to manage the build and dependencies
+- uses [Eleventy](https://www.11ty.dev/) as the static site generator
 
 ## Structure
 
 - [src/content](/src/content)
   - each page has a yaml file with the content for that page
-  - this data is made available as `content` to the pug template of the same name
-- [src/pug](/src/pug)
-  - each page has a [pug](https://pugjs.org/) template
+  - this data is made available to the Nunjucks template of the same name
+- [src/pages](/src/pages)
+  - each page has a [Nunjucks](https://mozilla.github.io/nunjucks/) template (`.njk`)
   - the html page is generated from this template
-  - it inherits the base layout from [src/pug/layouts/base.pug](/src/pug/layouts/base.pug)
-  - it can use functions ('mixins') from [src/pug/mixins](/src/pug/mixins)
+  - it inherits the base layout from [src/pages/\_includes/layouts/base.njk](/src/pages/_includes/layouts/base.njk)
+  - it can use functions ('macros') from [src/pages/\_includes/macros](/src/pages/_includes/macros)
 - [src/assets](/src/assets)
   - contains the image and video files
-- [src/scss](/src/scss)
-  - import and customize [Bootstrap css](https://getbootstrap.com/docs/5.3/customize/sass/)
+- [src/css](/src/css)
+  - custom CSS styles
 - [src/js](/src/js)
   - additional client-side javascript
 - [src/index.js](/src/index.js)
@@ -58,8 +59,9 @@ On every commit to the main branch:
 
 To add a page `X`:
 
-- create a text file `src/pug/X.pug` with the contents `extends layouts/base`
 - create a text file `src/content/X.yml` with the contents `page_title: "X"`
+- create a text file `src/pages/X.njk` that extends the base layout
+- create a text file `src/pages/X.11tydata.js` with the contents `module.exports = require("./_helpers/loadContent")("X.yml");`
 - add an entry for it to the list of pages in [src/content/navbar.yml](src/content/navbar.yml)
 
 ## Acknowledgements

src/scss/styles.css src/css/styles.csssrc/scss/styles.css renamed to src/css/styles.css

@@ -8,7 +8,7 @@ import "bootstrap/js/dist/modal";
 // import CSS
 import "bootstrap/dist/css/bootstrap.min.css";
 import "bootstrap-icons/font/bootstrap-icons.min.css";
-import "./scss/styles.css";
+import "./css/styles.css";
 
 // import custom js
 import "./js/modal_on_pageload";

src/index.js

@@ -14,7 +14,7 @@
         {% if '.png' in image_file %}
         <source srcset="assets/{{ image_file | replace('.png', '.webp') }}" type="image/webp">
         {% endif %}
-        <img class="d-block mx-auto w-100" src="assets/{{ image_file }}" alt="{{ image_file }}">
+        <img class="d-block mx-auto w-100" src="assets/{{ image_file }}" alt="{{ image_file }}" loading="lazy">
       </picture>
     </div>
     {% endfor %}

src/pages/_includes/macros/image_carousel.njk

@@ -29,6 +29,6 @@
   </div>
 </section>
 <div class="container text-center">
-  <img class="w-25" src="assets/BMBF_logo_en.jpeg" alt="BMBF logo">
+  <img class="w-25" src="assets/BMBF_logo_en.jpeg" alt="BMBF logo" loading="lazy">
 </div>
 {% endblock %}

src/pages/index.njk

@@ -0,0 +1,8 @@
+---
+permalink: /robots.txt
+eleventyExcludeFromCollections: true
+---
+User-agent: *
+Allow: /
+
+Sitemap: https://spatial-model-editor.github.io/sitemap.xml

src/pages/robots.njk

@@ -0,0 +1,12 @@
+const fs = require("fs");
+const path = require("path");
+const YAML = require("yaml");
+
+const contentDir = path.resolve(__dirname, "../content");
+const navbarData = YAML.parse(
+  fs.readFileSync(path.join(contentDir, "navbar.yml"), "utf8"),
+);
+
+module.exports = {
+  navbar: navbarData,
+};

src/pages/sitemap.11tydata.js

@@ -0,0 +1,12 @@
+---
+permalink: /sitemap.xml
+eleventyExcludeFromCollections: true
+---
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+  {% for name, url in navbar.pages %}
+  <url>
+    <loc>https://spatial-model-editor.github.io/{{ url }}</loc>
+  </url>
+  {% endfor %}
+</urlset>