NudgePadで遊んでみた -1- Tweet
JavaScriptをブラウザ上で試すサイト、ってのはよくある(最近お気に入りのPlunkerもそのひとつ)んですが、NudgePadというnode.jsのWebサーバをブラウザ上で試せるサイトがある、ということで、面白そうだったので遊んでみました。
サインアップ
http://nudgepad.com/ にアクセスすると、 http://landing.nudgepad.com/ にリダイレクトされてサインアップ画面になります。
プロジェクトURLは、重複するものがなければ再確認なしで作成されるので、Start Project ボタンを押すときは用心したほうが良さそうです。
とりあえずセキュリティ対策
プロジェクトが無事作成されるとファイル一覧画面になります。
この時点で用意されているのは index.html と nudgepad/ ディレクトリですが、ここにあるファイルすべてがプロジェクトURLから公開されている状態です。
nudgepad/ ディレクトリにはログインに必要な情報も入っているので、ファイル名さえわかっていれば丸見えになります。
とりあえず用心のため、 nアイコン → Labs → Private でプライベートファイルの設定をしてしまいます。(なんでこんな重要な機能が Labs なのかは謎)
テキストエリアに /nudgepad/ を入力して Save して、 Restart でサーバを再起動すると、とりあえずnudgepadディレクトリ以下はログインしているユーザー以外にはみえなくなって一安心です。
まずサーバ側を試してみる
nアイコン → Server でサーバ側のログとシステム情報が確認できます。ここにコンソールもあって、直接コマンドを実行することもできます。
ここで Menu → Edit App.js すると、以下の内容の app.js というファイルがWebサーバのひな形として作られます。
module.exports = function (app) {
app.get('/hello', function (req, res, next) {
res.send('Hello world')
})
}
Restart でサーバを再起動すると、 app.js が起動時に読み込まれます。
ひな形には /hello へのリクエストに文字列を返す処理が入っているので、試しに http://プロジェクトURL/hello にアクセスすると、 app.jsに書いてある処理の通りに “Hello world” が表示されるはずです。
ちなみに、フレームワークはexpressの3.1.1が使われているようです。
あと、 app.js はさすがに特別扱いされているようで、 http://プロジェクトURL/app.js にアクセスしても、 "app.js is private" と表示されるだけで中身は見えませんでした。
GitHubとの連携
nアイコン → Labs の一覧に Git とかあったので試してみました。
Commands メニューにgit関係のコマンドが用意されています。
まず、 Install でgit initが(あとたぶんgit add .も)実行されて、リポジトリが初期化されます。
実行結果にも書いてありますが、ユーザー名とメールアドレスを設定しろ、と言われるのですが、 Git 画面からは設定できないらしく、コンソールから
git config --global user.email "you@example.com"
git config --global user.name "Your Name"
をそれぞれ実行することで設定する必要があります。
設定が終わったら Commit でコミットしておきます。
次にGitHubにリポジトリを用意して、 Create Deploy Key で SSH Key を作るんですが、ポップアップに小さく Key が表示されます。うっかり閉じてしまった場合は /nudgepad/deploy.key.pub に Key が格納されてます。
お察しの通り、 Private で隠しておかないと、Private Keyともども丸見えです。
GitHubのリポジトリの Deploy Key にこの Key を設定すれば、NudgePadからGitHubにアクセスできるようになります。Connect to GitHub でGitHubへの接続テストができますが、 ~/.ssh にディレクトリがないとエラーになるので、コンソールから
mkdir ~/.ssh
chmod 700 ~/.ssh
で用意するのが吉です。
あとは、 Add Origin でGitHubのリポジトリURL(SSHのほう)を設定して Push to Origin すれば、GitHubのリポジトリにファイルが格納されます。
さっき書いたとおり、コンソールから普通にgitコマンド使えるので、いざとなればいつもどおりの運用もできるかと。
ログイン機構
ここまできてもまだ「ログイン」らしい作業をなにもしてないですが、ユーザー認証情報はCookieに入っているだけなので、ほっとくとログインできなくなってしまいます。
nアイコン → Team にユーザー認証まわりの設定がありますが、作りかけ感たっぷりなシロモノで、メニュー名が"undefined"になってたり、メニューの Login Link を選んでも肝心の部分が"undefined"になったダメっぽいURLが表示されるだけだったりします。
普通にプロジェクトを作ったままの場合、ユーザーのメールアドレスは owner@プロジェクト名.nudgepad.com になっています。チームメンバーなら後述するログイン画面でメールアドレスを入力すれば、メールでログイン用のURLが送られてきますが、このままでは当然メールが届きません。
というわけで、 Change Email で自分のメールアドレスを入力するのがここでの正解のようです。
で、 Logout を選んだり、Cookieが消えたりしてログインし直す時はどうするのか、というと、 http://プロジェクトURL/nudgepad にアクセスするとログイン画面が表示されるので、登録しておいたメールアドレス入力して Get Login Link をクリックすると、ログイン用のURLがメールで送られてきます。
お察しの通り、ログイン機構はとても簡易なもので、このURLがバレてしまうとログインできてしまうというレベルのものです。もともと本格的なものに使うサイトではありませんが要注意ポイントです。
今日はここまで
まだほんのさわりだけですが、NudgePadを使いはじめるにあたって必要そうなあたりをまとめてみました。
使ってくうえでいろいろ問題もあったりするんですが、個人的にはそれ込みで楽しめているので、しばらく付き合っていこうかと思っています。