add initial post

src/posts/2024-05-25-haskell-blog.md

@@ -2,10 +2,10 @@
 author: "Youwen Wu"
 authorTwitter: "@youwen"
 desc: "a purely functional...blog?"
-image: "./images/waiheke-stony-batter.jpg"
+image: "./images/gradient-ascent.jpg"
 keywords: "haskell, blog, functional programming"
 lang: "en"
-title: "Why I made my blog in haskell"
+title: "why I made my blog in haskell"
 updated: "2024-05-25T12:00:00Z"
 ---
 
@@ -13,21 +13,92 @@ Welcome! This is the first post on _gradient ascent_ and also one that tests all
 of the features.
 
 <img
-  alt="Grapevines among rolling hills leading to the sea"
-  src="./images/waiheke-stony-batter.jpg"
-  height="200"
+  alt="gradient ascent"
+  src="./images/gradient-ascent.jpg"
+  style="height: 200px; width: 80%; object-fit: cover"
 />
 
+I'll be writing about computers, code, math, video games, and whatever else
+here.
+
+## haskell?
+
+This entire blog is generated with [hakyll](https://jaspervdj.be/hakyll/). It's
+a library for generating static sites for Haskell, a purely functional
+programming language. It's a _library_ because it doesn't come with as many
+batteries included as tools like Hugo or Astro. You set up most of the site
+yourself by calling the library from Haskell.
+
+Here's a brief excerpt:
+
 ```haskell
-toSlug :: T.Text -> T.Text
-toSlug =
-  T.intercalate (T.singleton '-') . T.words . T.toLower . clean
+main :: IO ()
+main = hakyllWith config $ do
+    forM_
+        [ "CNAME"
+        , "favicon.ico"
+        , "robots.txt"
+        , "_config.yml"
+        , "images/*"
+        , "out/*"
+        , "fonts/*"
+        ]
+        $ \f -> match f $ do
+            route idRoute
+            compile copyFileCompiler
 ```
 
-We can also try some math. Here is a simple theorem:
+The code highlighting is also generated by hakyll.
+
+## why?
+
+Haskell is a purely functional language with no mutable state. Its syntax
+actually makes it pretty elegant for declaring routes and "rendering" pipelines.
+
+I originally wanted to build this entire blog myself. I had a working version
+with the Svelte framework, complete with GFM rendering, table of contents, KaTeX
+math, code highlighting, static generation, and other goodies. However, it
+seemed like a little too much work to maintain. I switched to hakyll because
+
+1. Haskell is cool.
+2. It comes with enough features that I don't feel like I have to build
+   everything from scratch.
+3. It comes with Pandoc, a Haskell library for converting between markdown
+   formats. It's probably more powerful than anything you could do in `nodejs`.
+   It renders all of the markdown to HTML as well as the math.
+   1. It supports KaTeX as well as MathML. I'm a little disappointed with the
+      KaTeX though. It doesn't directly render it, but simply injects the KaTeX
+      files and renders it client-side.
+
+Also, I can ship practically zero JavaScript with this site. The only script
+right now is the one that manages the light/dark toggle, and can be measured in
+_bytes_. I only ship a few fonts and a minified stylesheet.
+
+### speaking of math
+
+Instead of using KaTeX or MathJax, this site uses MathML. There's pros and cons
+to this.
+
+Pros:
+
+- A little more accessible
+- Can be rendered without additional stylesheets. I just installed the Latin
+  Modern font, but this isn't even really necessary
+- Built-in to most browsers (\#UseThePlatform)
+
+Cons:
+
+- Isn't fully standardized. Might look different on different browsers
+- Rendering quality isn't as good as KaTeX
+
+Let's try it now. Here's a simple theorem:
 
 $$
 a^2 + b^2 \ne c^2 \, \forall\,\left\{ a,\,b,\,c \right\} \in \mathbb{Z} \land a,\,b,\,c \ge 3
 $$
 
-Seems like it doesn't quite work yet.
+The proof is trivial and will be left as an exercise to the reader.
+
+## seems a little overengineered
+
+Probably is. Not as much as the old one, though.