[Node.js] Node.js はじめました。 #Node.js

Node.jsをはじめたので、その記録です。

インストール

割愛

ejsのインストール

$ npm install ejs

テンプレートの準備

common_begin_html.ejs

<!doctype html><html lang="ja"><head>

common_html_meta.ejs

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title><%=title %></title>

common_include_css.ejs

<!-- Bootstrap -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/<%=BOOTSTRAP %>/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/<%=BOOTSTRAP %>/css/bootstrap-theme.min.css">

common_begin_body.ejs

</head><body>

container.ejs

<div class="container"><h1><%=greeting %></h1></div>

common_include_js.ejs

<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/<%=JQUERY %>/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/<%=BOOTSTRAP %>/js/bootstrap.min.js"></script>

index.ejs

<%-common_begin_html %>
<%-common_html_meta %>
<%-common_include_css %>
<%-common_begin_body %>
<%-container %>
<%-common_include_js %>

app.js

app.coffee

http = require "http"
fs   = require "fs"
ejs  = require "ejs"


#IncomingMessage request
#ServerResponse response
http.createServer (req, res) ->

  # index.ejs は別途コンパイルする
  template = [
    "common_begin_html"
    "common_html_meta"
    "common_include_css"
    "common_begin_body"
    "container"
    "common_include_js"
  ]

  _params =
    JQUERY:    "2.1.0"
    BOOTSTRAP: "3.3.1"
    title:     "ejs test"
    greeting:  "これはejsのtestです。"

  compile = {}
  for f in template
    _tmp = fs.readFileSync __dirname + "/" + f + ".ejs", "utf8"
    compile[f] = ejs.render _tmp, _params

  index = fs.readFileSync __dirname + "/" + "index.ejs", "utf8"
  data  = ejs.render index, compile

  # charset=utf-8 を指定するとfirebug等で文字化けしない。
  res.writeHead 200, "Content-Type":"text/html; charset=utf-8"
  res.write data
  res.end()

.listen 80, "127.0.0.1"

console.log "Server running!!"

実行

$ node app.js
$ curl http://localhost/

<!doctype html><html lang="ja"><head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>ejs test</title>
<!-- Bootstrap -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
</head><body>
<div class="container"><h1>これはejsのtestです。</h1></div>
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>

今後の方針

MongoDBとの連携
MySQLとの連携
Expressの導入
Backbone.jsとSocket.IOをつかってなんかつくる