初投稿です。
DevContainerを用いたフルスタックでの開発にLeftHookがとてもマッチしたので紹介します。
UI側はBun(Node.js)、API側はPythonを使用しています。
LeftHookとは
LeftHookは一言でまとめると「マルチプラットフォーム対応のGitフック管理ツール」です。
似たようなツールとしてはHuskyやpre-commit等があります。
機能のざっくり説明
コミット前やプッシュ前に任意のコマンドを実行できます。
例(以下のようなことができます)
- コミット前にステージングされているファイルに対してフォーマットを行い、修正された内容も含めてコミットを上げる
- コミット前にリントやビルドを実行して、なんらかのエラーがあった場合はコミットさせない
- コミット前にコミットメッセージの検証を行い、エラーがあった場合はコミットさせない
上記で挙げた例以外にも、プッシュ前に何か行ったり、上記のすべてを同時に行ったり等も可能です。
なぜLeftHookなのか
例に挙げた内容は上述したHuskyやpre-commit等でも可能です。
その中で私がLeftHookを推す理由はひとえにマルチプラットフォーム対応だからです。
他にもいいとこいっぱいあるよ
Huskyの場合は導入にNode.jsが必須です。
ただ、私の場合はDevContainerで開発を行っているため、API側にHuskyを導入したい場合は、そのためだけにPythonのDevContainerにNode.jsも入れないといけません。逆も然りです。
これは正直微妙だと思いました。
かといって、UI側はHusky、API側はpre-commitとそれぞれ別のツールを導入するとその分学習コストが増し、管理も大変そうです。
この点、LeftHookは環境の差異を気にしないでいいのがとても良い点だと思いました。
導入について
詳細はこちら
UI側もAPI側もやることは同じです。
インストールしてlefthook.yml
を書いてlefthook install
するだけです。
そうしたら、lefthook.ymlに書いた通りにGitフックが作成されて実行されます。
参考までに私のlefthook.ymlを置いておきます。
UI側のlefthook.yml
コミット時にBiomeのリントとNext.jsのビルドを並列実行して、エラーがあった場合はコミットさせない設定です。
pre-commit:
parallel: true # 並列実行
commands:
check:
run: bunx biome check
build:
run: bun run build
API側のlefthook.yml
コミット時にRuffのリントを実行して、エラーがあった場合はコミットさせない設定です。
pre-commit:
commands:
check:
run: ruff check
欲を言えばコミットメッセージのリントも行いたかったのですが、マルチプラットフォーム対応のcommitlintが見つからなかったため断念しました...
何かいいリンターがあったら教えていただけると嬉しいです。
その他の構築例もこちらにいくつかあるので興味があったら見てみてください。
実行
UI側(Next.js)での実行結果です。
Hello Worldを表示するだけのページを作成しました。
適当な場所に以下のような、constで定義した定数に値を代入しようとしてエラーになる文を追加します。
const test = 1;
test = 2;
ステージングに上げてコミットすると
git add .
git commit -m "test"
lefthook.yml
に定義したcheckとbuildが走り...
エラー文によると「定数に代入はできないよ」ということなのでletに直します。
- const test = 1;
+ let test = 1;
test = 2;
再コミット
git add .
git commit -m "test"
プッシュを忘れずに
git push
まとめ
以上です。
個人的に積極的に使っていきたいと思えるツールでしたので記事を書かせていただきました。
誤字・脱字・ご指摘点等ありましたらコメントで教えていただけると助かります。
LeftHookで良いコミットライフを!