そろそろNode.jsスクリプト作成にも慣れてきたので、
簡単なWebアプリ作成に挑戦してみた。
Meteor、MEAN.js、Sails.jsなど色々あって迷ったけど、
まずはシンプルにExpressを使ってみる。
MongoDBコレクションに保存された情報を
Webページ上に一覧表示するスクリプトを、
Node.js+Express+MongoDBで作成した。
テンプレートには以前利用したことのあるEctを使う。
時間フォーマットにはMomentを使い、
デーモン化にはPM2を使った。
Moment本家サイト:
ECTテンプレートエンジン本家サイト:
PM2のGithubページ:
作成の流れ
プロジェクトの初期化処理:
$ npm init $ npm install express --save-dev $ npm install mongodb --save-dev $ npm install moment --save-dev $ npm install pm2 -g
MongoDB本体はあらかじめインストールしておき、
適当なコレクションに適当なサンプルデータを数件入れておく。
下記が本体スクリプト:
app.js
var express = require('express'); var ECT = require('ect'); var MongoClient = require('mongodb').MongoClient; var moment = require('moment'); var app = express(); var ectRenderer = ECT({watch: true, root: __dirname + '/views', ext: '.ect'}); var dbUrl = 'mongodb://localhost:27017/<データベース名>'; app.engine('ect', ectRenderer.render); app.set('view engine', 'ect'); app.use('/static', express.static('public')); app.get('/', function (req, res) { MongoClient.connect(dbUrl, function (err, db) { if (err) { throw err; } var testCollection = db.collection('<コレクション名>'); testCollection.find({}).sort({created: -1}).limit(40).toArray(function (err, docs) { db.close(); res.render('index', {docs: docs, moment: moment}); }); }); }); app.listen(3000);
下記がHTMLテンプレート:
views/index.ect
<!DOCTYPE html> <html lang='en'> <head> <title>Sample Page</title> </head> <body> <table class='table table-condensed'> <thead> <tr> <td>name</td> <td>mail</td> <td>created at</td> </tr> </thead> <tbody> <% for doc in @docs: %> <tr> <td><%= doc.name %></td> <td><%= doc.mail %></td> <td><%= @moment(doc.created).format('MM/DD HH:mm') %></td> </tr> <% end %> </tbody> </table> </body> </html>
下記のコマンドで実行すると
$ node app.js
下記のURLにアクセスすると画面が表示される:
http://localhost:3000/
毎回nodeコマンドを実行するのが面倒な場合は、
PM2でデーモン化しておくことで落ちても再起動してくれる。
pm2 start app.js
おわり
これをテンプレートとして、
色々Webアプリを作ってみたい。