MacOS XにJSX環境を構築する方法

セカンドマシンにJSX

これまでに，MacOS Xに様々なソフトウェアを導入する記事を書いてきましたが，すでに情報が古くなっているのと，本日のJSX推しとして，マッサラな状態からJSXを導入する方法をまとめました．ほぼそのままのインストールログをつけておきますので，参考になれば幸いです．なお，ホスト名は「sahara」，ユーザ名は「suda」です．背景が濃いグレーの箇所が実際に入力する行です．

本日インストールするソフトウェアは，

homebrew 0.9.1

git 1.7.11.1

node.js 0.8.1

npm 1.1.35

JSX 0.0.1

です．

関連ファイルのインストール

まずはXcodeをインストールします．Lionを使用している人はMac App Storeからどうぞ．LeopardやSnowLeopardの人は付属CD-ROMに入っているようです．なお，SnowLeopardまでは開発に使う基本コマンドが出荷時からインストールされていたのですが，Lionからは手動でインストールが必要です．やり方は以下のとおりです．

Xcodeを起動する

「Xcode」メニューから「Preferences...」を開く

開いたウィンドウの上部のアイコンが並んでいるところで「Downloads」をクリックする

「Command Line Tools」の右にある「install」ボタンをクリックして基本コマンドをインストールする

それでは，homebrewをインストールします．「sahara:~ suda$」はプロンプトです．実際のコマンドはsuda$よりも後ろです．1行目はURLが長すぎて折り返して表示されていますが，1行で入力してください．途中でenterキーの押下と管理者のパスワードの入力を求められるので指示に従ってください．

メッセージを見ると「何かインストールする前に'brew doctor'を実行すべきだ」との指示があるのでそのとおりにします．すると，以下のようにエラーが起きてしまいました．どうやら/usr/local/share/manに書き込めないことが原因のようです．sudo付きで実行すれば良いのかな？と思いましたが，指示は「以下のディレクトリにchownすべきだ」なので，どうせならchmodしちゃえ（←後々弊害の出る可能性あり）と勢いでやってしまいました．

続いてbrewをアップデートします．併せて，インストール後にバージョンを表示させておきます．

以上でhomebrewのインストールが完了です．続いてgitをインストールします．

次にnode.jsをインストールします．なんと，最新版の0.8.1がインストールされます．

make installが表示されてからはコンパイル作業を行なっているのか，マシンパワーによってはそれなりに待たされます．諦めてしばらく待ってください．続いて上記7〜9行目のメッセージに従ってnpmをインストールします．

ドキュメント周りでエラーが出ているようですが，とりあえず無視します．

JSXのインストール

以上でようやくJSXのインストールまでこぎつけました．インストール手順としては，github上のリポジトリの取得→セットアップ→PATHの設定です．環境が整っていればすぐに終わります．

ブログ上でnpmのモジュールツリーが化けていますが，画面上ではきちんと表示されているはずです．後は~/JSX/binにPATHを通すなり，PATHの通っているディレクトリにjsxのシンボリックリンクを作成してください．通常は~/binにPATHが通っているのですが，Lionではそもそも~/binが存在しなかったので/usr/local/binにシンボリックリンクを作成する例を示します．※場当たり的対応なので，~/binを作成してPATHを通した上で，~/binにjsxのシンボリックリンクを作成することを勧めます．

うまく設定できていれば，2行目のようにディレクトリ名を付けずに実行できます．

それでは，MacでJSXを楽しんでください．

ツイート

メモ：Macのターミナルの設定

.bashrcの話

このブログを読む方はすでに承知のことと思いますが，Mac OS Xの中枢部はBSD Unixの系統です．なので，ターミナルをひらくと見慣れた画面が開き，いつものコマンドを使うことができます．その割に，ホームディレクトリに.bashrcや.bash_profileが見当たりません．検索してみると，.bash_profileを作ってそこから.bashrcを読み込ませれば良いとのことなので，さっそく指示に従ってみます．

まずは.bash_profileです．

続いて.bashrcです．かなり偏った内容なので，各自好きな設定をどうぞ．

.bashrcの2〜4行目は，Java言語のソースコードの文字コードをUTF-8として指定します．5行目はJSXのための設定です．

以下のブログ・記事を参考にしました．ありがとうございました．

■[Mac]Mac - bash入門
UNIX Settings...

追記

javadocのaliasにcharsetの設定を加えました（2012/6/14）

ツイート

Mac OS Xにnode.jsなどをインストール

パッケージ管理システム

Macでは，macportsと言うパッケージ管理システムが有名だったのですが，root権限が必要などの理由により，最近はhomebrewが勢力を伸ばしてきました．そこで，homebrewを使用してnode.js関係のインストールを行う方法を示します．せっかくなので，インストールログをつけておきます．なお，ホスト名は「sahara」，ユーザ名は「suda」です．背景が濃いグレーの箇所が実際に入力する行です．

本日インストールするものは，

homebrew

node.js

mongoDB

npm

です．

インストール

まずはXcodeをインストールします．Lionを使用している人はMac App Storeからどうぞ．LeopardやSnowLeopardの人は付属CD-ROMに入っているようです．なお，Javaも必要なようなのでインストールしておいてください．

それでは，homebrewをインストールします．以下の1行目の$以降を入力してください．途中でenterキーの押下と管理者のパスワードの入力を求められるので指示に従ってください．

以上でhomebrewのインストールが完了です．ちなみに，コマンド名は「brew」です．さっそくnode.jsをインストールします．

ぼーっと待っているだけでインストール完了です．続いてbrewをアップデートして，mongoDBをインストールします．不要でしたらupdateのみ実行して，mongoDBのインストールは飛ばしてください．

起動方法や自動起動設定は上記ログに書かれているので，必要な方を実行してください．続いてnpmをインストールします．昔はhomebrewでインストールできたようですが，方針の違いから，現在はインストールできなくなっているので，以下に示すようにcurlとshでインストールします．

後はnpmを使用して必要なパッケージをインストールして下さい．以下，「Express」「Socket.IO」「EJS」「Mongoose」をインストールします．

npmのモジュールツリーが化けていますが，原因不明です．それでは，Macでnode.jsを楽しんでください．

追記

ブログのデザイン変更と，コマンドを打ち込む箇所を明示しました．(2011/2/2)

ツイート

OS Xでpowを使ってみる

今回も、MeSHから離れた話題です。

powとは何か？

平たく言うと、Mac OS X上で動作する、Rackサーバです。Rackとは何かと言うと、ruby言語を利用して作成したアプリケーションとWebサーバとのインタフェース統一するためのライブラリです。SinatraもRailsも、Rackを介して動作するようになっています。powは、Rackの仕組みに沿って開発されたプログラムを、お手軽に試す際に有効です。

例えば、Webアプリケーションを試しに作ってみようとして、ホワーンとアイディアが浮かんでいる段階を想像してください。Railsなら、とりあえずプロジェクトを作成して、DBの構造を決めて、scaffoldして・・・mongrelなどを動かして、Webブラウザから確認するという流れになります。Sinatraだと、DBにテーブルを作って、app.rbを作って、mongrelなどを動かして、Webブラウザから確認するという流れになります。もう少し開発が進むと、Passengerなどを使ってApacheと連携するフェーズに進みます。このとき、動作ディレクトリを設定ファイルに登録するのが面倒になります。小規模なプロジェクトだと、ディレクトリまるごとコピーして新旧の動作を比較したいとか、別ディレクトリのプロジェクトと同時進行するなどの場合、いちいち設定ファイルを書き換えるのが嫌になります。このようなときに、Webアプリケーションを簡単に公開するための仕組みがpowです。

powの設定

powはpow.cxで公開されています。最初、ダウンロードのリンクが見つからなくて右往左往したのは秘密です。powのインストールは、以下のコマンドを実行するだけです。

$ curl get.pow.cx | sh

これだけで、様々な設定が行われ、ホームディレクトリに「.pow」というディレクトリが作られます。次に、RailsやSinatraなどで作成したRackアプリケーションのディレクトリのシンボリックリンクを作成します。例えば「/Users/admin/sinatra/test」というディレクトリであれば、

$ cd ~/.pow
$ ln -s /Users/admin/sinatra/test

と入力してください。これで~/.pow/testが作成されます。以上で設定は終了です。後は、Webブラウザを起動して、「http://<作成したシンボリック名>.dev/」にアクセスすればアプリケーションを利用できます。

実際に試してみる

それでは実際にサンプルプログラムを用いて説明していきます。事前に用意するものは、SinatraとRackです。いずれもgemコマンドでインストールできます。

$ gem install rack
$ gem install sinatra

次に、Sinatraを使った簡単なサンプル「app.rb」と、そのプログラムをRackから呼び出すための設定ファイル「config.ru」を作ります。


いずれも、「/Users/admin/sinatra/test」ディレクトリに作成してください。

後は、Webブラウザから「http://test.dev/」にアクセスすると、ブラウザ上に「Hello, world」の文字が表示されると思います。

app.rbを書き換えた場合は、powの再起動が必要となります。「/Users/admin/sinatra/test」直下に「tmp」ディレクトリを作成し、

$ touch tmp/restart.txt

を実行してください。powは、tmp/restart.txtのタイムスタンプを見て、自身を再起動するかどうか決定します。

うーん、シンプル。Mac OS Xを使っていて、RailsやSinatraを使っている人はpowも使ってみてください。数は少ないですが、日本語の記事も出てきています。
Node.js＋CoffeeScriptで書かれた「Pow」がカッコ良すぎる件 | Rails Hub情報局
powを使ってdevelopment環境で複数のrailsアプリを同時に動かす | YomuKaku Memo ツイート

Mac OS XのApache設定

MacBook Air

ちょっと前になりますが、MacBook Air 11'モデルを入手しました。System7以来、久しぶりにMacに回帰しました。CPUなどのスペックには特筆すべきことはない、いや、むしろ今のご時世では貧弱と言わざるをえないのですが、予想外にキビキビ動作します。特にスリープへの移行と復帰は感動ものです。しかも、OS XはBSD UNIXの血を受け継いでいるので、Macは立派なUNIXマシンです。これまでWindows環境上でプログラミングしようとして、数々の苦労をしてきた経験からすると、様々な言語や環境がプリインストールされ、まともに動作することだけで嬉しくなってしまいました。（私とWindowsの相性がわるいことは否定しません。Apacheの設定がうまくいかないとか、Rubyでソケットを使うとうまくいかないとか、CGIの設定がうまくいかないとか、MySQLの設定がうまくいかないとか、昨日まできちんと動いていたシステムが上手く動かなくなったとか、環境設定ファイルがどこにあるのか分からないとか・・・。結局、Windows上で足掻くよりも、仮想計算機環境でDebianを動かす方が楽です。）

細かいところでは、controlキーが正規の位置（Aの左）に配置されているのも好印象です。

まずはApacheの設定

OS Xでは、RubyもApacheもMySQLもPythonもVIMもプリインストールされています。ターミナルを開けば、基本的なUNIXコマンドは使用できます。うーん、幸せ。あ、別にUNIXコマンドが好きなわけじゃなくて、設定を変更したら素直に反映される環境が好きなだけです。

と言うことで、まずはApacheの設定を変更してみます。前提条件として、ユーザ名はadminと仮定して話を進めます。この場合、ホームディレクトリは/Users/adminに、Webサイトのホームディレクトリは/Users/admin/Sitesになります。

準備編

まずは、Webサーバの起動です。標準状態では起動されません。
システム環境設定　ー　共有　ー　Web共有にチェックをつけて「入」にしてください。
Webブラウザから
http://localhost/~admin/
にアクセスすると、エラーが出ずに「あなたのWebサイト。」というタイトルのページが見られることを確認しましょう。もしWebサーバが起動していなければエラーとなります。

気が向いたら、適当なHTMLファイルを作ってWebブラウザで確認してみましょう。ファイルを置くフォルダは前節で説明しています。

CGIスクリプト編

CGIスクリプトは、管理者しか設置できないようにする場合と、ユーザが自由に拡張できる場合のどちらでも設定できます。とりあえずお手軽に試せるように、ホームディレクトリ内に置いたファイルを実行できるようにします。
(1)cgi-binディレクトリを作る
mkdir /Users/admin/Sites/cgi-bin

(2)Webサーバ(Apache2)の設定ファイルを書き換える
主な設定は/etc/apache2/httpd.confに書いてあるので編集する。このとき、一般ユーザの権限では書き込みできないので
cd /etc/apache2
sudo vi httpd.conf
という風にsudoを付けてから書き換える。
#AddHandler cgi-script .cgi
という行があるので、行頭の「#」を取ってこの設定を有効化する私の環境では、396行目でした。


(3)adminユーザのWeb設定を変更する
OS Xでは、ユーザごとのWeb設定ファイルが存在するので変更しましょう。
設定ファイルは/etc/apache2/usersに全ユーザ分が入っています。今回はadminと言う名のユーザなので該当ファイルは
/etc/apache2/users/admin.conf
です。またしても一般ユーザでは書き込めないのでsudoを付けて編集しましょう。
cd /etc/apache2/users
sudo vi admin.conf
元々のファイルには、下記の内容（全6行）が書いてあります。

それを、以下の内容に変更してください。具体的には7行目以降を追加します。Optionsの行は、Apacheのドキュメントを参照して欲しいが、簡単に言うと「CGIの実行を許可」し、「ファイルの一覧表示を拒否」し、「言語の自動判別機能を不使用」としています。


(4)Webサーバの再起動
設定を変えたらWebサーバの再起動をしましょう。コマンドラインから再起動する方法が分からなかったので、システム環境設定　ー　共有　ー　Web共有のチェックを一度外し、一呼吸おいてから再度チェックを付けることで再起動できます。

(5)CGIファイルを作る
CGIなので言語は何でも良いが、せっかく標準でインストールされているのでRubyを例に取ります。
cd /Users/admin/Sites/cgi-bin
vi test.cgi
と入力して、test.cgiを作ってみましょう。サンプルを以下に示します。

たった3行のプログラムです。試しにターミナルから実行してみましょう。viを終了したら、ruby test.cgiと入力すると、画面にcontent-type…以下略と表示されるはずです。もし表示されない場合はプログラムがきちんと入力されていないので確認して下さい。次に、このプログラムに実行属性をつけます。説明は省略しますが、ファイル作成直後のパーミッションは644なので、自分は読み書きが可能、他の人は読むだけです。これでは実行できないので、755の状態にします。
chmod 755 test.cgi
これでコマンドラインから直接実行できるはずです。試しに
./test.cgi
と入力してみると、確かに実行できます。

ここまで終わったら、次はWebブラウザから見てみましょう。
http://localhost/~admin/cgi-bin/test.cgi
にアクセスして、画面にOKと表示されれば（文字通り）OKです。

続く・・・のか？ ツイート