{"id":5173,"date":"2014-03-16T18:27:25","date_gmt":"2014-03-16T09:27:25","guid":{"rendered":"http:\/\/www.webcyou.com\/?p=5173"},"modified":"2014-03-16T20:02:16","modified_gmt":"2014-03-16T11:02:16","slug":"node-js-%e3%83%86%e3%83%b3%e3%83%97%e3%83%ac%e3%83%bc%e3%83%88%e3%82%a8%e3%83%b3%e3%82%b8%e3%83%b3-ect%e3%81%8c%e7%88%86%e9%80%9f-%e3%82%89%e3%81%97%e3%81%84%e4%bb%b6%ef%bc%88ect%e3%81%ae%e4%bd%bf","status":"publish","type":"post","link":"https:\/\/www.webcyou.com\/?p=5173","title":{"rendered":"node.js \u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30a8\u30f3\u30b8\u30f3 ECT\u304c\u7206\u901f!! \u3089\u3057\u3044\u4ef6\uff08ect\u306e\u4f7f\u3044\u65b9\uff09"},"content":{"rendered":"

node.js\u3067webApp\u3092\u4f5c\u6210\u3059\u308b\u969b\u3001Express\u3092\u7528\u3044\u305f\u69d8\u3005\u306a\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30a8\u30f3\u30b8\u30f3\u304c\u5b58\u5728\u3057\u307e\u3059\u3002<\/p>\n

\u6709\u540d\u3068\u3053\u308d\u3067\u3001\u300cEJS\u300d\u3084\u300cjade\u300d\u7b49\u3005\u3068\u3042\u308b\u306e\u3067\u3059\u304c\u3001\u305d\u306e\u4e2d\u3067\u3082\u7fa4\u3092\u629c\u3044\u3066\u7206\u901f\u3068\u3044\u308f\u308c\u3066\u3044\u308b\uff08\u3046\u305f\u3063\u3066\u3044\u308b\uff09\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30a8\u30f3\u30b8\u30f3\u304c\u300cECT\u300d\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n

ECT<\/strong><\/h5>\n

\"\"<\/a><\/p>\n

\u516c\u5f0f\u30da\u30fc\u30b8<\/strong><\/p>\n

http:\/\/ectjs.com\/<\/a><\/p>\n

\u78ba\u304b\u306b\u3001Jade\u3092\u4f7f\u3063\u3066\u3044\u305f\u6642\u30da\u30fc\u30b8\u8868\u793a\u306e\u300c\u9045\u3055\u300d\u3092\u611f\u3058\u3066\u3044\u307e\u3057\u305f\u3002<\/p>\n

\u304b\u3068\u3044\u3063\u3066\u300cEJS\u300d\u3092\u4f7f\u304a\u3046\u3068\u601d\u3063\u3066\u3082\u3001Express2 \u307e\u3067\u4f7f\u3048\u3066\u3044\u305flayout\u3001partial\u3001block\u7b49\u304c\u3001<\/p>\n

Express3\u304b\u3089\u306f\u3001\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u90e8\u5206\u3068\u5206\u96e2\u3057\u30b7\u30f3\u30d7\u30eb\u306aAPI\u306b\u3059\u308b\u305f\u3081\u3001ejs-locals\u306b\u79fb\u3063\u305f\u3088\u3046\u3067<\/p>\n

ejs-locals github<\/h5>\n

ejs-locals<\/a><\/strong><\/p>\n

https:\/\/github.com\/RandomEtc\/ejs-locals<\/a><\/p>\n

ejs-locals\u00a0\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb<\/h5>\n
npm install ejs-locals --save<\/pre>\n
\u3053\u3061\u3089\u3092\u4f7f\u3046\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u3002<\/p>\n
ejs\u3068ejs-locals \uff1f\uff1f\u3046\u30fc\u3093\u3002\u3002\u3068\u3001\u3082\u3084\u3082\u3084\u3057\u3066\u3044\u308b\u4e2d\u3001\u7206\u901f\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30a8\u30f3\u30b8\u30f3\u300cECT\u300d\u3092\u5229\u7528\u3057\u3066\u307f\u305f\u306e\u3067\u3059\u304c\u3001<\/p>\n
\u78ba\u304b\u306b\u4f53\u611f\u3067\u304d\u307b\u3069\u306e\u300c\u7206\u901f\u300d\u5177\u5408\u3067 \u3001<% extend ‘\u30d5\u30a1\u30a4\u30eb\u540d’ %>\u3067\u3001\u30b5\u30af\u3063\u3068extend\u3082\u53ef\u80fd\u3060\u3057\u3001\u3068\u3066\u3082\u4f7f\u3044\u3084\u3059\u3044\u306e\u3067\u4f7f\u3063\u3066\u307f\u308b\u3053\u3068\u306b\u3057\u307e\u3057\u305f\u3002<\/p>\n
node.js \u5404\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8 \u30d9\u30f3\u30c1\u30de\u30fc\u30af<\/h4>\n
Jade<\/strong><\/p>\n
\"\"<\/a><\/p>\n
EJS<\/strong><\/p>\n
\"\"<\/a><\/p>\n
ECT<\/strong><\/p>\n
\"\"<\/a><\/p>\n
\u78ba\u304b\u306b\u7fa4\u3092\u629c\u3044\u3066\u7206\u901f\uff01\uff01<\/p>\n
express \u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb<\/h4>\n
\u4f55\u306f\u3068\u3082\u3042\u308c\u3001\u4f7f\u3063\u3066\u307f\u307e\u3057\u3087\u3046\u3002\u307e\u305aexpress\u3092npm\u30b3\u30de\u30f3\u30c9\u3067\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u307e\u3059\u3002<\/p>\n
\u524d\u56de\u306e<\/p>\n
\u30b5\u30fc\u30d0\u30fc\u30b5\u30a4\u30c9Javascript node.js express\u3084\u3089npm\u3084\u3089<\/a><\/h3>\n
\u306b\u3082\u8a18\u8f09\u3057\u3066\u3044\u308b\u65b9\u6cd5\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n
npm install -g express<\/pre>\n
\u3067\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3002\uff08express\u306f\u30d1\u30c3\u30b1\u30fc\u30b8\u540d\u3002express\u306e\u5834\u5408\u306a\u306e\u3067express\uff09<\/p>\n
\u30aa\u30d7\u30b7\u30e7\u30f3-g\u304c\u306a\u3044\u3068\u3001\u5b9f\u884c\u3057\u3066\u3044\u308b\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u4e0b\u306b\u201cnode_modules\u201d<\/strong>\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u3092\u4f5c\u308a\u3001\u305d\u3053\u306b\u30d1\u30c3\u30b1\u30fc\u30b8\u304c\u5165\u308a\u307e\u3059\u3002<\/p>\n
\u30aa\u30d7\u30b7\u30e7\u30f3-g\u3092\u4ed8\u3051\u308b\u3053\u3068\u306b\u3088\u3063\u3066\u3001\u4e00\u5ea6\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3067\u5168\u90e8\u306enode.js\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u3067\u4f7f\u3048\u308b\u3001\u30b0\u30ed\u30fc\u30d0\u30eb\u306a\u9818\u57df\u306b\u30e2\u30b8\u30e5\u30fc\u30eb\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u307e\u3059\u3002<\/p>\n
\u3053\u306e\u969b\u3001\u30d1\u30fc\u30df\u30c3\u30b7\u30e7\u30f3\u30a8\u30e9\u30fc\u3067\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3067\u304d\u305a\u3001\u30a8\u30e9\u30fc\u304c\u51fa\u3066\u3057\u307e\u3046\u5834\u5408\u306f\u3001sudo\u30b3\u30de\u30f3\u30c9\u3092\u5229\u7528\u3057\u3066\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u307e\u3057\u3087\u3046\u3002<\/p>\n
sudo\u00a0npm install -g express<\/pre>\n
password\u3092\u6c42\u3081\u3089\u308c\u307e\u3059\u306e\u3067\u3001PC\u306e\u30d1\u30b9\u30ef\u30fc\u30c9\u3092\u5165\u529b\u3002\u30ea\u30bf\u30fc\u30f3\u3002<\/p>\n
ect\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb<\/h4>\n
ect\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u306f\u4f8b\u306e\u5982\u304f\u3001npm\u30b3\u30de\u30f3\u30c9\u3067\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u304c\u51fa\u6765\u307e\u3059\u3002<\/p>\n
npm install ect express\u540c\u69d8\u3001\u30aa\u30d7\u30b7\u30e7\u30f3-g\u3092\u4ed8\u3051\u308c\u3070\u30b0\u30ed\u30fc\u30d0\u30eb\u9818\u57df\u306b\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3067\u304d\u307e\u3059\u3002<\/p>\n
npm install -g ect<\/pre>\n
\u307e\u305f\u3001\u30d1\u30fc\u30df\u30c3\u30b7\u30e7\u30f3\u30a8\u30e9\u30fc\u304c\u51fa\u308b\u5834\u5408\u306fsudo\u30b3\u30de\u30f3\u30c9\u3067\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u307e\u3057\u3087\u3046\u3002<\/p>\n
sudo npm install -g ect<\/pre>\n
\u30d1\u30b9\u30ef\u30fc\u30c9\u3092\u6c42\u3081\u3089\u308c\u307e\u3059\u306e\u3067\u30d1\u30b9\u30ef\u30fc\u30c9\u3092\u5165\u529b\u3057\u30ea\u30bf\u30fc\u30f3\u3002<\/p>\n
\"\"<\/p>\n
\u3053\u306e\u3088\u3046\u306a\u611f\u3058\u306b\u306a\u308c\u3070\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u5b8c\u4e86\u3002<\/p>\n
ect \u5229\u7528\u65b9\u6cd5<\/h4>\n
\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u3092\u4f5c\u6210\u3057\uff08\u4eca\u56de\u306fect-test\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u3092\u4f5c\u6210\u3057\u3066\u3044\u307e\u3059\u3002\uff09\u79fb\u52d5\u3002<\/p>\n
express\u30b3\u30de\u30f3\u30c9\u3067app –ect\u3068\u30b3\u30de\u30f3\u30c9\u3057\u3066\u307f\u305f\u3068\u3053\u308d\u3001<\/p>\n
express app --ect<\/pre>\n
\"\"<\/a><\/p>\n
\u3069\u3046\u3084\u3089\u3001\u30c7\u30d5\u30a9\u30eb\u30c8\u306eJade\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8<\/strong>\u304c\u4f5c\u6210\u3055\u308c\u305f\u3088\u3046\u3067\u3059\u3002<\/p>\n
ect\u306fejs\u306b\u8a18\u8ff0\u304c\u8fd1\u3057\u3044\u306e\u3067\u3001\u4e00\u65e6\u306f ejs\u30aa\u30d7\u30b7\u30e7\u30f3\u3067\u4f5c\u6210<\/strong>\u3057\u305f\u65b9\u304c\u3044\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n
express app --ejs<\/pre>\n
\"\"<\/a><\/p>\n
\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3092\u751f\u6210\u3057\u3001\u300cpackage.json\u300d\u3092\u7de8\u96c6\u3002<\/p>\n
package.json<\/strong><\/p>\n
{\r\n    \"name\": \"application-name\",\r\n    \"version\": \"0.0.1\",\r\n    \"private\": true,\r\n    \"scripts\": {\r\n        \"start\": \"node app.js\"\r\n    },\r\n    \"dependencies\": {\r\n        \"express\": \"3.5.0\",\r\n        \"ect\": \"*\"\r\n    }\r\n}\r\n<\/pre>\n
\u306b\u5909\u66f4\u3057\u307e\u3057\u305f\u3002<\/p>\n
\u3053\u306e\u72b6\u614b\u3067\u3001<\/p>\n
npm install<\/pre>\n
\u3092\u884c\u3046\u3068\u3001express\u3001ect\u304c\u542b\u307e\u308c\u305f\u300cnode_modules\u300d\u30c7\u30a3\u30ec\u30af\u30c8\u30ea<\/strong>\u304c\u751f\u6210\u3055\u308c\u307e\u3059\u3002<\/p>\n
\"\"<\/a><\/p>\n
app.js<\/h5>\n
var ECT = require('ect'); \/\/ ECT \u8aad\u307f\u8fbc\u307f\r\napp.engine('ect', ECT({ watch: true, root: __dirname + '\/views', ext: '.ect' }).render);\r\napp.set('view engine', 'ect');<\/pre>\n
app.js\u3092\u7de8\u96c6\u3057\u307e\u3059\u3002<\/p>\n
\u4e0a\u8a18\u306e3\u884c\u3092\u542b\u3081\u307e\u3059\u3002app.set(‘view engine’, ‘ect’);\u306f\u3001app.set(‘view engine’, ‘ejs’);\u3092\u5909\u66f4\u3057\u307e\u3059\u3002<\/p>\n
\u3082\u308d\u3082\u308d\u542b\u3093\u3060\u8a18\u8ff0\u306f\u4ee5\u4e0b\u306e\u901a\u308a\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n
app.js<\/h5>\n
var express = require('express');\r\nvar routes = require('.\/routes');\r\nvar user = require('.\/routes\/user');\r\nvar http = require('http');\r\nvar path = require('path');\r\nvar ECT = require('ect'); \/\/ ECT \u8aad\u307f\u8fbc\u307f\r\n\r\nvar app = express();\r\n\r\n\/\/ ECT \u74b0\u5883\u8a2d\u5b9a\r\napp.engine('ect', ECT({ watch: true, root: __dirname + '\/views', ext: '.ect' }).render);\r\n\r\n\/\/ all environments\r\napp.set('port', process.env.PORT || 3000);\r\napp.set('view engine', 'ect');\r\napp.use(express.favicon());\r\napp.use(express.logger('dev'));\r\napp.use(express.json());\r\napp.use(express.urlencoded());\r\napp.use(express.methodOverride());\r\napp.use(app.router);\r\napp.use(express.static(path.join(__dirname, 'public')));\r\n\r\n\/\/ development only\r\nif ('development' == app.get('env')) {\r\n    app.use(express.errorHandler());\r\n}\r\n\r\napp.get('\/', routes.index);\r\napp.get('\/users', user.list);\r\n\r\nhttp.createServer(app).listen(app.get('port'), function(){\r\n    console.log('Express server listening on port ' + app.get('port'));\r\n});<\/pre>\n<\/p>\n
\u7d9a\u3044\u3066\u3001index.ejs\u3092\u5909\u66f4\u3057\u307e\u3059\u3002<\/p>\n
\u62e1\u5f35\u5b50\u3092ect\u306b\u5909\u66f4\u3057\u307e\u3059\u3002<\/p>\n
\"\"<\/a><\/p>\n
\u5909\u66f4\u3057\u305findex.ect\u306b\u306f ejs\u7528\u306e\u8a18\u8ff0\u304c\u3042\u308a\u307e\u3059\u306e\u3067\u3001\u5909\u66f4\u3057\u307e\u3059\u3002<\/p>\n
<%= title %><\/p>\n
\u2193<\/p>\n
<%= @title %><\/p>\n
\u3053\u306e\u3088\u3046\u306b\u3001ect\u3067\u306f\u30d1\u30e9\u30e1\u30fc\u30bf\u306b\u306f@\u3092\u4ed8\u4e0e\u3057\u307e\u3059\u3002<\/p>\n
\u307e\u305f\u3001\u300c=\u300d\u3092\u4ed8\u4e0e\u3059\u308b\u3053\u3068\u3067\u3001\u30d1\u30e9\u30e1\u30fc\u30bf\u53d7\u3051\u53d6\u308b\u4e8b\u304c\u51fa\u6765\u307e\u3059\u3002<\/p>\n
index.ect<\/h5>\n
<!DOCTYPE html>\r\n<html> \r\n<head> \r\n    <title><%= @title %><\/title>\r\n    <link rel='stylesheet' href='\/stylesheets\/style.css' \/>\r\n<\/head>\r\n<body>\r\n<h1><%= @title %><\/h1>\r\n<p>Welcome to <%= @title %><\/p>\r\n<\/body>\r\n<\/html><\/pre>\n
node app.js<\/pre>\n
\u3067\u8d77\u52d5\u3057\u3001localhost:3000\u306b\u30a2\u30af\u30bb\u30b9\u3002<\/p>\n
\u4ee5\u4e0b\u306e\u69d8\u306b\u8868\u793a\u51fa\u6765\u308c\u3070\u4e00\u65e6\u6210\u529f\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n
\"\"<\/a><\/p>\n
ect \u307e\u3068\u3081\u3001\u6d3b\u7528\u65b9\u6cd5<\/h4>\n
Output\uff1a\u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u3092\u51fa\u529b<\/h5>\n\n\n\n\n
<%- @key %><\/th>\n\u30a8\u30b9\u30b1\u30fc\u30d7\u51e6\u7406\u3092\u305b\u305a\u306b\u51fa\u529b<\/td>\n<\/tr>\n
<%= @key %><\/th>\n\u30a8\u30b9\u30b1\u30fc\u30d7\u51e6\u7406\u3092\u3057\u3066\u51fa\u529b<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
Inheritance: \u7d99\u627f<\/h5>\n
\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3092\u7d99\u627f\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n
\u5168\u4f53\u306e\u69cb\u9020\u306b\u3042\u305f\u308b\u90e8\u5206\uff08\u5171\u901a\u3067\u5229\u7528\u3059\u308b\u90e8\u5206\uff09\u3092\u89aa\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3068\u3057\u3001<\/p>\n
\u305d\u306e\u4e2d\u306e\u4e00\u90e8\u306e\u30d6\u30ed\u30c3\u30af\u90e8\u5206\u306e\u307f\u3092\u5b50\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3067\u4e0a\u66f8\u304d\u3059\u308b\u3068\u3044\u3063\u305f\u3053\u3068\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n\n\n
<% content %><\/th>\n\n
\u89aa\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u5074\u306b\u8a18\u8ff0\u3002
\u5b50\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3067\u4e0a\u66f8\u304d\u3059\u308b\u30d7\u30ec\u30fc\u30b9\u30db\u30eb\u30c0\u306b\u306a\u308b\u3002<\/p>\n<\/td>\n<\/tr>\n
<% content ‘\u30d6\u30ed\u30c3\u30af\u540d’ %><\/th>\n\n
\u30d6\u30ed\u30c3\u30af\u540d\u3092\u4ed8\u4e0e\u3059\u308b\u3053\u3068\u3067\u3001
\u5c0f\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u5074\u304b\u3089\u4efb\u610f\u306b\u547c\u3073\u51fa\u305b\u307e\u3059\u3002<\/p>\n<\/td>\n<\/tr>\n
<% extend \u2018example.ect\u2019 %><\/th>\n\u5b50\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u5074\u304b\u3089 extend \u3067 
\u7d99\u627f\u3059\u308b\u89aa\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u306e\u30d5\u30a1\u30a4\u30eb\u540d\u3092\u6307\u5b9a\u3002<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
Partials: \u5225\u30d5\u30a1\u30a4\u30eb\u3092\u8aad\u307f\u8fbc\u307f<\/h5>\n
\u5225\u30d5\u30a1\u30a4\u30eb\u3092\u8aad\u307f\u8fbc\u3080\u6642\u306f\u3001include<\/code>\u00a0\u3092\u4f7f\u3044\u307e\u3059\u3002<\/p>\n\n\n\n
<% include \u2018example.ect\u2019 %><\/th>\n\u30a4\u30f3\u30af\u30eb\u30fc\u30c9\u3057\u305f\u3044\u30d5\u30a1\u30a4\u30eb\u540d\u3092\u6307\u5b9a\u3059\u308b<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
Blocks: \u30d6\u30ed\u30c3\u30af\u306e\u4f7f\u3044\u65b9<\/span><\/h5>\n
\u7d99\u627f\u3067\u4f7f\u7528\u3057\u305f\u00a0<% content %><\/code>\u00a0\u306e\u4ed6\u306b\u3001\u4efb\u610f\u306e\u540d\u524d\u3092\u3064\u3051\u305f\u8907\u6570\u306e\u30d7\u30ec\u30fc\u30b9\u30db\u30eb\u30c0\u3092\u5229\u7528\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n\n
\n
<% content \u2018example\u2019 %><\/p>\n<\/th>\n
\u89aa\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u5074\u306b\u66f8\u304f\u3002
\u30d7\u30ec\u30fc\u30b9\u30db\u30eb\u30c0\u306b\u4efb\u610f\u306e\u540d\u524d\u3092\u6307\u5b9a\u3059\u308b\u3002<\/td>\n<\/tr>\n
\n
<% block \u2018example\u2019 : %><\/p>\n
<% end %><\/p>\n<\/th>\n
\u5b50\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u5074\u306b\u66f8\u304f\u3002
\u89aa\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u306e\u30d7\u30ec\u30fc\u30b9\u30db\u30eb\u30c0\u540d\u3092\u6307\u5b9a\u3059\u308b\u3002<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
Conditions: \u6761\u4ef6\u5206\u5c90<\/h5>\n
CoffeeScript \u306e\u30b7\u30f3\u30bf\u30c3\u30af\u30b9\u3068\u540c\u69d8\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n
CoffeeScript<\/a><\/p>\n\n\n\n
\n
<% \u6761\u4ef6\u6587: %><\/p>\n
<% else: %><\/p>\n
<% end %><\/p>\n<\/th>\n
\u6761\u4ef6\u6587\u3084 else \u306e\u5f8c\u306e\u00a0: \u3092\u4ed8\u4e0e\u3002
if\u6587\u7d42\u4e86\u7b87\u6240\u306b\u00a0<% end %><\/code>\u00a0\u3092\u4ed8\u4e0e\u3002<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
\u30b5\u30f3\u30d7\u30eb\u4f8b<\/h4>\n
extend\u3092\u7528\u3044\u305f\u7d99\u627f\u4f8b\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n
\u4f8b\uff1a<\/p>\n
layout.ect<\/strong><\/p>\n
<!DOCTYPE html>\r\n<html lang="ja">\r\n<head><meta charset="UTF-8">\r\n    <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">\r\n    <title><%= @title %><\/title>\r\n    <link rel="stylesheet" href="\/css\/style.css"\/>\r\n    <% content 'scripts' %>\r\n<\/head>\r\n<body>\r\n<header><\/header>\r\n<% content %>\r\n<footer><\/footer>\r\n<\/body>\r\n<\/html><\/pre>\n
\u5171\u901a\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8 layout.ect \u3092\u4f5c\u6210\u3002<\/p>\n
extend\u3067\u547c\u3073\u51fa\u3057\u3001\u5404\u30da\u30fc\u30b8\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u306f\u00a0\uff1c% content %\uff1e\u306b\u633f\u5165\u3055\u308c\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n
\uff1c% content ‘scripts’%\uff1e\u3068\u4efb\u610f\u306e\u30d6\u30ed\u30c3\u30af\u540d\u3092\u4ed8\u4e0e\u3059\u308b\u3053\u3068\u3067\u3067\u4efb\u610f\u306b\u547c\u3073\u51fa\u3059\u4e8b\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n
index.ect<\/strong><\/p>\n
<% extend 'layout.ect' %>\r\n<section>\r\n    <h1><%= @title %><\/h1>\r\n    <p>Hello!<\/p>\r\n<\/section><\/pre>\n
\uff1c\uff05 extend ‘layout.ect’ \uff05\uff1e\u3067\u5148\u7a0b\u4f5c\u6210\u3057\u305f\u3001layout.ect\u3092\u547c\u3073\u51fa\u3057\u305d\u306e\u5f8c\u306e\u8a18\u8ff0\u306f<\/p>\n
\uff1c% content\u00a0%\uff1e\u306b\u51fa\u529b\u3055\u308c\u307e\u3059\u3002<\/p>\n
page.ect<\/strong><\/p>\n
<% extend 'layout.ect' %>\r\n<% block 'scripts' : %>\r\n<script type="text\/javascript">\r\n    var params = { title: '<%= @title %>' };\r\n<\/script>\r\n<script src="..\/js\/page.js" type="text\/javascript"><\/script>\r\n<% end %>\r\n<section><\/section><\/pre>\n<\/p>\n
\u5404\u30da\u30fc\u30b8\u3067\u3001\u3053\u306e\u30da\u30fc\u30b8\u3060\u3051\u306fscript\u3092\u5909\u3048\u305f\u3044\u3001\u56fa\u6709\u306escript\u3092\u8aad\u307f\u8fbc\u307f\u305f\u3044\u3068\u8a00\u3063\u305f\u3068\u304d\u306f<\/p>\n
\u5148\u307b\u3069\u4f5c\u6210\u3057\u305f\uff1c% content ‘scripts’%\uff1e\u3092\u3000<% block ‘scripts’ : %>\u3067\u547c\u3073\u51fa\u3057<\/p>\n
\u5909\u66f4\u3059\u308b\u3053\u3068\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n
\uff1c% content ‘scripts’%\uff1e<\/p>\n
<% block ‘scripts’ : %><\/p>\n
<% end %><\/p>\n
if\u30fbfor\u6587\u4f8b<\/h5>\n
if\u6587\u3001for\u6587\u3092\u7528\u3044\u305f\u4f8b\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n
\u4f8b\uff1a<\/p>\n
routes\/index.js<\/strong><\/p>\n
exports.index = function(req, res){ res.render('index', { \r\n    title: 'Express',\r\n    links: [ \r\n      { name : 'Google', url : 'http:\/\/google.com\/' },\r\n      { name : 'Facebook', url : 'http:\/\/facebook.com\/' },\r\n      { name : 'Twitter', url : 'http:\/\/twitter.com\/' } \r\n      ] \r\n  });\r\n};<\/pre>\n<\/p>\n
routes\/index.js\u306b\u30ea\u30f3\u30af\u306e\u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u3092\u4f5c\u6210\u3002<\/p>\n
index.ect<\/strong><\/p>\n
<% linkHelper = (link) -> %>\r\n  <li><a href="<%- link.url %>"><%- link.name %><\/a><\/li>\r\n<% end %>\r\n<% if @links?.length : %> \r\n  <ul> \r\n      <% for link in @links : %>\r\n      <%- linkHelper link %>\r\n      <% end %>\r\n  <\/ul> <% else : %>\r\n  <p>List is empty<\/p>\r\n<% end %><\/pre>\n<\/p>\n
\u4e0a\u8a18\u306e\u8a18\u8ff0\u3067\u547c\u3073\u51fa\u3059\u4e8b\u304c\u53ef\u80fd\u3068\u306a\u3063\u3066\u304a\u308a\u307e\u3059\u3002<\/p>\n
\u51fa\u529b<\/strong><\/p>\n
\"\"<\/a><\/p>\n
\u7d30\u304b\u304f\u898b\u3066\u3044\u304d\u307e\u3057\u3087\u3046\u3002<\/p>\n
<% linkHelper = (link) -> %>\r\n    <li><a href=\u201d<%- link.url %>\u201d><%- link.name %><\/a><\/li>\r\n<% end %><\/pre>\n
\u4e0a\u8a18\u306e\u90e8\u5206\u3067 \u51fa\u529b\u3059\u308b\u5185\u5bb9\u306e\u5b9a\u7fa9\u3092\u884c\u306a\u3063\u3066\u304a\u308a\u307e\u3059\u3002<\/p>\n
<% if @links?.length : %><\/pre>\n
\u00a0links\u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u304c\u5b58\u5728\u3059\u308c\u3070\u4ee5\u4e0b\u306efor\u6587\u3092\u5b9f\u884c\u3002<\/p>\n
<% for link in @links : %> <%- linkHelper link %> <% end %><\/pre>\n
\u5909\u6570link \u306b@links\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u4ee3\u5165\u3002<\/p>\n
<%- linkHelper link %><\/pre>\n
\u4e0a\u8a18\u3067\u5b9a\u7fa9\u3057\u305f\u51fa\u529b\u3059\u308b\u5185\u5bb9\u306b\u305d\u308c\u305e\u308c\u4ee3\u5165\u3055\u308c\u51fa\u529b\u3057\u307e\u3059\u3002<\/p>\n
\u6700\u5f8c\u306b…<\/h4>\n
\u3068\u3044\u3063\u305f\u611f\u3058\u3067\u3001\u7206\u901f\u3067\u975e\u5e38\u306b\u4f7f\u3044\u3084\u3059\u3044\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30a8\u30f3\u30b8\u30f3\u3068\u306a\u3063\u3066\u304a\u308a\u307e\u3059\u3002<\/p>\n
\u6b21\u56de\u306f\u5b9f\u969b\u306b\u5229\u7528\u3057\u305f node \u00a0webApp\u3092\u7d39\u4ecb\u3055\u305b\u3066\u9802\u304d\u307e\u3059\u3002<\/p>\n
\u3067\u306f\u3067\u306f\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"
node.js\u3067webApp\u3092\u4f5c\u6210\u3059\u308b\u969b\u3001Express\u3092\u7528\u3044\u305f\u69d8\u3005\u306a\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30a8\u30f3\u30b8\u30f3\u304c\u5b58\u5728\u3057\u307e\u3059\u3002 \u6709\u540d\u3068\u3053\u308d\u3067\u3001\u300cEJS\u300d\u3084\u300cjade\u300d\u7b49\u3005\u3068\u3042\u308b\u306e\u3067\u3059\u304c\u3001\u305d\u306e\u4e2d\u3067\u3082\u7fa4\u3092\u629c\u3044\u3066\u7206\u901f\u3068\u3044\u308f\u308c\u3066\u3044\u308b\uff08\u3046\u305f\u3063\u3066\u3044\u308b\uff09\u30c6 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12],"tags":[47,160,39,178,78,114,118],"class_list":["post-5173","post","type-post","status-publish","format-standard","hentry","category-javascript","tag-javascript-2","tag-node-js","tag-39","tag-178","tag-78","tag-114","tag-118"],"_links":{"self":[{"href":"https:\/\/www.webcyou.com\/index.php?rest_route=\/wp\/v2\/posts\/5173","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.webcyou.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.webcyou.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.webcyou.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.webcyou.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5173"}],"version-history":[{"count":12,"href":"https:\/\/www.webcyou.com\/index.php?rest_route=\/wp\/v2\/posts\/5173\/revisions"}],"predecessor-version":[{"id":5196,"href":"https:\/\/www.webcyou.com\/index.php?rest_route=\/wp\/v2\/posts\/5173\/revisions\/5196"}],"wp:attachment":[{"href":"https:\/\/www.webcyou.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5173"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webcyou.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=5173"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webcyou.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=5173"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}