node-webkit をインストールして、サンプルアプリを動かすまで #Node.js

OSX に node-webkit をインストールして使ってみたのでメモ。

インストール

公式サイトから、パッケージをダウンロード。

2014/05/01 だと v0.9.2 が最新。

展開して、node-webkit.app を/Applicationにコピー。

Hello World

手始めに Hello World を書いて、動かす。ファイルの内容は、Quick Startのまま。

$ mkdir hello-nw
$ cd hello-nw

$ vim index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Hello World!!!!</title>
  </head>
  <body>
    <h1>Hello World!</h1>
    We are using node.js <script>document.write(process.version)</script>.
  </body>
</html>

$ vim package.json
{
  "name": "nw-demo",
  "main": "index.html"
}

ただ動かすだけなら、zip でパッケージにする必要が無い。

How to run appsを参考に実行してみる。

$ /Applications/node-webkit.app/Contents/MacOS/node-webkit .

こんにちは！

サンプルアプリを動かす

node-webkit を使ったサンプルアプリが下記で公開されているので、これを動かしてみる。

まずは git clone する。このリポジトリには、6 つのサンプルアプリが含まれていて、それぞれディレクトリが分かれている。

$ git clone https://github.com/zcbenz/nw-sample-apps
$ cd nw-sample-apps
$ tree -L 1
.
├── README.md
├── file-explorer
├── frameless-window
├── menus
├── mini-code-edit
├── mp3-encoder
└── webgl

あとは起動したいアプリのディレクトリを指定して、node-webkit を起動するだけ。

$ /Applications/node-webkit.app/Contents/MacOS/node-webkit file-exploer

ファイルエクスプローラーが起動。動きがおかしいけど、ディレクトリ移動とかはできる。

まとめ

Web の技術を使って、Win / Mac 両対応の GUI アプリが書けるのでこれは良さそう。