ExpressとテンプレートエンジンであるEJSを利用してHello worldを出力してみます。
関連ページ
適当なディレクトリを作成したら、その中でnpmの初期化をおこないます。
|
1 2 3 |
mkdir ejs-express cd ejs-express/ npm init |
expressとejsモジュールをインストールします。
|
1 |
npm install --save express ejs |
package.jsonのdependencies項目では以下のように確認できます。
|
1 2 3 4 |
"dependencies": { "ejs": "^2.6.1", "express": "^4.16.4" } |
次にapp.jsファイルを追加します。
|
1 |
vi app.js |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
const express = require('express') const ejs = require('ejs') const app = express() app.set('ejs',ejs.renderFile) app.get('/', (req, res) => { res.render('index.ejs',{title:'Hello world'}) }) app.listen(3000, () => { console.log('start') }) |
2行目
ejsモジュールを読み込んでいます。
5行目
テンプレートエンジンを指定しています。
7〜9行目
renderメソッドを利用して、/にアクセスした際に「index.ejs」（後述）を表示させ、第2引数部分でindex.ejsに渡す値を設定しています。
テンプレートファイルの作成
「views」ディレクトリを追加して、その中に「index.ejs」ファイルを作成します。ファイル構造は以下のようになります。
index.ejsは下記のように記述します。
|
1 2 3 4 5 6 7 8 9 10 11 |
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> <body> <h1><%=title %></h1> </body> </html> |
8行目
app.jsの8行目で渡した「title」の値が引き渡されます。実行すると「Hello world」と表示されます。
