![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiko4php1XCSdjxIFET19Ec1iJzXbi9TfvWgojJJUGCTVs16oqT1FOe2szRFd0I12-xPN_Lruboj-RpdTj4KpZZEW45gUXr91nzW38fAbZbd4FVNqEaATTv5LDoXTAvht6GRxYOB7WuQU_0nlMxKC2vYDZaLPsmKzwhjD0z3qyrEPVKViG5PTpQdPqZ/s1600-rw/nodejs.jpg)
Nodejsのテンプレートエンジンである「ejs」を、使ってみたいと思います。
HTMLファイルの拡張子を「.ejs」にすると、HTMLをテンプレートファイルとして扱えちゃいます。
Install
$ npm install ejs
githubでも公開されているらしい
https://github.com/visionmedia/ejs
Summery
nodeで記述した値を書き出す。
エスケープする※value値を入力する
<%= 値 %>
エスケープしない※が書けます
<%- 値 %>
スクリプトを実行※各行毎に書く必要があります。
<% スクリプト %>
Sample
index.html
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<h1><%=title %></h2>
<h2><%-content %></h2>
</body>
</html>
node.js
var http = require('http'),
fs = require('fs'),
ejs = require('ejs');
var hello = fs.readFileSync('./index.ejs', 'utf8');
var server = http.createServer();
server.on('request', function(req,res){
var index = ejs.render(hello, {
title:"<div>Title-value</div>",
content:"<div>Contents-value</div>",
});
res.writeHead(200, {'Content-Type': 'text/html'});
res.write(index);
res.end();
});
server.listen(1234);
console.log('Run ...');
Action
$ node node.js
Result
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEil2Ab2zqomy9EYC-VqJWSsZN3hLmSdNI7T4HWkqyaayHjEivDKNh30ucc444nFMI_tftTgbPIbE4TGRIhsHfibMC0BCchbpoPYIhfstOXv0rnS1Lu7YxWm4Y_r7e-DZIO5oMEiJtgz2mpmgm0Ufk155AnD9TF62xRQ2MpKJ45rtkO16rX9Xe67x2Qq/s1600-rw/3b07b80390f420b49ffc66ef867d14b8.png)
この表示が出ると成功です。
お疲れ様でした。
Settle
この形式を使えば、HTML形式で、コードを埋め込んでクエリや、変更される値などを、JS側で、計算や、配列保持すれば、簡単なフレームワークが形成できますね。
0 件のコメント:
コメントを投稿