外出先でも快適にコーディング！おすすめオンラインコードエディタ6選

コードエディタといえば、通常はパソコンやスマートフォン、タブレットにソフトウェアをインストールして使うものです。それ自体は問題ありませんが、ふと素晴らしいアイデアが浮かんだのに、肝心のソフトウェアが手元にない…そんな経験はありませんか？オンラインコードエディタなら、インターネット環境さえあれば、場所やデバイスを選ばずにどこでもコーディングが可能です。しかも多くのサービスが完全無料で利用でき、オンラインでの共同作業にも対応しています。

1. Code Share

Code Shareは、オンラインコードエディタの中でも特に優れたサービスの一つです。多数のプログラミング言語に対応しており、使用したい言語を選ぶだけで適切なシンタックスハイライトが自動的に適用されます。

共同作業にも非常に強いプラットフォームです。リンクを同僚や友人と共有すれば、リアルタイムで一緒にコーディングできます。プロジェクト作業中にビデオチャットを使いながら打ち合わせることさえ可能です。なお、アカウントを持っていない場合、プロジェクトは24時間で期限切れになりますが、コードはいつでもダウンロードして保存できます。

外出先でのサクッとしたコーディング、コードのトラブルシューティング、プログラミング教育、新しいアイデアの試作などに最適です。アカウントを作成して作業を保存することも、アカウントなしで利用することもできます。どちらの場合でも、プラットフォームは無料で使えます。

2. CodeSandbox

CodeSandboxはチーム開発向けに作られたプラットフォームですが、個人利用にも最適です。React、Angular、Vue、Vanilla JavaScriptなど、Web開発言語を幅広くサポートしています。テンプレートを選ぶだけですぐに開発を始められるほか、他のメンバーを招待しての共同開発も、一人での開発も自由自在です。

操作性も直感的で使いやすく、無料アカウントを作成すれば、いつでもどこからでもプロジェクトにアクセスできます。デスクトップのコードエディタに匹敵する本格的な見た目と操作感も大きな魅力です。

Code Shareとは異なり、CodeSandboxは完全無料ではありません。個人利用の場合、公開サンドボックス（個別のプロジェクトワークスペース）の作成だけであれば無料で使えます。非公開サンドボックス、追加ストレージ、GitHubリポジトリ連携などの機能が必要な場合は、月額7ドルの有料プランを利用しましょう。また、チーム開発向けには月額24ドルからのビジネスプランも用意されています。

3. PlayCode

PlayCodeはフロントエンドWeb開発に最適なエディタです。CSS、JavaScript、HTMLをどこからでも簡単に扱えます。エディタパネルをカスタマイズして、自分好みの作業環境を構築できるのもポイントです。

豊富なテンプレートでプロジェクトを素早くスタートでき、ドロップダウンメニューから言語を瞬時に切り替えることも可能です。

シンタックスハイライトとエラー表示機能により、プロジェクトの状態を常に把握しやすくなっています。無料アカウントを作成すれば、いつでもコードを保存可能です。ただし、無料プランでは1プロジェクトあたり1000文字までという制限があります（プロジェクト数は無制限）。月額2.50ドルのプレミアムプランにアップグレードすれば、この制限が解除され、追加ストレージなどの特典も得られます。

4. StackBlitz

MicrosoftのVS Codeエディタが好きな方なら、StackBlitzはきっとお気に入りのオンラインコードエディタになるでしょう。VS Codeに似た見た目と操作感を持ちながら、強力な編集機能を備えています。

9種類のワークスペースを備え、オンラインでフルスタックアプリの開発が可能です。Angular、React（JavaScriptとTypeScriptの両方）、Vueなどを幅広くサポートしています。さらに、Progress KendoReactとのパートナーシップにより、より高品質なUIの構築も実現できます。

リアルタイム編集機能に加えてオフライン対応もあり、移動中のコーディングも快適です。アプリのデプロイ、ホスティング、共有までも無料で行えます。公開プロジェクトの作成は無料ですが、非公開プロジェクトや追加機能を利用するには月額9ドルの支払いが必要です。

5. CodePen

CodePenは、無料で使えるオンラインコードエディタの中でも特に人気の高いサービスです。フロントエンドWeb開発向けに設計されており、このリストの他のサービスと同様に共同作業が可能なプラットフォームですが、もちろん個人プロジェクトにも十分活用できます。

作成したプロジェクトを公開して他のユーザーから貴重なフィードバックをもらったり、ホストしたプロジェクトをCodePenから直接発表したりできます。コードを分解して解説する教材として活用することもできるでしょう。

さらに、スキルアップにつながるチャレンジ（課題）も用意されています。学習しながら他者と協力し、コーディングを楽しむ絶好の機会となるはずです。

利用開始にアカウントは不要ですが、作業を保存するには無料アカウントが必要です。無料プランでもプロジェクトの作成とホスティングは可能です。ただし、画像などのファイルアップロードや非公開プロジェクトの作成には、月額8ドルのCodePen Proへのアップグレードが必要です。

6. PseudoEditor

擬似コードを扱う方ならご存じの通り、ほとんどのオンラインコードエディタは擬似コードにネイティブ対応していません。PseudoEditorは擬似コード専用に開発された珍しいエディタです。シンタックスハイライト、自動補完機能、コード保存機能を備え、プロジェクトの設計段階でのアイデア整理に最適です。

オンライン版が気に入ったら、Windows・Mac向けのダウンロード版もあります。どちらも同じように動作し、しかも両方とも完全無料で利用できるのが嬉しいところです。

シンプルなエディタに見えますが、余計な機能に頼らずしっかりと目的を果たしてくれるのが魅力です。外出先での手軽なコーディングにぴったりと言えるでしょう。

理想のモバイル用エディタが見つかったら、自宅のデバイス用のお気に入りエディタも用意しておきましょう。Mac、Android、Linux向けにはさまざまなエディタが存在します。そしてもちろん、MicrosoftのVisual Studioという頼れる選択肢もあります。