---
layout: "layouts/base"
permalink: /
---

{% from "macros/posts.njk" import list %}
<h1>Ahoj!</h1>
<p>
    Hello! My name is Devin. I'm a creative web developer in <a href="https://en.wikipedia.org/wiki/Victoria,_British_Columbia"
    target="_blank">Victoria, British Columbia</a>. If you want to learn more about me, check out my <a href="/about">about page</a>.
</p>
<p>
    I like to <a href="/posts">write</a> about <a href="/games">games</a>, <a href="/books">books</a>, and <a href="/watching/movies/recent">movies</a> to name a few things. There's a lot to explore, and I hope you have fun!
</p>
<section class="flow-space-2">
    <header class="flow">
        <h2>Favourite posts</h2>
        <p class="flow-space-0.25">Hand-picked, curated selection of my favourite posts!</p>
    </header>
    {% set favouritePosts = collections.post | filterFavourites | reverse %}
    {{ list(favouritePosts, "MM/DD/YYYY") }}
</section>
<section class="flow-space-2">
    <header>
        <h2>Recent posts</h2>
    </header>
    {% set recentPosts = collections.post | reverse | limit(5) %}
    {{ list(recentPosts, "MM/DD/YYYY") }}
</section>
<section class="flow-space-2">
    <header class="flow">
        <h2>Other pages</h2>
        <p class="flow-space-0.25">Some of my other pages you can check out!</p>
    </header>
    <ul class="cluster p-0 gap-0.5 list-none" role="list">
        <li>
            <a href="/about" class="button">About</a>
        </li>
        <li>
            <a href="/posts" class="button">Posts</a>
        </li>
        <li>
            <a href="/games" class="button">Games</a>
        </li>
        <li>
            <a href="/watching" class="button">Watching</a>
        </li>
        <li>
            <a href="/books" class="button">Books</a>
        </li>
        <li>
            <a href="/webrings" class="button">Webrings</a>
        </li>
        <li>
            <a href="/uses" class="button">/uses</a>
        </li>
        <li>
            <a href="/now" class="button">/now</a>
        </li>
        <li>
            <a href="/colophon" class="button">Colophon</a>
        </li>
        <li>
            <a href="/styleguide" class="button">Styleguide</a>
        </li>
        <li>
            <a href="/contact" class="button">Contact</a>
        </li>
        <li>
            <a href="/podroll" class="button">Podroll</a>
        </li>
    </ul>
</section>