2025年11月22日土曜日

Speckit 超入門

Speckit 超入門

概要

code-server + speckit を試してみました
一応アプリは作成してくれましたが生成されるファイルが微妙に違うのでまだサポートしていないのかもしれません

環境

  • Ubuntu 24.04
  • speckit (specify 0.0.22)
  • code-server v4.105.1

インストール

  • uv tool install specify-cli --from git+https://github.com/github/spec-kit.git

初期化

  • specify init speckit_test
    • copilot を選択
    • sh を選択

code-server を開く

  • speckit_test を vscode で開く
  • モデルを Claude Sonnet 4.5 にする

以下 code-server の Github copilot chat のチャット欄で作業します

規則作成

  • /speckit.constitution コード品質、テスト標準、ユーザーエクスペリエンスの一貫性、パフォーマンス要件に焦点を当てた原則を作成します。

/home/devops/work/speckit_test/.github/prompts/speckit.constitution.prompt.md が作成された

仕様作成

  • /speckit.specify 家庭や業務用キッチンで使用できるシンプルで視認性の高いタイマーを、Web ブラウザー経由で提供します。1分、3分、5分を設定するためのボタンを配置します。ボタンを押すと、その時間からカウントダウンが開始されます。カウントダウン中は、残り時間を目立つように表示します。カウントダウン中に再度ボタンを押すと、タイマーがリセットされ、新たなカウントダウンが開始されます。

/home/devops/work/speckit_test/.github/prompts/speckit.specify.prompt.md が作成されました

実装計画作成

  • /speckit.plan HTML5、JavaScript(ES6)、CSS3 で作成してください

/home/devops/work/speckit_test/.github/prompts/speckit.plan.prompt.md が作成されました

作業タスクの作成

  • /speckit.tasks

/home/devops/work/speckit_test/.github/prompts/speckit.tasks.prompt.md が作成されました

実装

  • /speckit.implement

/home/devops/work/speckit_test/.github/prompts/speckit.implement.prompt.md が作成されました

また実際に作成されたコードは以下の通りです

ls -ltrR kitchen-timer/
kitchen-timer/:
total 24
drwxr-xr-x 3 devops docker 4096 Nov 21 13:23 assets
-rw-r--r-- 1 devops docker 1844 Nov 21 13:24 index.html
drwxr-xr-x 2 devops docker 4096 Nov 21 13:24 css
drwxr-xr-x 2 devops docker 4096 Nov 21 13:26 js
-rw-r--r-- 1 devops docker 7522 Nov 21 13:26 README.md

kitchen-timer/assets:
total 4
drwxr-xr-x 2 devops docker 4096 Nov 21 13:23 sounds

kitchen-timer/assets/sounds:
total 0

kitchen-timer/css:
total 8
-rw-r--r-- 1 devops docker 6334 Nov 21 13:24 styles.css

kitchen-timer/js:
total 16
-rw-r--r-- 1 devops docker 2975 Nov 21 13:25 timer.js
-rw-r--r-- 1 devops docker 3650 Nov 21 13:25 audio.js
-rw-r--r-- 1 devops docker 6150 Nov 21 13:26 app.js

動作確認

  • cd speckit_test/kitchen-timer
  • python -m http.server 8000
  • curl localhost:8000

最後に

code-server で speckit を動かしてみました
冒頭にも紹介しましたが挙動が微妙でまだ code-server ではサポートしていないのかもしれません

本当は git コマンドで branch も作成してくれるよういなのですがやってくれませんでした

またモデルが GPT-4.1 だと動きませんでした

続けて修正、エンハンスなどしたい場合は /speckit.specify から再度行います

参考サイト

0 件のコメント:

コメントを投稿