Syntax Error.

[Sy] express-generator を使って Node.js のアプリ作成&起動

2018/01/15

Node.js のフレームワーク Express のアプリの雛形を作成してくれる express-generator を使ってアプリ作成&起動をするまでの手順です。

0. 準備

Node.js と npm をインストールしておきます。

まだインストールしてない場合は、こちらの記事で説明してます。(別のインストール方法でも問題ないです)

⇒ [Sy] nodebrewを使ってMac (El Capitan) にNode.jsをインストールして管理する

1. express-generator をグローバルにインストール

-g オプションを付けて、グローバル領域に express-generator をインストールします。

$ npm install express-generator -g

これで express コマンドが使えるようになります。

2. アプリの雛形を作成

アプリのディレクトリを作成したいところまで移動し、以下のコマンドを実行するだけです。

例として、 my-app という名前のディレクトリ配下にアプリを作成する場合になります。

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


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

   install dependencies:
     $ cd my-app && npm install

   run the app:
     $ DEBUG=my-app:* npm start

アプリが作成されました。

my-app ディレクトリが作成されているので、移動しておきます。

$ cd my-app

まだこの段階では、必要な express を含め必要なパッケージがインストールされていないので、 npm install でインストールします。

$ npm install

これでアプリが動く状態になりました。( node_modules ディレクトリが作成され、その中にパッケージが入ってます)

3. 実行

では実行します。

$ npm start

> my-app@0.0.0 start /Users/utano320/Documents/Develop/my-app
> node ./bin/www

ブラウザで http://localhost:3000 にアクセスすると、以下のような画面が表示されます。

Express起動画面(express-generator使用)

また、以下のように DEBUG=my-app:* と環境変数を設定すると、細かいログが表示されるようになります。

$ DEBUG=my-app:* npm start

> my-app@0.0.0 start /Users/utano320/Documents/Develop/my-app
> node ./bin/www

  my-app:server Listening on port 3000 +0ms