【Node.js express】Express Generatorを用いてプロジェクトを立ち上げる。

1: Express Generatorをインストールする。

ターミナル.

npm install -g express-generator

2: Express Generatorでアプリケーションを作成する。

ターミナル.

express --view=ejs　<アプリ名>

#　--view=ejs　テンプレートエンジンにejsを指定するオプション。

• bin　(アプリケーションを実行するためのwwwファイルが配置)
• public　(公開ディレクトリ images javascripts stylesheets配置)
• routes　(ルーティング)
• views　(テンプレートファイルを配置)
• app.js　(メインプログラム)
• package.json　(npmを管理)

が作成される。

3:パッケージをインストールする。

ターミナル.

npm install

package.jsonを元に必要なパッケージがインストールされる。

初期package.json

{
  "name": "node_app",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node ./bin/www"
  },
  "dependencies": {
    "cookie-parser": "~1.4.4",    //Expressでcookieを利用
    "debug": "~2.6.9",            //デバッガー
    "ejs": "~2.6.1",              //ejs　テンプレートエンジン
    "express": "~4.16.1",         //expressそのもの
    "http-errors": "~1.6.3",      //エラー処理
    "morgan": "~1.9.1"            //ログ出力
  }
}

必ず使うことになるexpress-sessionをインストールする。

ターミナル.

npm install express-session

express-sessiionモジュールを読み込む。

app.js

const session = require('express-session'); 

express-sessionを設定し、appに組み込む

app.js

var session_opt = {
  secret: 'keyboard cat',
  resave: false,
  saveUninitialized: false,
  cookie: { maxAge: 60 * 60 * 1000 }
};
app.use(session(session_opt));

//var app = express();　と ルーティング設定の間に記述

4: アプリケーションの起動

ターミナル.

node bin/www

起動スクリプトは作成されたbinディレクトリ内のwwwファイルに記述されている。

app.js

(一部)
var express = require('express');    //expressの読み込み
var app = express();                 //アプリケーションオブジェクトを作成し、appに格納
module.exports = app;                //appをエクスポート

//bin/www

(一部)
var app = require('../app');   //app.jsを読み込み
var http = require('http');    //httpコアモジュールを読み込み

var port = normalizePort(process.env.PORT || '3000');  
app.set('port', port);                                 //環境変数で指定したポート、falseなら3000をportにセット

var server = http.createServer(app);    //httpサーバーを作成
//この処理により、クライアントがサーバにアクセスしたらapp.jsが読み込まれる。

server.listen(port);       //指定ポートで待機

package.jsonに

package.json

  "scripts": {
    "start": "node ./bin/www"
  }

スクリプト指定されているので

ターミナル.

npm start

でも可能。

VScodeの場合

pacage.josnがあるディレクトリを開いている場合、エクスプローラー欄に "NPMスクリプト"という蘭が表示される。
その配下のpackage.jsonから、"start"をクリックでも可能

5: 確認

6: 必要な設定、モジュールロード、モジュール組み込み(app.js)

app.js

//モジュールの読みこみ
var createError = require('http-errors');
//httpエラーの対処を行うたものもの。
var express = require('express');
//expressそのもの
var path = require('path');
//ファイルパスを扱うためのもの
var cookieParser = require('cookie-parser');
//クッキーのパースに関するもの
var logger = require('morgan');
//httpリクエストのログ出力にかんするもの。

var app = express();



// ビューエンジンの設定
app.set('views'), path.join(__dirname, 'views'));
//テンプレートファイルが保管される場所を設定
app.set('view engine', 'ejs');
//ejsをテンプレートエンジンに指定



//モジュールの組み込み
app.use(logger('dev'));
app.use(express.json());
//Body-Parserを基にExpressに組み込まれた機能。クライアントから送信されたデータを、req.body経由で会得、操作できる。
//リクエストオブジェクトを JSONオブジェクト として認識する。
app.use(express.urlencoded({extended: false }));
//Body-Parserを基にExpressに組み込まれた機能。クライアントから送信されたデータを、req.body経由で会得、操作できる。
//リクエストオブジェクトを 配列、文字列 として認識する。
app.use(cookieParser());
app.use(express.static(path,join(__dirname, 'public')));
//イメージ、CSS ファイル、JavaScript ファイルなどの静的ファイルを提供する.


//ルーティング
app.use('/', 'index.js');


// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

//モジュールエクスポート
module.exports = app;