Web Starter Kitの規約を切り出し、spec-kitからも使えるようにしました

以前公開した Web Starter Kit は、単なるコードの雛形ではなく、要件定義から実装、品質保証、運用保守までを一貫して進めるためのドキュメントと規約を備えたテンプレートとして作っていました。

今回行ったのは、その Web Starter Kit の中に含まれていた規約部分を切り出し、nextjs-web-governance として独立したサブモジュールにしたアップデートです。

これによって、規約群を Web Starter Kit の内部実装に閉じ込めず、web-starter-kit からも spec-kit からも参照して使えるようになりました。
単に規約ファイルを別リポジトリに移しただけではなく、要件定義時のヒアリングや、実装前後の規約遵守を進行フローの中で扱いやすくしたのが今回のポイントです。

今回のアップデートで変わったこと

これまで Web Starter Kit には、ヒアリング、要件定義、SEO、セキュリティ、品質ゲートなど、Web制作・Web開発のための規約群が含まれていました。

ただ、こうした規約は Web Starter Kit の中だけで完結させるよりも、複数のプロジェクトやツールから共通利用できたほうが扱いやすい場面が増えてきます。

そこで今回、規約群を nextjs-web-governance として切り出し、独立した形で管理できるようにしました。

この構成にしたことで、次の2つの使い方が明確になりました。

利用先	使い方
web-starter-kit	`docs/governance/` としてサブモジュール参照して使う
spec-kit	`speckit/install.sh` からインストールして使う

つまり、Web Starter Kit に最初から入っていた規約群を、今度は別のプロジェクトでも共通資産として使えるようにした、というのが今回のアップデートです。

nextjs-web-governance とは何か

nextjs-web-governance は、Web Starter Kit から切り出した規約・テンプレート・チェックリストをまとめたリポジトリです。

対象は Next.js + TypeScript + Docker を前提にした Web 開発で、実装ルールだけでなく、要件定義や品質確認に関わるテンプレートまで含んでいます。

たとえば中には、以下のような内容があります。

種別	例
規約	ヒアリング規約、開発規約、アーキテクチャ規約、セキュリティ規約、SEO規約、品質ゲート
テンプレート	ヒアリングシート、要件定義書テンプレート、SOWテンプレート、機能仕様書テンプレート
運用資料	リリースチェックリストなどの runbook
spec-kit連携	インストーラー、テンプレートオーバーライド、Extension

重要なのは、これは「解説用のドキュメント集」ではなく、実際のプロジェクトで参照・適用するための規約群だという点です。

Web制作やWeb開発では、コードを書き始める前に決めるべきことが多くあります。

何を作るのか
どこまでを今回のスコープにするのか
どの要件が未確定なのか
SEOやセキュリティをどの水準まで入れるのか
何を満たせば実装完了とみなすのか

このあたりを曖昧なまま進めると、人間でも AI でも後から手戻りが発生しやすくなります。

そのため nextjs-web-governance では、実装より前の工程も含めて、守るべきルールをまとめています。

spec-kit で使えるようにした意味

今回のアップデートで特に大きいのは、nextjs-web-governance を spec-kit からも使えるようにしたことです。

spec-kit は、仕様を先に作り、その仕様をもとに計画・タスク・実装へ進めるための OSS です。
この流れ自体はとても強力ですが、標準のままだと、案件固有のヒアリングルールや、Web制作向けの規約までは自動で組み込まれません。

そこで nextjs-web-governance の speckit/ 配下に、spec-kit 連携用の仕組みを用意しました。

この連携では、主に次の2つを行います。

仕組み	役割
テンプレートオーバーライド	spec-kit の各フェーズ出力にガバナンス要件を反映する
Extension hooks	進行の前後で規約準拠をチェックする

これにより、spec-kit の仕様策定や計画作成の流れの中に、ヒアリング規約や品質ゲートを組み込みやすくなります。

つまり今回やったのは、spec-kit に対して、nextjs-web-governance を後付けで導入し、Web開発向けの規約を流れの中で扱えるようにした、という形です。

インストーラーは nextjs-web-governance に含まれています

ここも今回のポイントです。

spec-kit 用のインストーラーは、別プロジェクトとして独立しているわけではありません。
nextjs-web-governance リポジトリの speckit/ 配下に含まれています。

そのため構造としては、

規約本体が nextjs-web-governance
spec-kit 連携機能も nextjs-web-governance の一部

という整理になります。

導入時は、この speckit/install.sh を使うことで、spec-kit プロジェクト側に必要な組み込みを行えます。

処理の内容としては、概ね次のような流れです。

インストーラーが行うこと	内容
サブモジュール追加	`docs/governance/` に `nextjs-web-governance` を追加
オーバーライド配置	`speckit/overrides/` のテンプレートを spec-kit 側にコピー
Extension導入	ガバナンスチェック用 Extension を追加

これによって、spec-kit の標準ワークフローに対して、規約ベースの進行管理を差し込めるようになります。

なぜこの形にしたのか

理由はかなりシンプルです。

規約は、ひとつのテンプレートの中だけに閉じ込めるより、共通部品として外に出したほうが強いからです。

たとえば、Web Starter Kit をベースに新規案件を始める場合は、最初から規約込みで使えます。
一方で、既存のプロジェクトや spec-kit を使う開発フローでも、同じ規約を後から組み込めるほうが便利です。

もしこれを毎回コピペで運用すると、更新漏れや差分管理がかなり面倒になります。

そこで、規約群を nextjs-web-governance に集約し、それをサブモジュールとして参照する形にしました。

この構成にすると、

規約の更新元が一箇所にまとまる
Web Starter Kit でも spec-kit でも同じ基準を使える
要件定義や実装計画の段階から規約を反映しやすい
AIエージェントに対しても「守るべきルール」を明示しやすい

というメリットがあります。

AI開発との相性

今回の仕組みは、AI を使う開発ともかなり相性がいいです。

AI は速い反面、要件が曖昧だと平気で補完したり、都合よく解釈したりします。
その結果、動くものは出てきても、要件定義の抜けや規約違反が後から見つかることがあります。

そこで、規約を単なる参考資料ではなく、ヒアリング・仕様策定・計画・実装・チェックの流れの中に置くことで、AI にも守らせやすくしました。

とくに次のような点で効果があります。

よくある問題	規約を切り出して連携した効果
要件が曖昧なまま進む	ヒアリング規約やテンプレートを先に参照させやすい
AIが勝手に補完する	未確定事項を未確定のまま扱う流れを作りやすい
非機能要件が抜ける	SEO、セキュリティ、品質ゲートを仕様段階から入れやすい
ツールごとに基準がぶれる	共通の規約リポジトリを参照できる

もちろん、これで何もかも自動化できるわけではありません。
ただ、AI に自由に実装させるよりも、守るべき規約と進め方を先に与えたほうが、結果のブレはかなり減らせます。

モデルによって仕上がり差はある

一点だけ、使っていて感じている注意点もあります。

この仕組みは、AI が規約やテンプレートをちゃんと読み取り、仕様や計画に反映できることを前提にしています。
そのため、使うモデルによって仕上がりには差が出る可能性があります。

現時点では、gpt-5.4 や Claude Opus 4.6 では大きな問題なく扱いやすい印象です。
一方で、軽量なモデルでは、規約の読み落としや未確定事項の扱いの甘さが出る可能性があります。

なので、この仕組みは「どのモデルでも完全自動で完璧に動く魔法のセット」ではありません。
むしろ、性能の高いモデルほど規約の恩恵を受けやすく、仕上がりの安定性も高くなる、という理解のほうが近いです。

まとめ

今回のアップデートは、Web Starter Kit に含まれていた規約群を nextjs-web-governance として切り出し、web-starter-kit と spec-kit の両方から使えるようにしたものです。

ポイントをまとめると、次の通りです。

ポイント	内容
規約群を独立	Web Starter Kit 内部の資産だった規約を共通利用できる形にした
再利用先を明確化	web-starter-kit と spec-kit の両方から参照できる
spec-kit 連携を内包	インストーラーは `nextjs-web-governance` の `speckit/` 配下に含まれる
AI開発に向く	ヒアリングや規約遵守をフローに組み込みやすい
モデル差はある	高性能モデルのほうが規約反映の精度は安定しやすい

Web Starter Kit を使う人にとっては、規約がより扱いやすくなりました。
spec-kit を使う人にとっては、Web開発向けのルールを流れの中に組み込みやすくなりました。

規約をただ読むだけではなく、プロジェクトの進め方そのものに組み込む。
今回やったのは、そういうアップデートです。