<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
  <title>Darren Platt</title>
  <subtitle></subtitle>
  <link href="https://darrenplatt.com/feed.xml" rel="self"/>
  <link href="https://darrenplatt.com/"/>
  
    <updated>2023-01-29T00:00:00Z</updated>
  
  <id>https://darrenplatt.com</id>
  <author>
    <name>Darren Platt</name>
    <email>blHUMANSREMOVETHISog@feb17.org</email>
  </author>
  
    
    <entry>
      <title>Choosing website technology</title>
      <link href="https://darrenplatt.com/posts/choosing-website-technology/"/>
      <updated>2023-01-29T00:00:00Z</updated>
      <id>https://darrenplatt.com/posts/choosing-website-technology/</id>
      <content type="html">
        <![CDATA[
      <p>I've procrastinated for years putting this site together. How hard is it to build a simple website? Seemingly harder all the time despite having more technology. I have had the domain forever. Apologies to all the other Darren Platts out there.</p>
<h2>Goals..</h2>
<p>I wanted something super simple, static, so there are no running processes. My main use cases are occasionally blogging. I am happy with vi and markdown for writing. Blogs needed tags, an RSS feed ideally, pagination, etc., decent ability to drop in code snippets with syntax highlighting. I wasn't in the mood to program regularly to maintain the site (ideally, dropping a markdown file in a folder is as much as I can be bothered with), but a little coding to set up the site is ok.</p>
<h2>Choosing tech for a website</h2>
<p>Then I <a href="https://xkcd.com/356/">nerd sniped</a> myself seriously choosing a tech stack. WordPress is too complicated, having managed other's sites (most recently, I dealt with a plugin system <em>inside</em> a WordPress plugin system - inception. The site was slow as hell too. I loved the idea of a simple static website, but there are too many choices. I briefly considered writing my own :) - how hard can it be? At least I'd understand how it worked for 5 minutes.</p>
<h3>FSharp-based solutions</h3>
<p>I love the language; it's efficient, easy to maintain, and should be ideal for generating a website. I looked at <a href="https://mangelmaxime.github.io/Nacara/">Nacara</a>, wanting something #fsharp friendly. <a href="https://github.com/ionide/Fornax">Fornax</a> gets an honorable mention too. Blogging in Nacara had more friction than  it should have. Maxime <a href="https://github.com/MangelMaxime/Nacara/issues/196">wisely pointed me</a>  at the underlying tech he was migrating to <a href="https://www.11ty.dev/docs/getting-started/">11ty</a> with Nacara as a plugin.</p>
<h3>Other popular options</h3>
<ul>
<li><a href="https://gohugo.io">Hugo</a> was another runner up seemed popular, also simple</li>
<li><a href="https://jekyllrb.com/">Jekyll</a> was well supported on hosting platforms like Git Hub, which is a consideration. I'm not wildly fond of Ruby.</li>
<li><a href="https://www.11ty.dev/">Eleventy/11ty</a> was also popular, recommended by Maxime, and looked simple and sane.</li>
</ul>
<p>So eleventy it is. I got to hello world in eleventy very quickly, and it <em>is</em> simple. The posting mechanism is elegant, and the default rending is ugly. So begins a second journey - finding a style for the site.</p>
<h2>Styling a website</h2>
<p>In theory, you can write your own CSS, but CSS for some reason, just melts my brain. I played with <a href="https://app.stackbit.com/create/theme">Stackbit</a> for a few minutes but it was going back to building a whole website again with jamstack. There are decent <a href="https://jamstackthemes.dev/theme/#ssg=eleventy">galleries of options</a>, and I liked the simplicity of <a href="https://github.com/yinkakun/eleventy-duo">Eleventy-Duo</a>. A quick template in git, <code>git clone</code>, and boom - you have a website (with someone else's picture!). Hacking something that already works is 20x faster than building from scratch, and the rest wasn't too painful. There is a point at which editing <code>JSON</code> data structures and building custom <code>CSS</code> styles became necessary (yes, I had to get my hands dirty eventually). I generated a list of publications programmatically that wasn't too painful.</p>
<p>I had one lingering bug. Two-level bullet indenting <a href="https://github.com/yinkakun/eleventy-duo/issues/18">seems to be broken</a> in the eleventy-duo system (not in eleventy itself). So bullets are all on one level for now.</p>
<h2>Images</h2>
<p>I will confess I used <a href="https://labs.openai.com/">DallE2</a> for the artwork and felt slightly guilty about it. I was in a hurry in my weak defense, but at some point would like to pay a human to make some images.   The <code>icon</code> definition was surprisingly challenging - these images are rendered at 32x32 or even lower resolution, and it's not easy to find something that works at that scale. There were some <a href="/images/icon_journey.png">fun ideas along the way</a>. The <a href="/images/letter_d_futuristic.png">letter D in a futuristic setting</a> prompt was fun but terrible viewed at low resolution. A larger logo for the page was simpler - how to represent something around DNA and engineering - the <a href="/images/logo_large.png">final image</a> was quirky enough to capture my imagination but to be honest, I'm not what's going on there.</p>
<h2>Hosting a site</h2>
<p>Where to publish? The load for serving an infrequently visited personal website doesn't justify dedicated hardware on the hosting side. This <a href="https://geekflare.com/best-static-site-hosting-platform/">review on geekflare</a> was helpful.</p>
<p>Some options I considered</p>
<ul>
<li>Netlify - free tier <a href="https://www.netlify.com/pricing/">pricing here</a></li>
<li>Cloudflare has a <code>jamstack</code> offering with a free tier and highly questionable policies around <a href="https://en.wikipedia.org/wiki/Cloudflare#Far-right_content">hosting far-right sites</a></li>
<li>IO page on GitHub via <a href="https://pages.github.com/">github pages</a>  look easy to set up with Jekyll and <a href="https://docs.github.com/en/pages/configuring-a-custom-domain-for-your-github-pages-site/about-custom-domains-and-github-pages">github custom domains</a></li>
</ul>
<p>In the end, <code>netlify</code> was simple and ethical, and they make the onboarding experience incredibly simple - linking to your github project directly, I had to change just one setting (default output is <code>public</code> not <code>_site</code>), and it just worked.. Impressive.</p>

    ]]>
      </content>
    </entry>
  
</feed>