ブラウザのクラウドIDEでVimキーバインドを使う方法

ローカルに開発環境を作らず、ブラウザだけでコードを書けるクラウドIDEを使う機会は増えている。GUIベースのエディタが標準でも、Vimキーバインドに慣れていれば、ほとんどのクラウドIDEで同じ操作感に切り替えられる。

AWS Cloud9について

かつて代表的な選択肢だったAWS Cloud9は、2024年7月以降、新規利用の受付を終了している。既存ユーザーはそのまま利用を継続できるが、新機能の追加は行われない方針が示されており、これから新規に使い始めるサービスとしては選びにくい状況になっている。AWS上でクラウド開発環境を新たに作りたい場合は、後継として案内されているAWS CodeCatalystのDev Environmentsを検討するのが順当。

要点：AWS Cloud9は新規受付終了済み。これから始めるならCodeCatalystや、後述するVSCodeベースのクラウドIDEを検討する。

GitHub Codespaces

GitHubリポジトリと直結したクラウド開発環境。中身はVSCode（Web版）そのものなので、VSCode向けのVim拡張機能がそのまま使える。

Codespaceを起動する
拡張機能タブから「Vim」（VSCodeVim）を検索してインストール
有効化すると、通常のVSCodeと同じ感覚でVimキーバインドが使えるようになる

GitHubのリポジトリに.vscode/extensions.jsonで拡張機能を指定しておけば、チームメンバーがCodespaceを開いたときに自動でインストールを促す設定もできる。

{
  "recommendations": ["vscodevim.vim"]
}

VSCode Web（vscode.dev）

インストール不要でブラウザからアクセスできるVSCodeの軽量版。こちらも拡張機能タブからVim拡張を追加すれば同様にキーバインドを切り替えられる。フルのCodespacesほどの計算リソースは使えないが、ちょっとした編集作業やコードレビューには十分。

その他のブラウザベースエディタ

自前でホスティングするcode-server（VSCodeをブラウザ経由で動かすオープンソースプロジェクト）を社内サーバーに立てている場合も、同様にVim拡張機能をインストールするだけで対応できる。VSCode系の拡張機能エコシステムに乗っているサービスであれば、基本的にどこでも同じ手順が通用する。

本格的にVimを使いたいなら

クラウドIDEのVimエミュレーションはあくまで「VSCodeの見た目でVimキー操作をする」ものであり、本物のVim scriptプラグインは動かない。もっと本格的な環境が必要な場合は、VPS上にVim/Neovimを立ててSSHで接続するという選択肢のほうが、設定・プラグインをフルに活かせる。

使ってみて

Cloud9を使っていた頃から、GitHub Codespacesに移行してからもVim拡張機能を真っ先に入れる習慣は変わっていない。ブラウザだけで完結する手軽さと、慣れた操作感を両立できるのはありがたい。ただし込み入った設定やVim scriptプラグインが必要な作業は、結局VPS上の本物のVimに頼っている。

まとめ

AWS Cloud9は新規利用受付を終了しているため、今から始めるならGitHub Codespacesやvscode.devのようなVSCodeベースのクラウドIDEにVim拡張機能を入れるのが現実的。本格的なVim環境が必要な場合はVPS＋SSHの構成を検討するとよい。