ちょっと node.js を使う用事ができたので、手始めに express とやらを読み解いてみようと思いました。

node 公式サイト

Node.js 日本ユーザーグループ
 Express
└ Express のアプリケーション生成プログラム

環境

	version
OS	macOS Sierra (10.12.4)
node.js	v7.9.0
npm	4.2.0
express	4.15.2
express-generator	4.15.0

express-generatorとは

node.js の有名な(もはやデファクト)フレームワークである express を用いたアプリケーションがコマンドひとつで生成できるよ、と言う便利プログラム。

express コマンド概要

とりあえず、--help を叩いてみる。

$ express --help

  Usage: express [options] [dir]

  Options:

    -h, --help           output usage information
        --version        output the version number
    -e, --ejs            add ejs engine support
        --pug            add pug engine support
        --hbs            add handlebars engine support
    -H, --hogan          add hogan.js engine support
    -v, --view <engine>  add view <engine> support (dust|ejs|hbs|hjs|jade|pug|twig|vash) (defaults to jade)
    -c, --css <engine>   add stylesheet <engine> support (less|stylus|compass|sass) (defaults to plain css)
        --git            add .gitignore
    -f, --force          force on non-empty directory

オプションで viewエンジン や stylesheetエンジン の指定もできるらしい。
使ってみて地味に便利だったのが、 --git オプション。
.gitignore ファイルを自動で生成してくれて、リポジトリがスッキリ。

とりあえずやってみたいという人は

$ express

だけ打てば、全てデフォルト値で、
sass 使いたいんだよね！と言う人は

$ express -c sass

とすると sass を使うアプリケーションを生成してくれる。

基本的なアプリケーションを作ってみる

$ express ./otameshi

このコマンドを打つと、カレントディレクトリに otameshi ディレクトリを作って、その中に色々盛り込んでくれる。

$ express ./otameshi

  warning: the default view engine will not be jade in future releases
  warning: use `--view=jade' or `--help' for additional options


   create : otameshi
   create : otameshi/package.json
   create : otameshi/app.js
   create : otameshi/routes
   create : otameshi/routes/index.js
   create : otameshi/routes/users.js
   create : otameshi/public
   create : otameshi/views
   create : otameshi/views/index.jade
   create : otameshi/views/layout.jade
   create : otameshi/views/error.jade
   create : otameshi/bin
   create : otameshi/bin/www
   create : otameshi/public/javascripts
   create : otameshi/public/images
   create : otameshi/public/stylesheets
   create : otameshi/public/stylesheets/style.css

   install dependencies:
     $ cd otameshi && npm install

   run the app:
     $ DEBUG=otameshi:* npm start

こんな感じ。色々生成されているのがわかる。
jade は商標だかの関係で pug と可愛く名前を変えているせいか WARN が出ているが、無視して大丈夫。

指示通り

$ cd otameshi && npm install

を実行してみる。

$ cd otameshi && npm install
npm WARN deprecated jade@1.11.0: Jade has been renamed to pug, please install the latest version of pug instead of jade
npm WARN deprecated transformers@2.1.0: Deprecated, use jstransformer
otameshi@0.0.0 /Users/ishiguro/Documents/asobi/otameshi
├─┬ body-parser@1.17.1 
│ .
├─┬ cookie-parser@1.4.3 
│ .
├─┬ debug@2.6.4 
│ .
├─┬ express@4.15.2 
│ .
├─┬ jade@1.11.0 
│ .
├─┬ morgan@1.8.1 
│ .
└─┬ serve-favicon@2.4.2 
  .

最初の2つのWARNに関しては、パッケージ古いけど大丈夫？的なやつで、nodeがよしなに解決してくれていそうなので、こちらも無視して大丈夫。

さらに指示通り

$ DEBUG=otameshi:* npm start

を実行してみる。

$ DEBUG=otameshi:* npm start

> otameshi@0.0.0 start /Users/ishiguro/Documents/asobi/otameshi
> node ./bin/www

  otameshi:server Listening on port 3000 +0ms

この状態で http://localhost:3000/ にアクセスをすると

こんな感じの真っ白シンプルなページが表示される。
ログにも

GET / 304 442.500 ms - -
GET /stylesheets/style.css 200 13.251 ms - 111

こんな感じで表示されている。
できてるぽい。

長くなりそうなので、読み解きはその2(未執筆) で。

参考URL

Express のアプリケーション生成プログラム