This page looks best with JavaScript enabled

Hugoでさくっと自作ブログを作った

 ·   ·  ☕ 2 min read  ·  ✍️ さんぽし

はじめに

こんにちは。
前々からやりたいと思っていた自作ブログへの乗り換えをついにやりました。

これまで僕は、

  • 技術系: Qiita
  • インターン記: はてなブログ

という使い分けをしていましたが、それぞれ以下の理由などから、乗り換えたいと前々から考えていました。

Qiita

  • コミュニティが盛り下がってきている気がする(個人的感覚)(トレンドの LGTM の数を見て明らかに一時期よりも少ない数の記事のものが上がるようになっている)

はてなブログ

  • 文字数がすごく多くなってくると保存 and プレビューに時間がかかる
  • というかそもそもプレビューで画面を切り替えないといけないのがちょいめんどくさい(Qiita みたいに隣に置いておいてくれればいいのに)

あたりです。

まあ、これらはきっかけにすぎず僕が自作ブログ欲しいなぁと前々から思っていたのが一番大きいです。

Hugoで作る自作ブログ

このブログは Hugo で作成されています。リポジトリは↓です。

sanposhiho/blog - GitHub

僕はフロントエンドも💩ですしデザインセンスも💩なので、Hugoのテーマの中から良さげのものをそのまま拝借しました。

このテーマ、結構可愛くないですか??かなり気に入っています。

上の水滴マークからテーマも色々変更できるので試してみてください。

Netlify から配信しているので、記事を書いて push すれば更新されるという楽々仕様です。

ついでにムームードメインで念願(?)の sanposhiho.com を取得しました。

OGP生成

OGP の生成にはLadicle/tcardgenを使用しています。

Ladicle/tcardgen - GitHub

これを用いて以下のコマンドをデプロイ前に打って OGP を生成しています。

1
2
git diff --name-only HEAD\^ content/posts  |\
xargs tcardgen -o static/tcard -f assets/fonts/kinto-sans -t assets/ogp_template.png

これによってその時に commit した記事の OGP のみが生成されます。
便利ですね〜✨

また、テーマの partials/head/meta.html を上書きして、生成される画像を OGP として認識するように設定する必要があります。

乗り換えにあたって

はてなブログからはすごく頑張って記事をコピペしてきました。

Qiita からの移行にはqiitaexporterを使用しました。

tenntenn/qiitaexporter - GitHub

終わりに

これを機に Qiita とはてなブログは引退します。これまでそちらを読んでくださっていた方ありがとうございました。

やっと自作ブログライフが始められてすごく清々しい気分です。Hugo で作るとものの数時間で作成が終わるので皆さんもどうでしょうか?

Share on

さんぽし
WRITTEN BY
さんぽし
Web Developer /w Elixir, Go