ejsの特殊タグ
| 記述 | 意味 |
|---|---|
| <% %> | JS処理 |
| <%= %> | キー名に指定した値(エスケープあり) |
| <%- %> | キー名に指定した値(エスケープなし) htmlタグに使用 |
expressのルール
- メインのファイルはapp.js
- テンプレートファイルは/views以下に配置
ミニマムコード
app.js
const express = require('express');
const ejs = require('ejs');
const app = express();
// テンプレートエンジンの指定
app.engine('ejs', ejs.renderFile);
app.get('/', (req,res) => {
// render(template, template上の特殊タグ)
res.render('index.ejs',{
contents: '<p>express rendering</p>'
})
})
const server = app.listen('1234', () => {
console.log('server start');
})
index.ejs
<body>
<%- contents %>
</body>
POST処理
body-parserを使う
app.js
const express = require('express');
const ejs = require('ejs');
const bodyParser = require('body-parser');
const app = express();
app.engine('ejs', ejs.renderFile);
// body-parserの初期化
app.use(bodyParser.urlencoded({
extended: true
}))
// get
app.get('/', (req,res) => {
// getはqueryで取得できる
console.log('--- GET ---');
console.log(req.query.name);
console.log(req.query.age);
res.render('index.ejs',{})
})
// post
app.post('/', (req,res) => {
// body-parserにより、POSTパラメータ = req.body
console.log('--- POST ---');
console.log(req.body.name);
console.log(req.body.age);
res.render('index.ejs',{})
})
const server = app.listen('1234', () => {
console.log('server start');
})
index.ejs
<a href="/?name=hoge&age=20">GET</a>
<form action="/" method="post">
<button type="submit" name="button">POST</button>
<input type="text" name="name" value="fuga">
<input type="text" name="age" value="30">
</form>
express-generator
テンプレを一発でつくる
http://expressjs.com/ja/starter/generator.html