ITエンジニア/デザイナ向けにオープンソースを毎日紹介

nodeアプリケーションがWebブラウザ上で開発、実行できます!

JSFiddleやjsdo.itなどWebブラウザ上でHTML/JavaScript/スタイルシートを記述して実行できるというサービスは幾つかある訳ですが、あくまでもクライアントサイドに寄ったものになっています。

もっと本格的なWebアプリケーションを作るためにはサーバサイドも欲しいと思うでしょう。そこで使ってみたいのがNudgePadです。

NudgePadはWebブラウザ上のIDEと銘打っています。何ができるのか見てみましょう。

プロジェクトを作成するとファイル一覧画面になります。
プロジェクトを作成するとファイル一覧画面になります。

index.htmlを表示してみました。普通にURLアクセスが可能です。
index.htmlを表示してみました。普通にURLアクセスが可能です。

そしてIDEのIDEたるゆえんである、ファイル編集に入ります。

行番号も表示されていて分かりやすい編集画面です。
行番号も表示されていて分かりやすい編集画面です。

編集した後に再表示をすると確かに変更されています。
編集した後に再表示をすると確かに変更されています。

サーバの状態を確認したりできます。個々のURLごとにWebアプリケーションサーバが独立して動いているようです。

サーバの状態を確認。nodeまたはBashが使えます。
サーバの状態を確認。nodeまたはBashが使えます。

普通にサーバのファイルを編集できます。
普通にサーバのファイルを編集できます。

/helloで確かにnodeが動いているのが確認できます。
/helloで確かにnodeが動いているのが確認できます。

app.jsがサーバとして最初に読み込まれるファイルになります。
app.jsがサーバとして最初に読み込まれるファイルになります。

テンプレート機能も用意されていて、例えばBootstrapを読み込んだりできます。

テンプレートでBootstrapを選択。
テンプレートでBootstrapを選択。

以下はデモ動画です。

NudgePadは単なるIDEではなく、nodeベースのアプリケーションを作成してそのまま実行できる環境となっています。サーバのファイルはそのまま編集可能で、サーバをリスタートすれば修正が反映されます。

ファイルはドラッグ&ドロップでアップロード可能で、フォルダもまとめてアップロードできるようになっています。Webブラウザだけで開発できてしまう感覚が面白く、色々な実験にも使えるのではないでしょうか。

NudgePadはnode/JavaScript製、MIT Licenseのオープンソース・ソフトウェアです。

NudgePad is an IDE in your browser

nudgepad/nudgepad

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2