2025-09-05
カテゴリ：技術
こんにちは。しゃぎ（X: @shinysheep0158）といいます。 タイトルの通り、StrapiとNext.jsでブログを構築してみたので紹介します。 僕ははてなブログもやっているけど、そっちは表向きの感じのブログというか、どう書いてもかしこまった感じになってしまうので、このブログは技術的な内容に限らず自由に書いていくつもりです。なので完全自己満ブログで自分語り以外存在しない。というかインターネットってもともとそういう場所なのに自分で勝手に制限をかけてただけなんだよな。
デプロイ先はVPS。高専キャリアさんが提供しているみらいサーバーを利用させていただいた。これは高専生なら無料でさくらのVPSを借りることが出来るというサービスで、ありがたく使わせてもらっている。
僕は情報系高専生ながらWeb技術やその周辺技術をほぼ触ったことがなかった（HTMLとJavaScirptくらいしか書いたことがない）。だから今回このブログを構築するときには、ハマりポイントが大量に発生。
Webフレームワークはまあ存在くらいは知ってた。夏休みにとある会社のアルバイトインターンの選考に応募することになり、その選考の過程で出された技術課題（内容は言えない）の都合でWebフレームワークをキャッチアップする機会をいただいたので、2週間ほどかけて必死に学び、ありがたいことになんとか技術課題はクリアをいただいた。
この経験でWebフレームワークに対する忌避感が薄れたので、これを機にブログも構築してみようということになった。
他の人が使っているのを見て、ヘッドレスCMSとしてStrapiを選んだ。データベースとしてMySQLを選んだらなんかそもそもVPSにMySQLがインストールされてなかったり、よくわからんエラーが出たりして、4時間くらいはハマった気がする。でももうなんでハマってたか思い出せないので、またMySQL使うときに同じ過ちを犯しそうだな。
Dockerはほぼ初めて使った。本番環境にDockerで動かすのっていいのかなと思ってたけどいいんだね。なんとなく開発環境で使われてるイメージがあった。docker-compose.yamlを書くのにすごくてこずった。Dockerコンテナ間の通信がうまく行かなかったけど、結局その理由は、volumeの消し忘れ？でvolumeまで消して再起動したらいけた。こういうのもちゃんと記録とかとってさぁ...。再発防止に努めないからまた繰り返すんだよなぁ。Dockerで動かすのにほぼ徹夜したので8時間くらいはかかった。
Github Actionsももちろん初めてつかった。便利ねぇこれ。mainブランチに更新が入ったらVPSにsshしてdocker compose up -d --buildを実行してくれるようにworkflowを組んだんだけど、どうもssh接続がうまく行かなくて失敗してるなぁと思っていたら、ホストのipアドレスをミスっていた。2時間くらい悩んだ。
Web技術って本当に置き換わりが激しいというか、QiitaとかZennとかの記事が数年であんまり役に立たなくなることが多い印象。例えばTailwind CSSのv4が2025年1月にリリースされたけど、僕はずっとv3のブログ記事を眺めていてエラーになったりとか、数えだしたらきりがない。こういうときに公式のドキュメントが本当に心強い。英語だけど読む気が起きるくらい有益な情報が書いてある。
普段はどちらかといえば低レイヤの技術に触れがちな僕にとってとても視野の広がる経験となった。友達にもReact教えてもらったりして、ありがたい限りだった。
あとはやっぱりNext.jsのハイドレーションの技術ってどうなってるんだろうとか、React自作してみたいなーとかも思った。いつかWebフレームワーク on 自作ブラウザ on 自作OSします。