Nuxt (SEO, Content, UI)

Introduction

Wanted, thought I should make a blog to keep my content changing so decided this was the approach

Content

So my goal was to make it as easy as possible to write articles without have to rethink everything. Markdown is something I have not used a lot and therefore would provide so benefit. This is how far I have gotten. Installed @nuxt/content, @nuxtjs/seo, enabled them in nuxt.config.ts. Installed plugin remark-reading-time. Here is the content from nuxt.config.ts which adds the plugin and defines which language themes to load.

export default defineNuxtConfig({
...
    content: {
        build: {
            markdown: {
                highlight: {
                    theme: 'github-dark-dimmed',
                    preload: ['csharp', 'cs', 'xml', 'sql', 'c', 'php'],
                },
                toc: {
                    depth: 3,
                    searchDepth: 2,
                },
                remarkPlugins: {
                    'remark-reading-time': {},
                },
            },
        },
    },
})

And the content.config.ts which defines the schema.

import { defineCollection, defineContentConfig } from '@nuxt/content'
import { defineSitemapSchema } from '@nuxtjs/sitemap/content'
import { z } from 'zod'

export default defineContentConfig({
    collections: {
        articles: defineCollection({
            type: 'page',
            source: 'articles/**/*.md',
            schema: z.object({
                title: z.string(),
                date: z.date(),
                description: z.string(),
                tags: z.optional(z.array(z.string())),
                author: z.string(),
                author_avatar: z.string(),
                author_description: z.string(),
                thumbnail: z.string(),
                rawbody: z.string(),
                sitemap: defineSitemapSchema({
                    name: 'articles',
                    loc: entry => entry.path,
                    onUrl: url => {
                        url.priority = 0.7
                    },
                }),
            }),
        }),
    },
})

To generate the types run this

npx nuxi prepare

So my articles are under content/articles and contain

---
title: "NANO EEPROM using a Nano"
date: 2025-05-27
description: A first bash at an EEPROM programmer
tags: [nano micro-controller]
author: Iain (Bill) Wiseman
author_avatar: /assets/avatars/windy_avatar.jpg
author_description: "Morning Windy"
thumbnail: /assets/articles/nano-eeprom-page.jpeg
---
A while ago, I started my interest in the 6502, where it all began for me. This led me to Ben Eater and building an 8-bit computer, which in turn led me to building an EEPROM programmer that required a Nano. I had a bit of work to do, and my interest seemed to be waning a little—partly because of the time it took to get it working and partly because I just felt demotivated. I solved my motivation problem by returning to Rust and saw that it is possible to run it on a Nano Every. Let the games begin.