ブラウザで使えるおすすめプログラミングエディタ【オンラインで実行しよう】

プログラミングをやろうと思っても、自分で環境作るの面倒くさい・・・もっと手軽にサクッと試すことはできないものか。きっと思ったことがあると信じます。そんな時に使えるのが、オンラインで実行できるプログラミングエディタ。コードを書けば、そのコードを実行できるからサクッと試すのに便利なんですよね。

今回はそんなオンラインで使えるプログラミングのエディタを紹介していきます。エディタによって使える言語だったり違いがあるから、自分が使いたい言語を使うことのできるエディタを用途に応じて使ってみるといいでしょう。まあちょっと見ていきましょう。

ブラウザで使えるおすすめプログラミングエディタ

paizaをやったことのある人はプログラムをいじったことのある人なら結構多いんじゃないかなー、と思う。paiza.ioはpaiza何やっているオンラインで試せるプログラミング実行環境。

ちなみにトップページにおすすめコードなんてものが出てくるけど、4,5年前のものだったりしてうまく実行できなかったりするから見なくてもいいと思う。4,5年もしたら使えない関数なんかも出てくるだろうしね。

paiza.ioで試すことのできる言語はこんな感じ。結構ありますよね。これだけあれば、あまり困ることはなさそうです。

実行は言語を選択して、その言語でガリガリコードを書いて[実行]ボタンを押せばいいだけ。以下のコードを書いて実行してみます。

package main
import "fmt"
func main(){
    // Your code here!
    
    fmt.Println("Hello World")
}

下のほうに[Hello World]が表示されますね。他の言語でも同じようにやってくれます。

ちなみにMySQLを選ぶことができたので、ちょっと試してみました。ブラウザでSQL試せるのかーって思ってね。

create table Test(id integer, title varchar(100));
insert into Test(id, title) values(1, "Hello");
select * from Test;

実行してみると、作成したテーブルのデータを見ることができた。ブラウザでSQL実行できるなんて思っていなかったから結構便利かもしれない。ちなみにMySQLはあるけど、Postgresはないですね。

Piaza.io結構いろんな言語でコード書いて実行することができるからブラウザで迷ったら使ってみるといいかもしれない。というよりブラウザでサクッと試すならもうこれでいいんじゃないか感ある。

あまり見ないサイトかもしれないけど、codinggroundはかなり多くの言語をブラウザで試すことができる。その網羅範囲が凄いです。

ちょっと多すぎて収まらないんだけど、まあこれだけでもかなり多くのものを使うことができるんだなあっていうのが分かると思う。実行はコードを書いて、[Execute]をクリックすれば行われる。

Paiza.io使ってみたけど、使いたい言語が対応していなかった・・・っていう場合にはこのサイトを覗いてみるといいと思うよ。

JSFiddleはブラウザでHTML・CSS・JavaScriptを試すことのできるエディタ。これ結構使ったりします。デザインも良い感じで悪くない。[Run]を押せば書いたコードの実行結果を右下から見ることができるし、いいです。

ちなみにjQueryやVue、Reactなんかも使うことができてboilerplateから始めることができる。

例えばVue、TypeScriptならこんな感じですね。

良い感じ、綺麗です。

CodePenも結構見る機会ありますよね。ネットでコードを検索したりするとCodePenで公開している人とかいるので、その時とか結構助かる。CodePenもJSFiddleと同じようにHTML・CSS・JavaScriptを書いてその実行結果を見ることができます。

CodePenはただ試すだけじゃなくて、いろんなコードが掲載されていたりするのがなかなか便利。ReactやVue、FlutterなどたくさんのTopicがありますね。

例えばSassをみてみると、Sassに関する誰かのコードが見れたりする。単に自分でコードを書くのを試すだけじゃなくて、他の人が書いたコードを参考にしたい時にも使える。

CodePen見るときって、実装方法検索しててリンククリックしたらCodepenで誰かの参考コードが掲載されていた・・・っていうパターンが多い気がする。CodePenのトップページちゃんと見たことのある人って意外と少ないんじゃないかなーって思うけどどうだろう。

トップページ見てみるとさっき見たTopicなんかかなり種類あるから、普段からコード書くなら一度は見ておくのがおすすめ。HTMLやCSS、JavaScriptを書くならJSFiddleとCodePenなイメージかな。

SQLをよく書く人ならお世話になっている人もいるかもしれない。SQLFiddleは、SQLを書いて実行結果を試すことができるオンラインエディタ。

ちなみにMySQL以外にもOracleやPostgresも使うことができる。Paiza.ioではMySQLしか使えなかったけど、SQL特化だけあっていくつかDBの種類あって良い感じ。

ただ、MySQLのバージョンって最新8.0とかじゃなかったけ。そういったところの対応はなされていないようですね、まあしょうがない。

TypeScript PlaygroundはTypeScriptを試すことのできるオンラインエディタ。左側にコードを書いて[Run]で実行すると右側に実行結果が表示されます。

Exampleがいくつかあるけど、結構エラー出たりしたりしてちょっとなんとかして欲しい感がある。

まあ、TypeScriptを試したいっていう時にはいいかな。ちなみにplaygroundはtypescriptlang.orgの1つの機能で、Docsなんかもあるからタブから色々見てみるといいです。

オンラインで使うことのできるプログラミングのエディタを見てみたけど、どうだっただろうか。調べてみると結構あるからどれ使っていいか迷いますよね。個人的にはJSFiddleなんかをサクッと試したい時によく使うかなーっていう感じです。デザインも綺麗で見やすくて良い感じ。

サーバーサイドの言語は考えてみると、オンラインエディタでそこまで試したことないかなあ・・・っていう感じだ。大体ローカルに環境作ってそこで色々やることが多い気がする。サーバーサイドDBのデータなんかと関連するしね。オンラインだとちょっと試しづらいかもしれない。

まあ、良い感じのあったら、オンラインでも試してみるといいと思いますよ。