いつも忘れてしまうので、自分用のメモです。
前提条件
- macOS High Sierra
- 以下のツールがインストール済みである
- Homebrew
- nodebrew
下準備
ターミナル.app を起動し、以下のコマンドを入力する
// nodebrew自身を最新版にする
$ nodebrew selfupdate
// 今、インストールされている node.js のバージョンと、インストールできる node.js のバージョンを確認する
$ nodebrew ls-all
//最新の node.js をバイナリーインストールする
$ nodebrew install-binary <version>
// インストールした node.js を使用できるようにする
$ nodebrew use <version>
// 古い node.js が必要ない場合はアンインストールする
$ nodebrew uninstall <version>
// node.js と npm のバージョンを確認する
$ node -v
$ npm -v
// npm のグローバルパッケージをアップデートする
$ npm update --global
// Express Generator をグローバルインストールする(最初の1回だけでOK)
$ npm install express-generator --global
プロジェクト作成
// プロジェクトを作成したいフォルダに移動する
$ cd tmp
// Express Generator でプロジェクトを作成する
// プロジェクト名は任意。ここでは myapp とする
// テンプレートエンジンは ejs とした。オプションなしのデフォルトは pug (旧jade)になる。
$ express myapp --view=ejs
// プロジェクトフォルダに移動する
$ cd myapp
// Nodeモジュールをインストールする
$ npm install
// アプリケーションを起動する
$ npm start
// ブラウザでアプリケーションにアクセスする
http://localhost:3000/
上記画面が表示されていれば、環境構築が完了。
次回は、heroku.com へのデプロイ(配置)手順の予定。
参考
主要ファイルの中身
/package.json
{
"name": "myapp",
"version": "0.0.0",
"private": true,
"scripts": {
"start": "node ./bin/www"
},
"dependencies": {
"body-parser": "~1.18.2",
"cookie-parser": "~1.4.3",
"debug": "~2.6.9",
"ejs": "~2.5.7",
"express": "~4.15.5",
"morgan": "~1.9.0",
"serve-favicon": "~2.4.5"
}
}
/app.js
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var index = require('./routes/index');
var users = require('./routes/users');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', index);
app.use('/users', users);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// 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;
/routes/index.js
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index', { title: 'Express' });
});
module.exports = router;
/views/index.ejs
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<link rel='stylesheet' href='/stylesheets/style.css' />
</head>
<body>
<h1><%= title %></h1>
<p>Welcome to <%= title %></p>
</body>
</html>