📊

一行もコード書かずにOSSに貢献する話

に公開

最近、気がつくとほとんどの時間をターミナルApp上で過ごしていませんか?
IDEを使わないといけない理由がほとんどなくなってきています。

そしてclaude codeをはじめとした最近のCLIツールは何だかUIがいい感じだな!!と思い調べるとinkというライブラリがあるようです。
Claude CodeもGemini CLIもCodexも全部inkが使われているとのこと。凄い。

inkってなに?

inkは、CLIのUIをReactで書けるようにしてくれるライブラリです。

リッチなUI、インタラクティブな操作、リアルタイムな更新など、従来のCLIでは難しかったことがReactの知識で簡単に実現できます。
知らぬ間にinkに本当にお世話になっているわけで、何か貢献しなければという気持ちになります。

作ったもの

そこでink-chartというチャート表示コンポーネントを作りました。

CLIでチャートを表示したい場面って意外とありまして、例えばGitのコミット状況とかパフォーマンスメトリクスの可視化とか。
そういう時にサクッと使えるコンポーネントがあったら便利だなーと思って作ってみました。

こんな感じ
ink-chart

本家inkのUseful Componentsリストにも載せて貰えました 🙌

作り方

ここからが本題なのですが、このライブラリを作る過程で自分は本当に一行もコード書いていません。エディタすら開いていません。この記事書くのに5日振りぐらいにエディタ開きました。
以下が手順。

1. ChatGPT5と相談しながらissue作成

まずこちらのissueをChatGPT5と相談しながら作成しました。

「inkに貢献したいんですけど、チャート系のコンポーネントってどうでしょう?」という相談から始まって、要件定義から設計までを済ませissueに書き出してもらいました。

https://zenn.dev/pppp303/articles/cf1e93c5fd213d

2. TDD開発ループの自動化

次に、以下のような開発プロンプト(コマンド)を用意しました:

  1. issueを開いて冒頭のルールを読み込む
  2. 未処理のタスクを拾う
  3. TDDで開発する
  4. PRを作ってレビューを待つ
  5. 終わったらタスクをチェック

この一連の流れを行う /next-issue-run コマンドを作って後は待つ。

3. PR作成とレビューの繰り返し

PRができたら自分がレビュー(動作確認)、「ちょっと違うんだよね」的なフィードバックを何度かやりとししてマージ。
終わったタスクにチェックが入ったら /clear -> /next-issue-run

分かったこと

作りたいものが思いついたらとにかくリポジトリを作った方がよい

最近バカみたいにリポジトリを作ってしまいます。
ファーストissueに内容書いておけば朝までに8割ぐらい作ってくれる未来が近そうです。
特に小規模なプロジェクトをゼロから作る場合、AIの能力がフルに発揮されて人間は太刀打ち出来ません。

AIとCLIツール(開発)の相性は最高

Claude CodeがBashで自分で実行して、結果を確認して、修正する、というサイクルがスムーズです。
bashで成果物が確認出来るは凄い大事ですね。


思いついたら悩まずリポジトリを立てて、Vide codingしようという話でした。

何か要望などあればissueに記載頂けると嬉しいです!
https://github.com/pppp606/ink-chart

Discussion