Migrated blog platform to Firebase+Hugo+LoveIt
I’ve used several blog-like platforms to write technological articles, but none of them has all the features I want.
|Platform||API(CLI) post/update||Markdown||Ctrl+V to paste image||Admonitions (described below)||International (not only-Japanese-friendly)|
|Text Editor + Jekyll + GitHub Pages||☑️||☑️||depends on text editor||depends on theme?||depends on configurations|
|Qiita (service in Japan)||☑️||☑️||☑️|
|Hatena Blog (service in Japan)||hard to use||☑️||☑️|
https://blog.wataash.com had been hosted on Hatena Blog, as the best compromised choice. But I found out Hugo could satisfy all my needs, and it actually did, so I switched this blog’s platform to Hugo.
Ctrl+V to paste image is mandatory for me because I post many images in my articles. I believe that, when we write technical documents, we should do reducing-text and pasting-many-images as possible.
As of 2016, (AFAIK) it was impossible to paste images with Ctrl+V while editing Markdown, so I avoided Jekyll. But now there’s awesome Visual Studio Code extension – Markdown Paste.
And Hugo has emerged, which is faster than Jekyll and very sophisticated, and has many users.
So I tried Hugo + Firebase-Hosting and decided that I would post all the blog posts with it.
Hugo’s theme selections is important, because they not only defines site styles, but also provides functionalities. One example is admonitions:
This is the warning admonition.
DO NOT execute:
How pretty and readable they are! I think an admonition is more readable than footnote 1.
So I tried several themes that have many GitHub stars.
|Theme||GitHub stars (2020-08-09)||Dark mode (prefer-color-scheme)||multi-language (i.e. https://blog.wataash.com/ https://blog.wataash.com/ja/)||Admonitions||Disqus comment (see the bottom of this page)||Search 🔍||etc||Theme|
|Academic (preview) (for generic website including blog)||4851||☑️||☑️||☑️||☑️||Slow, Making it a simple blog is tough||Academic|
|Coder (preview)||1072||☑️ light/dark switch button is not implemented||☑️||Coder|
|Learn (preview) (for documentation, not for blog)||1000||?||?||?||?||?||?||Learn|
|Docsy (preview) (for documentation, not for blog)||869||?||?||?||?||?||?||Docsy|
|Book (preview) (for documentation, not for blog)||792||?||?||?||?||?||?||Book|
LoveIt was perfect, I chose it. And I found out it’s literally perfect… :)
This is a footnote. I think footnotes is well functioning in paper books, but not in webpages – page-jumping is easy in paper books but annoying and non-intuitive in the web browser, decreasing human’s reading speed. ↩︎