ここ数年、様々なアプリケーションがWeb化しています。その1つとしてIDE（統合開発環境）が挙げられます。開発環境がWeb化することで、ローカルで開発を行っていた時とは違ったメリットが出せます。
今回は【2020年05月版】開発もクラウドで。クラウドIDEまとめ - ニフクラ mobile backend（mBaaS）お役立ちブログの最新版、2022年9月版としてお届けします。
- Web IDE | GitLab
- CodeSandbox
- Theia
- Replit
- GitHub Codespaces
- AWS Cloud9
- クラウド開発環境 PaizaCloudクラウドIDE - クラウドIDEでWeb開発!
- Red Hat OpenShift Dev Spaces
- goormIDE
- CodeTasty
- Coder
- StackBlitz
- Visual Studio Code.dev
- まとめ
Web IDE | GitLab
GitLabのリポジトリに付随するWeb IDEです。ベースはVS Codeを使っていますので、vscode.devやGitHub Codespacesと同じような使い勝手になるでしょう。
GitHubではリポジトリを使ってGitHub Codespacesを立ち上げられますが、GitLabも同じような仕組みとしてWeb IDEを提供します。
CodeSandbox
特にWebアプリケーション、Node.jsプロジェクトに特化したWeb IDEのようです。ユニークなのはiOSアプリが提供されており、iPadやiPhoneでも利用できる点でしょう。iPadに最適化された開発体験が得られます。
パブリックなプロジェクトであれば無料で使えます。プライベートなGitリポジトリを使いたい場合には月額15ドル（フリーランスプランは月額9ドル）になります。
CodeSandbox: Online Code Editor and IDE for Rapid Web Development
Theia
有名なJava IDEであるEclipseのWeb版であるTheiaです。Theiaはオープンソース・ソフトウェアですが、Theiaを自社サービスに組み込んでいるサービスもあります。
VS Codeとの違いとして、Theiaのアーキテクチャはよりモジュール指向である点やデスクトップとクラウド双方を想定していること、ベンダーフリーであることを挙げています。
Theia - Cloud and Desktop IDE Platform
Replit
リアルタイムコラボレーションをサポートしたIDEです。チャットしながらコーディングできるので、ペアプログラミングや教育に良さそうです。
言語は50以上に対応しているので、大抵のプログラミング言語であれば利用できるでしょう。カスタムドメインにも対応し、プロジェクトのホストも可能とのことです。
The collaborative browser based IDE - Replit
GitHub Codespaces
GitHubプロジェクトから即座に立ち上げられるWeb IDEです。Visual Studio Codeを利用しています。VS Code機能拡張を使ったデスクトップ版と、Webブラウザ版があります。
2コア4GBメモリからはじまって、32コア64GBメモリまで選択できます。特徴としてターミナルが使えること、ポートフォワーディングを使って開発時のWebサーバーも利用できる点が挙げられます。
AWS Cloud9
Amazonが買収したCloud9をAWS上で利用できます。リアルタイムコラボレーションをサポートし、ペアプログラミングを実行できます。AWS Lambdaとの連携が可能で、Cloud9上で開発・テスト・デプロイが行えます。
AWS EC2インスタンスへのアクセス権限を持ったターミナルも用意されており、サービスへのアクセスも容易です。AWSを活用する際に一緒に利用すると便利でしょう。
AWS Cloud9（Cloud IDE でコードを記述、実行、デバッグ）| AWS
クラウド開発環境 PaizaCloudクラウドIDE - クラウドIDEでWeb開発!
開発環境の構築で挫折してしまったという方を対象に含めており、やはりその大変さを解消するのを目的としているようです。Ruby on RailsやNode.js、WordPressなどの開発環境があらかじめ用意されています。
開発はもちろん、開発したサービスを外部公開することもできます。開発に加えて、ホスティングサービスとしても利用できます。
クラウド開発環境 PaizaCloudクラウドIDE - クラウドIDEでWeb開発!
Red Hat OpenShift Dev Spaces
Kubernetes上で動作するWeb IDEです。前述のTheiaを利用しています。OpenShiftのサブスクリプションに含まれる有料サービスとなっているようです。
特徴としては、開発環境がOpenShiftを使ってコンテナ化されていることでしょう。そのため、管理者は他のKubernetesリソースと一緒に管理、運用ができます。
Openshift Dev Spaces Overview | Red Hat Developer
goormIDE
goormIDEもリアルタイムコラボレーションをサポートしています。各プロジェクトごとにコンテナを立てる形で、CPUやメモリ、ネットワーク利用率などを管理できます。
企業利用をサポートしており、各企業ごとにインフラやデータが分かれて管理されています。コードバイザーと言うAIベースのコード補完機能があります（GitHub Copilot的なものだと思われます）。
goormIDE - A Powerful Cloud IDE Service
CodeTasty
40以上の言語をサポートし、コラボレーション機能も提供されているWeb IDEです。SSHやSFTPによる接続をサポートし、無料から利用できます。
バージョン管理の機能も付属し、セットアップフリーである点が強調されています。大人数での利用、企業利用を想定しているようです。
Powerful IDE in the cloud | CodeTasty
Coder
VS Codeをサーバーベースで動かすプロジェクトです。このCoderの成果がGitHub Codespacesなどに活かされています。OSSとして動かすことはもちろん、エンタープライズ向けに有料サポートも提供しています。
どのパブリッククラウドでも動作は可能とのことです。自分の手元の環境でWeb IDEを立ち上げたいという方にお勧めです。
Coder - Remote development on your infrastructure
StackBlitz
パブリックなプロジェクトであれば無料で利用できます。有料プランは月額8.25ドルから提供されます。特にフロントエンド開発やNode.jsプロジェクトの開発に最適化されているようです。
テスト用のサーバー機能があり、リアルタイムに変更内容が反映されます。プレビュー側は複数デバイスで表示でき、各デバイスでホットリロードが行われます。
StackBlitz | Instant Dev Environments | Click. Code. Done.
Visual Studio Code.dev
Webベース、フロントエンドのみで提供されるVisual Studio Codeです。GitHubからデータを取り込んで編集できます。サーバーレスで動作しているので、機能拡張は一部しか使えません。
機能は多少限定的ですが、それでもWebブラウザだけで動作する点がユニークです。
作業の開始 — ワークスペース — Visual Studio Code
まとめ
Web IDEとしてVisual Studio Codeをベースに使っているケースが増えているようです。そこに自社独自の機能を実装し、サービス化しているようです。それはリアルタイムコラボレーションであったり、企業ごとのコンテナであったりします。
Web IDEを採用する最大のメリットは、開発環境のセットアップが不要ということでしょう。すぐに開発に入れれば、開発生産性の向上に大きく貢献するはずです。ぜひ試してみてください。
