Added category pages and subnav

- added category page template and generated category pages
- added a category-focused sub navigation component
- added category tags/links to the articles

src/_includes/components/articleList.njk

@@ -5,6 +5,7 @@
       <h2><a href="{{ article.url | url }}">{{ article.data.title }}</a></h2>
       <small>
         <time>{{ article.data.date | readableDate }}</time>
+        <a class="category" href="/blog/{{ article.data.category }}">{{ article.data.category }}</a>
       </small>
     </article>
   </li>

src/_includes/components/categoryNav.njk

@@ -0,0 +1,21 @@
+{% set categories =  collections.categoryList %}
+<nav role="navigation" aria-label="category navigation" >
+  <span>Filter posts by category:</span>
+  <ul>
+    <li class="category__link {{ ' active' if page.url == '/blog/'}}">
+      <a class="category__link" 
+        href="/blog"
+        {{ "aria-current" if page.url === "/blog/" }}
+          >all</a>
+    </li>
+    {%- for category in categories %}
+    {% set catUrl = ["/blog/", category.key, "/" ] |  join %}
+    <li class="category__link {{ ' active' if page.url == catUrl }}">
+      <a href="{{ catUrl }}"
+      {{ "aria-current" if page.url == catUrl }}>
+        {{ category.key }}
+      </a>
+    </li>
+    {%- endfor -%}
+  </ul>
+</nav>

src/_includes/layouts/article.njk

@@ -2,10 +2,11 @@
 layout: page
 ---
 
-<article>
+<article class="article">
   <h1>{{ title }}</h1>
   <small>
     Published: <time>{{ date | readableDate }}</time>
+    <a class="category" href="/blog/{{ category }}">{{ category }}</a>
   </small>
   {{ content | safe }}
 </article>

src/blog.njk

@@ -11,7 +11,7 @@ pagination:
 ---
 
 <h1>{{ title }}</h1>
-
+{% include "./_includes/components/categoryNav.njk" %}
 <p>This view contains a list of all blogposts sorted from newest to oldest.</p>
 
 {% include "./_includes/components/articleList.njk" %}

src/category.njk

@@ -0,0 +1,17 @@
+---
+layout: page
+pagination:
+  data: collections.categoryList
+  size: 1
+  alias: cat
+permalink: "/blog/{{ cat.key }}/"
+eleventyComputed:
+  title: Articles categorized under "{{ cat.name }}"
+---
+
+
+<h1>{{ title }}</h1>
+
+{% include "./_includes/components/categoryNav.njk" %}
+{% set articles = collections.categories[cat.key] | reverse %}
+{% include "./_includes/components/articleList.njk" %}