みなさま、TUIはご存知ですか？もしくは、使ったことがありますか？
TUI（Text User Interface）とは、ターミナルやコマンドライン上で動作する、
文字ベースのユーザーインターフェースのことです。
CLI（Command Line Interface）がコマンドを入力して操作するのに対し、TUIはターミナル内で視覚的に操作できるインターフェースを提供します。
多くの開発者にとって、TUIは「かゆいところに手が届く」ものになるでしょう。
なぜなら、「ターミナル上で完結してほしい」けれども「CLIでは情報が足りない・使いづらい」といった状況にぴったりのものが作れるからです。
TUIの利点
TUIには以下のような利点があります：
- ターミナル上で完結する: GUIを開かずに作業が完了し、SSH接続先などの環境でも利用可能
- 情報を一気に閲覧: 複数の情報を同時に確認でき、CLIのように何度もコマンドを実行する必要がない
- 対話的な操作: キーボードで視覚的に選択して処理を実行でき、直感的に操作できる
例を挙げるなら、「ターミナル上で完結しないと困る」場面を想像してみてください。
具体的には、このような場面があると思います。
- 特定の環境に入って作業する時
- わざわざこれのためにGUIを開いてまで作業するのがめんどくさい
このような場面では、GUIを扱うのが困難ですが、
それでもある程度の内容を参照したいので、ターミナル上でCLIを使うことになります。
しかし、CLIを使うことは簡単ではありません。
--helpを何回も実行しながら、どのようなコマンドを使ったらいいのか
右往左往しながら、一問一答形式の入出力を繰り返し、
結果として出てくる文字や数値、JSONデータを注視しなければなりません。
これは、かなり負担です。
できることなら、さまざまな情報を一気に閲覧しながら
対話的に処理を進めたいですよね。
だからこそ、TUIがおすすめなのです。
既存のTUIツールのご紹介
様々な有志の開発者たちが、TUIツールを開発しています。
そのようなTUIツールをいくつか紹介します。
gitui
高速で動作する無料のOSSとして開発されているGitのTUI版です。
GitのTUIとしては現状で最もパフォーマンスが良いものとされています。
ステージング、コミットからプッシュ、コミットログの閲覧、ファイルの閲覧、
スタッシュ、スタッシュしたファイル一覧がこのTUIで対話的に可能です。
使ってみた感想として、かなり便利で楽でした。
普段はVSCodeなどのグラフィカルなエディタのUI上で
Gitを使うのですが、今回はCLIとTUIでどれくらいやりやすさが変わるのかを
体験するため、それを使わずにGitを操作して分かったことを挙げます。
作業復帰までの時間短縮
作業から一時的に離脱した後、戻ってきて作業復帰するまでの時間が段違いです。
CLIでは複数のコマンドを実行して結果を確認する必要があり、作業内容に比例して認知負荷が上がります。
一方、TUIではグラフィカルな表示により、必要な情報を一目で把握できるため、脳への負荷が大幅に軽減されました。
入力しなければならないキーの数が減るので、
手も疲れにくくなりますし、良いことだらけでした。
リモート接続中のGit操作の効率化
SSHを通してリモート接続している開発環境では、
VimやNeoVimなどのターミナルエディタしか使えない場合があります。その際に、TUIの恩恵を強く受けられると考えました。
tmuxでペイン分割をして、一部はコーディング、一部はGitを対話的に操作するといった
区分分けができれば、ターミナル上で対話的な操作による開発体験ができるというイメージがつきました。
pumas
Mac OSのパフォーマンス監視ツールをRustで実装し直したもの。
実行するためにはsudo権限が要求されますが、
CPU/GPUの使用率や周波数やメモリ使用率が確認できます。
起動するとOverview画面が最初に表示され、PCに関する総合的な情報が一目で確認できます。
その画面では、CPU使用率、GPU使用率、総合的な電力使用率、メモリ使用率、温度といった
一通りの情報が閲覧できます。
Tabキーを押下すると、各項目の詳細画面に切り替えられ、
それぞれの詳細情報画面に切り替わります。
このような、「こちらからは操作できないものの、リアルタイムで確認できると嬉しいもの」を表示するためにTUIは重宝されています。
TUIを作ってみよう
今あなたがやっていることを効率的に済ませるためのTUIを作ることが、
作業を効率化する近道になるかもしれません。
TUIを作るには？
TUIを作成するためのライブラリは、様々な言語で提供されています：
-
Rust:
ratatui、cursive -
Python:
textual、urwid -
Go:
tview、bubbletea -
JavaScript/TypeScript:
ink、blessed
あなたが普段使っている言語で、気軽に始められるのもTUIの良いところです。
どんなTUIを作ると便利？
TUIが特に活躍するのは、以下のような場面です：
- パッと一覧表示したい情報がある: ログ、プロセス、ファイル、リポジトリなど
- 選択して実行する操作が多い: killする、開く、削除するなど
- 複数の情報を同時に確認したい: ステータスと詳細、一覧と内容など
開発中に「また同じコマンド打ってる...」と感じたら、それがTUI化のチャンスです。
それでは、実際にどのようなTUIを作成できるのか、具体例を見ていきましょう。
TUIの作成例
使用中ポートの一覧表示
localhostで起動しているポートの一覧表示とそのポートを使用している
プロセスを簡単にkillできるTUIです。
どのプロセスがどのポートを使用しているか可視化して、
それをEnterで選択してkillできるTUIです。
通常はlsof -i :[ポート番号]でPIDを探し、そのPIDをkillする必要がありますが、TUIを使うことで簡単に行えます。
ちなみに、ワンライナーでさっきのコマンドを実行しようとすると、
kill -9 $(lsof -ti :<ポート番号>)lsof -ti :<ポート番号> | xargs kill -9
のどちらかになります。
これは2つのコマンドの組み合わせで比較的シンプルですが、
これがさらに多くのコマンドとそれに伴う引数を要求する場合はどうでしょうか？
自分が所有するリポジトリの一覧表示
自分のアカウントで持っているリポジトリを表示するTUIも便利です。
さて、この一覧情報を取得するコマンドをコマンドラインで書くとどうなるでしょうか？
# jqを使用する（JSONから表示を整える）
# JSON: データを構造化して表現するためのフォーマット
# jq: JSONデータを操作・整形するためのコマンドラインツール
gh repo list $(gh api user -q .login) \
--json name,description,repositoryTopics --limit 100 | \
jq -r '.[] | "\(.name)\t\(.description // "N/A")\t\((.repositoryTopics // []) | map(.name) | join(", "))"'
# jqを使用しない（JSONのまま）
gh repo list $(gh api user -q .login) \
--json name,description,repositoryTopics --limit 100
このように、
gh CLIで長いコマンドを書いて指定しなければなりません。
これをTUIを起動するだけで一覧表示できると考えると、TUIを作って使う価値があると
思いませんか？
終わりに
今回は、TUIの魅力と、その活用例を2つ紹介しました。
TUIを導入することで得られる効果：
- 作業時間の短縮: 長いコマンドを何度も入力する手間が、キー操作数回に削減
- ミスの削減: コマンドの入力ミスや、引数の指定ミスが減少
- 認知負荷の軽減: 複数の情報を視覚的に把握でき、頭の中で状態を追う必要がない
CLIで複雑な操作を繰り返している作業があれば、それはTUI化の良い候補です。
ターミナル上で完結しつつ、より直感的で快適な開発体験を実現するために、TUIの活用を検討してみてはいかがでしょうか。
Discussion