node.jsがインストールされている前提としています。
Express使い方の例
プロジェクト用のフォルダを作成し、そのフォルダに移動して、にてプロジェクトを作成します。
npm init -y
Expressをインストールします。
npm install express
プロジェクトのルートフォルダに以下のようなindex.jsファイルを作成します。
index.js
let port = 3000; //ポート番号
let express = require("express");
let app = express();
let ht = "<html><body>Express練習<body></html>";
// localhost:3000にアクセスした場合
app.get("/",function(req,res){
//HTTPヘッダーを指定する場合
res.append("Content-Type", "text/html");
res.send(ht);
});
let js = {"name":"名前","type":"タイプ"};
// localhost:3000/json にアクセスした場合
app.get("/json",function(req,res){
res.append("Content-type", "application/json");
res.send(js);
});
let listener = app.listen(port,function(){
console.log("port:" + port);
});
コマンドラインにてサーバー起動します。
node index.js
ブラウザにて
localhost:3000
localhost:3000/json
にそれぞれアクセスします。以下のように出力されます。
EJSを使って変数出力の例
新たにプロジェクト用のフォルダを作成し、そのフォルダに移動して、にてプロジェクトを作成します。
プロジェクトの初期化、expressパッケージ、ejsパッケージをインストールします。
npm init -y
npm install express
npm install ejs
プロジェクトのルートフォルダにindex.jsを以下のように作成します。
index.js
let port = 3000; //ポート番号
let express = require("express");
let app = express();
app.set("view engine", "ejs"); //テンプレートエンジンの指定
let toEjs = {asa : "うどん",
hiru : "そば",
ban : "ラーメン",
html : "<b>太文字</b>",
num : 2,
sakana:["アジ","鯖","ハマチ"],
};
app.get("/",function(req,res){
res.render("index.ejs",toEjs);
});
let listener = app.listen(port,function(){
console.log("ブラウザにてlocalhost:" + port + "にアクセスしてください");
});
ejsファイルをプロジェクト内のviewsという名前のフォルダ内に作成します（デフォルトでviewsフォルダを参照します）。ここではindex.ejsというファイル名で作成しています。
配置について.
・ プロジェクトフォルダ
・ index.js
・ viewsフォルダ
・index.ejs
index.ejs
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h1>パラメータの出力</h1>
<%# このタグでコメントアウト%>
<%= asa %><br>
<%= hiru %><br>
<%= ban %><br>
<%= num %><br>
<%= sakana %><br>
<br>
<h1>エスケープ処理なしでの出力</h1>
<p><%- html %></p>
<br>
<h1>条件分岐の例</h1>
<% if(num % 2){ %>
<p>numは奇数</p>
<% } else { %>
<p>numは偶数</p>
<% } %>
<br>
<h1>繰り返しの例</h1>
<ul>
<% for(let e of sakana){ %>
<li><%= e %></li>
<% } %>
</ui>
</body>
</html>
サーバー起動して、ブラウザにてlocalhost:3000にアクセスします。
node index.js
