aboutsummaryrefslogtreecommitdiff
path: root/build/my-static-blog-publishing-setup/index.html
blob: 5e2735b2aab939e48d8a0a2f2dc4da67e724514f (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<!doctype html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="color-scheme" content="dark light">
	<link rel="icon" href="data:,">
	<title>My Static Blog Publishing Setup and an Apology to RSS Subscribers</title>
	<link href="/atom.xml" type="application/atom+xml" rel="alternate" title="Atom feed for blog posts" />
	<link href="/rss.xml" type="application/rss+xml" rel="alternate" title="RSS feed for blog posts" />
<style>*{box-sizing:border-box;}body{font-family:sans-serif;line-height:1.33;margin:0 auto;max-width:650px;padding:1rem;}blockquote{background:rgba(0,0,0,0.1);border-left:4px solid;padding-left:5px;}img{max-width:100%;}pre{border:1px solid;overflow:auto;padding:5px;}table{text-align:left;width:100%;}.footnotes{font-size:90%;}</style>
</head>

<nav>
	<a href="#menu">Menu &darr;</a>
</nav>

<main>
<h1 id="my-static-blog-publishing-setup-and-an-apology-to-rss-subscribers">My Static Blog Publishing Setup and an Apology to RSS Subscribers</h1>
<p>2022-03-21</p>
<p>In case you missed it, this website is now generated with pure HTML &#38; CSS. Although, generated isn&#8217;t the proper way to describe it anymore. <em>Written</em> is a better description.</p>
<p>No more Markdown files. No more build scripts. No more Jekyll. Clean, simple, static HTML &#38; CSS is my &#8220;CMS&#8221;. More on that in a moment. First, I must apologize.</p>
<h2 id="im-sorry-dear-rss-subscribers">I&#8217;m Sorry Dear RSS Subscribers</h2>
<p>RSS feeds are tricky things for me personally. I always botch them with a site redesign or a re-structure of my previous posts. Those of you subscribed via RSS were likely bombarded with post spam when I rebuilt this website. Sorry about that - I know how annoying that can be.</p>
<p>Fortunately, that all stops today. Moving forward my RSS feed (Atom) will be edited manually with every new post I write. Each entry will feature the post title, post url, and post date. No summaries or full-inline content will be included (since that would involve a great amount of extra overhead). RSS subs will need to follow the link directly if they are interested in the article itself. I hope this doesn&#8217;t anger too many readers&#8230;</p>
<p>Again, sorry everyone.</p>
<h2 id="what-is-this-new-blog-system">What is this New Blog &#8220;System&#8221;</h2>
<p>This publishing flow isn&#8217;t for everyone and is less flexible than pre-existing static site generators (referred to as SSGs moving forward). For me though, it works. I find it more flexible than most SSGs.</p>
<p>There are a couple articles that explain the reasoning behind this system better than I could (plus, why would I repeat the same points?):</p>
<ul>
<li><a href="http://john.ankarstrom.se/html/">Writing HTML in HTML</a></li>
<li><a href="https://blog.steren.fr/2020/my-stack-will-outlive-yours/">My stack will outlive yours</a></li>
</ul>
<p>So, what does my blog-posting system look like?</p>
<h2 id="simple-explanation">Simple Explanation</h2>
<ol>
<li>Copy an existing article&#8217;s <code>HTML</code> file</li>
<li>Change file name, edit the page title, heading, post date and comment link</li>
<li>Write the new article content</li>
<li>Make manual new entry in RSS feed</li>
<li>Save changes, push to git repo</li>
<li>Sync new file(s) &#47; changes to remote server</li>
</ol>
<p>Pretty simple, eh? Let&#8217;s break things down into greater detail though&#8230;</p>
<h2 id="detailed-explanation">Detailed Explanation</h2>
<h4 id="text-editor">Text Editor</h4>
<p>I code and write everything exclusively in Sublime Text on my MacBook Air. I know, it&#8217;s not an open source editor, but I love how incredibly fast and intuitive it is. I used VSCode in the past but ended up requiring far too many plugins to get things setup the way I like it. Sublime Text works best for me even right out of the box. (I do need Emmet and theming changes though).</p>
<p>I perform the following for a new article:</p>
<ul>
<li>Copy an existing article, ie. <code>blog-post-1.html</code></li>
<li>Rename article file name, ie. <code>blog-post-2.html</code></li>
<li>Open this newly created file and change:
<ul>
<li>page <code>title</code> tag</li>
<li>page <code>h1</code> heading and top bar text</li>
<li><code>time</code> tag to match publish date</li>
<li>comment <code>mailto:</code> link url</li>
</ul></li>
<li>Start writing content inside the <code>article</code> section</li>
</ul>
<p>Once the article is complete, I add a static entry in my <code>feed.xml</code> and run a crude rsync script. More on that below.</p>
<h4 id="git">Git</h4>
<p>Normally I would pull, commit and push directly in my Terminal - but lately I&#8217;ve been enjoying my time using Sublime Merge. I&#8217;m a sucker for visually appealing GUI applications and Merge is the perfect balance of simplicity and beauty. I recommend it if you haven&#8217;t tried it yet.</p>
<h4 id="hosting">Hosting</h4>
<p>This blog is now hosted through NearlyFreeSpeech. I could opt for a free service like Netlify or DigitalOcean Apps but I feel it&#8217;s important to help support communities that align with my own core beliefs. From their <a href="https://www.nearlyfreespeech.net/about/">about page</a>:</p>
<blockquote>
<p>NearlyFreeSpeech.NET is about three things: fairness, innovation, and free speech.</p>
</blockquote>
<p>Hard to argue with those principles. If you&#8217;re feeling generous, I&#8217;d greatly appreciate anyone who considers contributing to <a href="https://www.nearlyfreespeech.net/contribute/tdarb.org">offset this website&#8217;s hosting costs through NearlyFreeSpeech</a> (code: tdarb). No money is directly handed to me, it pays NFS directly for hosting fees. Donate if you feel like this humble blog of mine has helped you in any way. No pressure!</p>
<p>NFS gives me server access via <code>SSH</code> (and even <code>SFTP</code> if I desire) which makes things simple to sync my local files with production code. This is handled via rsync with a basic <code>deploy.sh</code> script:</p>
<pre><code>rsync -vrzc --exclude &#39;deploy.sh&#39; --exclude &#39;.git&#39; --delete .&#47; username@my.remote.nfs.server:
</code></pre>
<p>The included parameters ensure files with a conflicting checksum are updated on the server, instead of re-syncing all the files every time the script runs. That would be overkill.</p>
<h2 id="closing-thoughts">Closing Thoughts</h2>
<p>I love this new setup. It&#8217;s portable, lightweight, has zero dependencies, and gives me the opportunity to write directly in HTML. Others may find this workflow idiotic or cumbersome but I couldn&#8217;t disagree more. Site wide changes can be made with simple <code>Find&#47;Replace</code> actions or even whipping up a basic script. Things should be as complex as you wish to make them!</p>
<p>At the end of the day, anything that helps you be more efficient and gets you producing more content is a winning strategy in my book. Who knows, this concept could even inspire one random reader out there to do the same.</p>
<footer role="contentinfo">
    <h2>Menu Navigation</h2>
    <ul id="menu">
        <li><a href="/">Home</a></li>
        <li><a href="/projects">Projects</a></li>
        <li><a href="/uses">Uses</a></li>
        <li><a href="/wiki">Wiki</a></li>
        <li><a href="/resume">Resume</a></li>
        <li><a href="/colophon">Colophon</a></li>
        <li><a href="/now">Now</a></li>
        <li><a href="/donate">Donate</a></li>
        <li><a href="/atom.xml">RSS</a></li>
        <li><a href="#top">&uarr; Top of the page</a></li>
    </ul>
    <small>
        Built with <a href="https://git.sr.ht/~bt/barf">barf</a>. <br>
        Maintained with ♥ for the web. <br>
        Proud supporter of <a href="https://usefathom.com/ref/DKHJVX">Fathom</a> &amp; <a href="https://nextdns.io/?from=74d3p3h8">NextDNS</a>. <br>
        The content for this site is <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>.<br> The <a href="https://git.sr.ht/~bt/bt.ht">code for this site</a> is <a href="https://git.sr.ht/~bt/bt.ht/tree/master/item/LICENSE">MIT</a>.
    </small>
</footer>