node.jsの学習（ドットインストール）（#11~#13)

node.jsの学習（ドットインストール）（#11~#13)

 
node.jsを使用して掲示板（BBS)を作成するレッスンでした。
最後スッキリしませんでしたが
学習した経験をシェアさせていただきます。
 
既にあるソースに以下の色文字部分を追加するだけ
掲示板て以外と簡単に作れるんですね...
 
 

★掲示版の作成

 
#public_html/bbs.ejs
 
<!doctype html>
<html lang ="ja">
 
<head>
    <title>BBS</title>
    <meta charset="utf-8">
</head>
<body>
    <form method ="post">
    <input type="text" name="name">
    <input type="submit" value="Post!">
    <ul>
        <% for (var i=0; i< posts.length; i++ ) {%>
        <li><%= posts[i] %></li>
        <% } %>
    </ul>
</body>
 
htmlworld_next.js
 
var http=require('http');
    fs = require('fs');
    ejs = require('ejs');
    qs = require('querystring'); 
var settings = require('./settings.js');
var server = http.createServer();
 
var template = fs.readFileSync(__dirname + '/public_html/bbs.ejs' ,'utf-8');
var posts = [];
 
function renderForm(posts, res){
    var data = ejs.render(template,{
        posts: posts
 
    });
    res.writeHead(200,{'Content-Type': 'text/html'});
    res.write(data);
    res.end();
 
}
 
server.on('request',function(req,res){
    if(req.method == 'POST'){
        req.data = "";
        req.on("readable", function(){
            req.data += req.read();
        })
        req.on("end",function(){
            var query = qs.parse(req.data);
            posts.push(query.name);
            renderForm(posts, res);
        })
    }else{
        renderForm(posts, res);
    }    
 
});
server.listen(settings.port, settings.host);
console.log("server listening ...");
 
 

※結果

 
サーバ稼働後にブラウザで表示。
投稿した内容はPost！する度に、リスト構造で追加されました(test,next,why)
 
が、なぜかnullが後ろに必ず表示される...
なぜ？（使用しているブラウザはGoogleChrome..)
 
スッキリしませんが、後で調べるとして今日はここまで。