小さい頃はエラ呼吸

いつのまにやら肺で呼吸をしています。


node.js向けフレームワークexpressでアプリケーションのひな形をつくる

2012.3.13追記

現在の最新版で動作するようエントリを修正しました。

2011.5.25追記

現在の最新版で動作するようエントリを修正しました。

はじめに

このエントリでは、node.js向けフレームワークであるexpressを使ってアプリケーションのひな形を作成する手順について書いています。

OSとソフトウェアのバージョン
  • Mac OS X Lion 10.7.3
  • node.js v0.6.12
  • npm 1.1.6
  • express 2.5.8
expressのインストール

expressをインストールする前に、npmをインストールします。

curl http://npmjs.org/install.sh | sudo sh

npmをインストールしたあとで、npmコマンドでexpressフレームワークをインストールします。このとき、-gオプションを指定して、グローバルインストールを行います。これによって、パスを意識することなくexpressコマンドを使用することができるようになります。

sudo npm install express ejs -g
expressでアプリケーションのひな形を作成する

expressコマンドのhelpを見てみると、以下のことができるようです。

  • -sでセッションサポートの有効無効を切り替えられます。
  • -tでテンプレートエンジンを指定することができます。jade or ejs。デフォルトはjade。
  • -cでスタイルシートのエンジンを指定することができます。less or sass or stylus。デフォルトはプレーンcss。
express -h

  Usage: express [options] [path]

  Options:
    -s, --sessions           add session support
    -t, --template <engine>  add template <engine> support (jade|ejs). default=jade
    -c, --css <engine>       add stylesheet <engine> support (stylus). default=plain css
    -v, --version            output framework version
    -h, --help               output help information

今回は、テンプレートエンジンにejsを指定して、sampleという名前でひな形をつくります。以下のコマンドを実行すると、いくつかのディレクトリとファイルが自動生成されます。

express -t ejs sample

   create : sample
   create : sample/package.json
   create : sample/app.js
   create : sample/public
   create : sample/public/javascripts
   create : sample/public/images
   create : sample/public/stylesheets
   create : sample/public/stylesheets/style.css
   create : sample/routes
   create : sample/routes/index.js
   create : sample/views
   create : sample/views/layout.ejs
   create : sample/views/index.ejs

   dont forget to install dependencies:
   $ cd sample && npm install

サンプルプログラムが作成されたら、以下のコマンドを実行します。ここではカレントディレクトリの移動と必要なライブラリのインストールを行っています。

cd sample && npm install
サンプルプログラムの動作確認

ひな形が作成されると、サンプルプログラムをすぐに動かすことができます。nodeコマンドでapp.jsを起動します。

node sample/app.js
>Express server listening on port 3000 in development mode

ブラウザでhttp://127.0.0.1:3000/にアクセスすると、サンプルプログラムの画面が表示されます。

任意のスタイルシートを読み込む

デフォルトではstyle.cssが適用されていますが、任意のスタイルシートを適用したい場合は、cssファイルをpublic/stylesheetsに格納します。

<link rel='stylesheet' href='/stylesheets/test.css' />
任意のJavaScriptを読み込む

任意のJavaScriptを適用したい場合は、jsファイルをpublic/javascriptsに格納します。

<script type="text/javascript" src="/javascripts/test.js"></script>

トラブルシューティング

Cannot find module 'express'のエラーになる。

このまま起動すると、Error: Cannot find module 'express'のエラーになってしまうので、app.jsのrequire関数でexpressを呼び出している箇所を以下のように変更します。

require.paths.push('/usr/local/lib/node_modules');
var express = require('express');