atepoyo.com

ブログ製作記

?回目のブログを作成しはじめた。

古来より個人サイトとブログを何度も作成し何度も機能停止を繰り返してきたが、また懲りずに作り直した。 前回のブログはHugoを利用して作成したが、2年近く放置して全てを忘れてしまったため、いっそのこと新しい技術で作り直すことにした。

今回利用したフレームワークはNext.js。素人もいいところなので比較検討したわけではなく、たまたま目についた・詳しい友人にも否定されなかったので良さそうという受動的な理由。

現在のレイアウトはNext.js公式が推奨しているらしいテンプレートの blog-starter からほとんど手が加えられていない状態。ブログを作成してこの辺の技術で遊ぶのも目的だけど、ブログを書くことも同じくらいの目的なので一旦日記を書いて何かをやった気になってみている。

今のところ、あれもこれも自動でやってくれて俺は何をすればいいんだ…という気持ちになりがち。とはいえその分、表面的には何によってどこが定義されているのかはわかりやすいはずなので(そうであってほしい)、ひとまずこのテンプレをグチャグチャにしてみて途方に暮れる予定。

本当は↑にあるテンプレの画像とかもなくしたいんだけど、試しに入れる画像のパスの行だけ削除してみたら画像だけ消えてスペースはそのまま残り最悪な感じになったのでひとまず放置。

普段はモチベが日記執筆>ブログ作成なんだけど、今回は逆になっている気配を感じるのでどちらも頑張っていきたい。

具体的にやったこと

  • テンプレをコピーし、Vercelで新しいプロジェクトを作成・GitHubで新しいリポジトリを作成
  • 新しいプロジェクトにドメインを映す。
  • 様々なところにatepoyoを落書き。
  • Tailwind CSSを利用してフッターを破壊。
  • 記事のテンプレを生成してくれるスクリプトを作成。

課題

  • Markdown記法のハイフンが反映されてないっぽい。Tailwind CSSが悪さしてる可能性あるらしい。これを解決するためにはページのHTMLを作っているファイルを特定しなければいけないけどまだ良くわかってない。
  • 個別記事の頭にあるでかい画像を消したい。記事ごとに画像をパスで入力するようになっているが、それを削除してもファイルが入るべき場所が残ってとても不格好な形になる。これもどのファイルが記事ページを作成しているのかがよく分かっていないことが原因で解決できない。

今後

  • どのファイルが何をしているのかを噛み砕きたい。これが分かれば自分で更地から作れる気がするけど、ということは分かるまでが長そう