Table of Contents

In this post I’m quickly describing my efforts to theme a plain vanilla Hakyll front end.

1 Motivation

Hakyll comes with a very basic plain black-and-white theme in paper style. Thanks to Pandoc, code blocks have all the markup, but it remains ignored initially. In what comes next I will describe how I’ve realized the present design. Gotta take some screenshots for comparison…

2 Vanilla Hakyll

3 Issues Arising

3.1 Mobile-Friendly

3.2 Accessibility-Friendly (Screenreaders etc.)

3.3 State of the JavaScript Ecosystem

4 Modern Front End

5 Choice of the Build Tools and the Lifecycle Management

Build automation is a boon. On this tiny scale of a blog, at first setting up a proper dev environment with a good pipeline is an effort not worth hassle. But as the complexity will rise, I will adopt more lifecycle management and automation tools, and blog about them.

For now, I’ve come to use Gulp + Babel + TypeScript + Parcel.

Next I’m planning to create a CV route, improve the interaction, adopt Stencil to create good web components, so in the end this blog looks and feels like a mobile app, and make it a proper PWA.

6 Choice of a Front-end Compiler: GHCJS vs PureScript vs Elm vs ReasonML vs TypeScript vs JavaScript

A thorough comparison deserves a separate post. Stay tuned. But for now, since I don’t yet need a full-fledged front end, there’s no reason to

7 Outro

I must admit, it has been a lot of fun. Modern front end development is a joy. And despite all the chaos in its ecosystem, choices can be made. This is in fact crucial.

Plans for the next couple of weeks:

  • Nitpicking on the design.
  • Make Haskell’s Sass library work with the Dart implementation that supports the more modern features.
  • Fix MathJax CDN errors due to the same-origin policy.
  • Fix MathJax CDN choice of fonts.
  • Improve the sidebar.
  • Implement dark-mode.
  • Implement sharing facilities.
  • Some quality posts.
  • Introduce D3.js data visualizations, including tag clouds and word cloud summaries.