Eleventy v2 update and other small enhancements (#73)

* Update 11ty version to latest v2 beta * Add explanation for Netlify CMS preview CSS * Add explanation comment * Update Readme to reflect latest changes * Add missing metaDescription field to posts * Add missing metaDescription field * Add missing metaDescription fields * Move all deps to devDependencies for clarity * Make .nvmrc file optional * Add note about Node 14+ requirement * Revert "Make .nvmrc file optional" This reverts commit 43eb8ad. * Update dependencies * Bump required node version to 16 * Tidy up comments * Add Eleventy generator tag to head * Tidying * Remove deprecated renderData references * Add a link on welcome page to the CMS login
danurbanowicz · Feb 8, 2023 · 79e26b3 · 79e26b3
1 parent 59e5935
commit 79e26b3
Show file tree

Hide file tree

Showing 17 changed files with 41 additions and 26 deletions.
diff --git a/.eleventy.js b/.eleventy.js
@@ -79,6 +79,7 @@ module.exports = function(eleventyConfig) {
   eleventyConfig.addPassthroughCopy("favicon.ico");
   eleventyConfig.addPassthroughCopy("static/img");
   eleventyConfig.addPassthroughCopy("admin/");
+  // We additionally output a copy of our CSS for use in Netlify CMS previews
   eleventyConfig.addPassthroughCopy("_includes/assets/css/inline.css");
 
   /* Markdown Plugins */

diff --git a/.nvmrc b/.nvmrc
@@ -1 +1 @@
-12
+16
diff --git a/README.md b/README.md
@@ -20,10 +20,12 @@ Based on the [Eleventy Base Blog](https://github.com/11ty/eleventy-base-blog) re
 
 ## Features
 
-* Uses the official [Eleventy Navigation](https://www.11ty.dev/docs/plugins/navigation/) plugin to build menus
+* NEW: Now using Eleventy v2.0 (requires Node 14 or above!)
 * Sample pages and a blog with tag support
 * Netlify CMS with editor previews (thanks [@biilmann](https://github.com/biilmann)!)
+* Scores 100/100/100/100 in Lighthouse performance tests
 * Maintenance-free post author archives
+* Automatic navigation menus with [Eleventy Navigation](https://www.11ty.dev/docs/plugins/navigation/)
 * Includes a working contact form
 * CSS 2kb minified, inlined for fastest page render
 * Optional pipeline for minified inline JS

diff --git a/_includes/components/head.njk b/_includes/components/head.njk
@@ -1,12 +1,14 @@
 <head>
   <meta charset="utf-8">
+  <meta name="generator" content="{{ eleventy.generator }}">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>{{ renderData.title or title or metadata.title }}</title>
-  <meta name="description" content="{{ metaDescription or renderData.metaDescription or metadata.description }}">
+  <title>{{ title or metadata.title }}</title>
+  <meta name="description" content="{{ metaDescription or eleventyComputed.metaDescription or metadata.description }}">
   {% set css %}
     {% include "assets/css/inline.css" %}
   {% endset %}
   <style>{{ css | cssmin | safe }}</style>
+  {# Uncomment below if you want to include minified inline JavaScript #}
   {# {% set js %}
     {% include "assets/js/inline.js" %}
   {% endset %}

diff --git a/_includes/components/nav.njk b/_includes/components/nav.njk
@@ -1,10 +1,10 @@
 <nav>
   {% set navPages = collections.all | eleventyNavigation %}
   <ul>
-  {%- for entry in navPages %}
-    <li>
-      <a href="{{ entry.url | url }}"{% if entry.url == page.url %} data-current="current item"{% endif %}>{{ entry.title }}</a>
-    </li>
-  {%- endfor %}
+    {%- for entry in navPages %}
+      <li>
+        <a href="{{ entry.url | url }}"{% if entry.url == page.url %} data-current="current item"{% endif %}>{{ entry.title }}</a>
+      </li>
+    {%- endfor %}
   </ul>
 </nav>
diff --git a/author.njk b/author.njk
@@ -1,18 +1,17 @@
 ---
-title: Author archive
 layout: layouts/base.njk
 pagination:
   data: collections.authors
   size: 1
   alias: author
 permalink: "authors/{{ author | slug }}/"
-renderData:
+eleventyComputed:
   author: "{{ author }}"
   title: "Posts by {{ author }}"
   metaDescription: "An archive of all posts by the author: {{ author }}."
 ---
 
-<h1>{{ renderData.title | safe }}</h1>
+<h1>{{ title }}</h1>
 
 <section>
 	{% for post in collections.authors[author] | reverse %}

diff --git a/netlify.toml b/netlify.toml
@@ -10,9 +10,9 @@
 #[[redirects]]
 #  from = "/*"
 #  to = "/blog/:splat"
+# status = 302
 
 # The default HTTP status code is 301, but you can define a different one e.g.
-# status = 302
 
 # Headers rule example
 # For more information see:- https://www.netlify.com/docs/netlify-toml-reference/

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "eleventy-netlify-boilerplate",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "A boilerplate for building a fast static website with the Eleventy static site generator, for deployment to Netlify.",
   "scripts": {
     "build": "npx @11ty/eleventy",
@@ -23,15 +23,12 @@
   },
   "homepage": "https://github.com/danurbanowicz/eleventy-netlify-boilerplate",
   "devDependencies": {
-    "@11ty/eleventy": "^1.0.2",
-    "luxon": "^3.1.1",
-    "markdown-it": "^13.0.1",
-    "markdown-it-anchor": "^8.6.6"
-  },
-  "dependencies": {
+    "@11ty/eleventy": "2.0.0-beta.3",
     "@11ty/eleventy-navigation": "^0.3.5",
-    "clean-css": "^5.3.1",
+    "clean-css": "^5.3.2",
     "html-minifier": "^4.0.0",
+    "luxon": "^3.2.1",
+    "markdown-it-anchor": "^8.6.6",
     "uglify-js": "^3.17.4"
   }
 }
diff --git a/pages/about.md b/pages/about.md
@@ -1,6 +1,6 @@
 ---
 title: About us
-metaDescription: This is a sample meta description. If one is not present in your page/post's front matter, the default metadata.desciption will be used instead.
+metaDescription: This is a sample meta description. If one is not present in your page/post's front matter, the default metadata.description will be used instead.
 date: 2017-01-01T00:00:00.000Z
 permalink: /about/index.html
 eleventyNavigation:

diff --git a/pages/contact.md b/pages/contact.md
@@ -1,7 +1,7 @@
 ---
 layout: layouts/contact.njk
 title: Get in touch
-metaDescription: This is a sample meta description. If one is not present in your page/post's front matter, the default metadata.desciption will be used instead.
+metaDescription: This is a sample meta description. If one is not present in your page/post's front matter, the default metadata.description will be used instead.
 section: contact
 date: 2018-01-01
 permalink: /contact/index.html

diff --git a/pages/home.md b/pages/home.md
@@ -13,6 +13,8 @@ This is a template for building a simple blog website with the [Eleventy static
 
 Includes [Netlify CMS](https://www.netlifycms.org) for WYSIWYG content editing, and [Netlify Forms](https://www.netlify.com/docs/form-handling) for processing your site's form data.
 
+[Log in to the Netlify CMS dashboard](/admin/)
+
 For more info on installation and usage, view the [project repo]({{ pkg.repository.url }}) on GitHub.
 
 Or click the button below to deploy your own copy of this project to Netlify.

diff --git a/posts/firstpost.md b/posts/firstpost.md
@@ -1,7 +1,7 @@
 ---
 title: This is the first example post
 metaDescription: This is a sample meta description. If one is not present in
-  your page/post's front matter, the default metadata.desciption will be used
+  your page/post's front matter, the default metadata.description will be used
   instead.
 date: 2019-01-01T00:00:00.000Z
 author: John Appleseed

diff --git a/posts/fourthpost.md b/posts/fourthpost.md
@@ -1,5 +1,8 @@
 ---
 title: This is the fourth example post
+metaDescription: This is a sample meta description. If one is not present in
+  your page/post's front matter, the default metadata.description will be used
+  instead.
 date: 2020-02-03
 author: John Doe
 summary: Why contemplating our mortality can be a powerful catalyst for change

diff --git a/posts/secondpost.md b/posts/secondpost.md
@@ -1,8 +1,11 @@
 ---
 title: This is the second example post
-summary: Why contemplating our mortality can be a powerful catalyst for change
+metaDescription: This is a sample meta description. If one is not present in
+  your page/post's front matter, the default metadata.description will be used
+  instead.
 date: 2020-01-01
 author: John Appleseed
+summary: Why contemplating our mortality can be a powerful catalyst for change
 tags:
   - sport
 ---

diff --git a/posts/the-fifth-and-hopefully-final-example-post.md b/posts/the-fifth-and-hopefully-final-example-post.md
@@ -1,5 +1,8 @@
 ---
 title: The fifth and hopefully final example post
+metaDescription: This is a sample meta description. If one is not present in
+  your page/post's front matter, the default metadata.description will be used
+  instead.
 date: 2020-10-15T12:23:39.598Z
 author: Jane Doe
 summary: Why contemplating our mortality can be a powerful catalyst for change

diff --git a/posts/thirdpost.md b/posts/thirdpost.md
@@ -1,5 +1,8 @@
 ---
 title: This is the third example post which has a slightly longer title than the others
+metaDescription: This is a sample meta description. If one is not present in
+  your page/post's front matter, the default metadata.description will be used
+  instead.
 date: 2020-01-01
 author: Jane Doe
 summary: Why contemplating our mortality can be a powerful catalyst for change

diff --git a/tags.njk b/tags.njk
@@ -10,7 +10,7 @@ pagination:
     - posts
 permalink: /tags/{{ tag }}/
 layout: layouts/base.njk
-renderData:
+eleventyComputed:
   title: "Tagged “{{ tag }}”"
   metaDescription: "All posts from the Blog tagged with “{{ tag }}”"
 ---