This Blog is now a Svelte Site

Ryan Weal
Published 2021-03-12

A running theme on my blog has been announcmenets of when I change out the platform on which this thing runs. So far we have been through shell scripts, Drupal instances, a JavaScript/metalsmith edition, and now finally a Svelte site.

Most of my work these days is actually in Vue/Nuxt JavaScript universe but I decided to use Svelte for this project for a number of reasons:

  • The default template is nearly perfect. Oriented toward good typography, out of the box.
  • Using rollup.js rather than webpack by default is very fast!
  • Sapper, the site generator, makes it very clear what code is running during generate vs. what code runs for the user at runtime.
  • No more crazy "custom link" code, such as the nuxt-link tag. Just use anchor tags.

These reasons all amounted to Svelte being "good enough" to give it a try and it was overall a very pleasant experience. Things did take longer than I expected, as they always tend to do, but this time it was all based on foward development rather than having to "undo" presumptions that came with the framework.

That is a fancy way of saying "I did not get stuck on anything" and "I did not give up because I was confused"... everything was very clear and I only took awhile to finish it because I wanted to give it the extra love and attention to make it the perfect fit for what I wanted.

Where I made customizations

  • Most of the content is imported from Markdown
  • Each section of the site has it's own source folder and outputs "category" RSS feeds
  • Every post has a comment form that sends me an email (no public comments, sorry, haha!)
  • All posts have a donation option!

The donation option was interesting - I ported an entire app from Vue.js to make this possible. It made things take considerably longer but I have a much deeper understanding of the framework having done this.

One cool thing about the donation workflow - it was very easy to include external scripts and work with them any way I liked. So rather than have an EU Cookie Compliance banner I was able to not load any cookies at all until you click the donation link. So the donation link itself is the cookie consent. Up until that point no cookies are served so no need for the cookie banner! Yay!

Some experimental things

  • I provided a link to a service that outputs the RSS feeds to your email. This means I do not have to manage any mailing lists. I don't know if the service is any good, but it is worth a try!
  • Custom infrastructure... I always self-host, even though it is extra effort. This time it is fully dockerized.
  • Serverless functions. The comment and donation workflows both require some server processing. I wrote these as though they were serverless functions that can run on a service like Vercel... but then I also wrote an API loader that is similar to Vercel so I can run the same functions on my local infrastructure.

These exeprimental things mostly help me manage the site as an individual without getting into too much overhead. If I need to change any of these things it will be easy to adapt them to use other platforms/technologies and that is the most exciting part of all!

Thanks for Reading!
Ryan Weal (LinkedIn)
🍪 ☕
Send a comment 💬
Published by Kafei Interactive