見出し画像

GhosttyをVSCodeみたいにしよう!

English Article

最近はClaude Codeでコーディングすることが増えてきました!しかしこいつもそうだけどVSCodeもメモリをもりもり食います。大食いが5プロジェクトもあるとまあメモリもカツカツです。

そうして流行りのGhosttyに乗り換えたのが半年前なんですが、最近はGhosttyでVSCode環境をそのまま再現したい!という今の自分のGhostty環境をお見せします!

私の環境

画像
Ghostty環境

そして私の元々のVSCode環境です。

画像

詳しく見ていきましょう。まずVSCodeのほうですが、簡単にはこれです。一般的な部類だと思いますが、左のサイドバーにファイル一覧とGitのTree表示。右にはClaude Code or Code Editorとその下にターミナルという基本構成です。

画像

これをそのまんまGhosttyで再現したい!ということで実際に使っているのはこれです。

画像

使ってるのは基本は普通の画面分割(Ghostty標準機能)とFileTree(自作)とKeifu(会社の同僚作)のツールです。これでほぼほぼの機能を網羅して使えます。高頻度で使っているプロジェクトに関してはzellijのsessionに持ってます。

FileTree

機能としてはほぼほぼVSCodeのファイル一覧の表示を模倣したTUI file expolorerです。

  • VSCode風のファイルツリー表示

  • ファイル/フォルダの作成・リネーム・削除・コピー・移動

  • ドラッグ&ドロップ対応

  • ファイルプレビュー(テキスト/画像/バイナリ)

cargoですぐ使えます

cargo install filetree

個人的にはドラッグ&ドロップ対応がアツいと思っていて、普通にここにファイルをドラッグ&ドロップで追加できます。中身としてはドロップされた際にpathを取得できるのでコピーしてるだけです。これによって直感的にファイル追加ができます。

画像

一応クイックルック的な機能もあって、サクッと中身を確認することも可能です。画像の場合はサムネレベルの表示をしています。これでサイドバーのファイル一覧としては十分な機能でしょう。

実際に使う時にはファイル一覧から選択ファイル/ディレクトリのPathを取得できるので、他の画面でもすぐにPathのところに移動できます。

yaziもいいんですけどね、リッチすぎる。こういうあくまで1パーツとしてサイドバーみたいに使いたいのを考えるとこっちのほうが自分には好みです。

keifu

高速・軽量でGitのツリー表示をしてくれるツールです。個人的推しポイントとしてはLazyGitよりシンプルで縦画面表示にも対応している点です。

基本的にVSCodeのサイドバーのGit表示みたいにしたいので、横幅が大きいと困ります。その点このkeifuは細い時は縦にスタックされ、長いときは横に広がるという完璧さ。

画像

結局見たいのは今のコミットの状態・ブランチの状態と切り替えなので、これが良い。あまり大きいものはいらない。小さいのをLEGOのように組み合わせていくのは個人的にとても良い。

あとDiff見られないのも好み。別にDiff見たいならメインの右上の画面でdiff叩くから、サイドバーにその機能は不要だと思ってる。もしもそれが欲しいならLazyGitのほうがいいかな。自分も大きい画面でDiff見るならLazyGit使うし。

zellij

「でもお前毎回画面分割を手動で設定してるの?面倒じゃない?」という気持ちもわかるので、ちゃんとterminal mutiplexerを使ってます。tmuxも良いのですが、ちょっとコマンドが覚えられないのでそこらへんが親切なzellijを使ってます。

保存してるセッションの例だとこんな感じ

画像

ただ一部のIMEに関してはzellij + Claude Codeの日本語入力が変なところに出現するので、うまく動作しない場合はtmuxをお勧めします。頑張ってコマンド覚えましょう。(issue↓)

この場合はtmuxのコマンドをzellijに置き換えるコードを書いたのでそちらを入れて上書きしてください。幾分は楽になります。

おわり!

自分で困ったらすぐにツール作れるのはいい時代になったなあ。

おまけ

Ghostty Config

theme = TokyoNight
maximize = true
font-family = PlemolJP35 Console NF
background-opacity = 0.8
macos-titlebar-style = tabs
background-blur = true
adjust-cell-height = 2
font-thicken = true
keybind = ctrl+h=goto_split:left
keybind = ctrl+l=goto_split:right
window-inherit-working-directory = true
shell-integration = detect

quick-terminal-position = "right"
quick-terminal-screen = "main"
quick-terminal-animation-duration = 0.3
keybind = "cmd+shift+t=toggle_quick_terminal"

clipboard-write = allow

clipboard-trim-trailing-spaces = true
macos-titlebar-style = tabs
window-new-tab-position = current


いいなと思ったら応援しよう!

ピックアップされています

#エンジニア 系記事まとめ

  • 1,325本

コメント

コメントするには、 ログイン または 会員登録 をお願いします。
GhosttyをVSCodeみたいにしよう!|Naoki |電電猫猫
word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word

mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1