New blog theme

In the previous blogging theme I hacked away in a few evenings I was lacking quite some functionality like search and paging. Also, the theme didn't score great in SEO and accessibility lighthouse audits.

In the last weeks, the team has been helping me rework the blog using our existing/battle-tested tools and packages.

Previous Blog

When I first moved my blog to Prezly I started from an empty NextJs project. Using the PrezlySDK and ChakraUI I was able to set up a blog with minimal effort.

But it had some issues and a list of todos that were already solved in other Prezly themes.

The new lifelog.be

This blog is still a Next.js application that is pulling in content from the Prezly CMS. But instead of starting from scratch, it's forked from the Prezly Bea theme which comes with everything I need to power this small blog.

The site is deployed on Vercel (the company behind Next). The developer experience is awesome where it auto deploys the blog on every commit/merge to main.

Lifelog.be deployment on Vercel
Lifelog.be deployment on Vercel

The site is rebuilt (Server Side Generation) and auto-deployed every time someone commits to main or when I write or update some content in Prezly.

But because the codebase is a fork from the Bea theme it's making us of different tools/packages that make my life so much easier:

  • prezly/sdk: interaction with Prezly APIs. Entity type definitions
  • prezly/content-renderer-react-js: story rendering that supports images, galleries, videos, embeds, tables, contact cards, etc....This package turns Prezly story format into React component(s)
  • prezly/analytics-nextjs: tracking snippet to feed interaction (page visits, email campaigns, ...) into Prezly while giving the visitor privacy controls.
  • prezly/theme-kit-nextjs: a collection of data-fetching functions, hooks and utility functions to reduce number of boilerplate/repetition code in different themes
  • prezly/themes-intl-messages: translated strings to enable theme translations
  • algolia: search functionality within the Prezly themes
  • next-plausible: enable plausible analytics on the blog

Upcoming/Todos

With this update, there are a lot of things that were addressed in the default Prezly theme. So my previous todo/issue list now looks like this:

  • ✅ Use theme-starter boilerplate code to fetch content
  • ✅ Score better on Lighthouse Audit tools
  • ✅ Allow paging from home page
  • ✅ Support Search
  • ✅ Implement subscribe functionality (stay updated)
  • ✅ Improve SEO/meta tags
  • Add RSS feed (and any other feed protocols people use)
  • ✅ Get rid of ChakraUI
  • Make better use of Uploadcare.com (using uploadcare-image)
  • ✅ Bring back sitemap.xml
  • Fetch intro text from newsroom boilerplate (make customiseable)