ExpressでWebアプリケーションを自動生成する(5/6):初心者のための Node.jsプログラミング入門

ExpressでWebアプリケーションを自動生成する (5/6)

作成:2013-05-12 10:21
更新:2015-08-13 11:10

■「routes」のスクリプトとテンプレート

続いて、表示するWebページの処理を見ていきましょう。Webページは、「routes」内にスクリプトを、「views」内にテンプレートを用意し、両者の組み合わせで作成されます。ここでは、/indexで表示されるページを構成するroutes内の「index.js」と、views内の「index.ejs」の中身を見てみましょう。（下のリストを参照）

・expressライブラリのロード

var express = require('express');

ここで必要となるexpressライブラリをロードします。これはapp.jsのところでも登場しましたね。Expressのオブジェクトです。

・Routerオブジェクトの用意

var router = express.Router();

expressの「Router」メソッドを呼び出します。これでルーティング（URLと、それで呼び出される処理とを関連付け得るためのもの）に関するオブジェクトを作成します。

・GETでルート情報を設定する

router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

Routerにも、app.jsのexpressオブジェクトと同じようにgetメソッドが用意されています。これでURLのパスに関数を設定します。これで、指定したアドレスにアクセスがあったら設定した関数を呼び出し実行するようになります。

ここではrenderメソッドを呼び出してindexのテンプレートをレンダリングしています。

・exportsにrouterを設定

module.exports = router;

最後に、module.exportsにrouterオブジェクトを設定して作業完了です。app.jsで、最後にmodule.exports = app;を実行していたのと同じですね。

以上、整理すると「Routerの作成」「getによるルートの設定」「module.exportsにrouterの設定」という流れでルーティングが行われていました。ここではindexについて調べましたが、基本的にはどれも同じような形でルーティングを設定します。ルーティングのためのスクリプトは、自分で新たにページを追加すると用意しないといけなくなりますから、書き方の基本はしっかり覚えておきましょう。

(by. SYODA-Tuyano.)

※プログラムリストが表示されない場合

AddBlockなどの広告ブロックツールがONになっていると、プログラムリスト等が表示されない場合があります。これらのツールをOFFにしてみてください。

●プログラム・リスト●

※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>

※関連コンテンツ

<< prev next >>

「初心者のための Node.jsプログラミング入門」に戻る