使用bootstrap+express-art-template实现一个简单的留言板
结果展示： 项目结构： 404.html页面：
<!DOCTYPE html>
<html lang="ch">
<head>
<meta charset="UTF-8">
<title>留言本</title>
</head>
<body>
<h1>404 not found</h1>
</body>
</html>
index.html页面：
<!DOCTYPE html>
<html lang="ch">
<head>
<meta charset="UTF-8">
<title>留言本</title>
<link rel="stylesheet" href="/public/css/bootstrap.css">
</head>
<body>
<div class="header container">
<div class="page-header">
<h1>留言板</h1>
<a class="btn btn-success" href="/post">发表留言</a>
</div>
</div>
<div class="comments container">
<ul class="list-group">
{
{each comments}}
<li class="list-group-item">{
{ $value.name }}留言了：{
{ $value.message }}
<span class="pull-right">{
{ $value.dateTime }}</span>
</li>
{
{/each}}
</ul>
</div>
</body>
</html>
post.html页面：
<!DOCTYPE html>
<html lang="ch">
<head>
<meta charset="UTF-8">
<title>留言本</title>
<link rel="stylesheet" href="/public/css/bootstrap.css">
</head>
<body>
<div class="header container">
<div class="page-header">
<h1><a href="/">首页</a> <small>发表评论</small></h1>
</div>
</div>
<div class="comments container">
<form action="/post" method="post">
<div class="form-group">
<label for="input_name">您的名字</label>
<input type="text" class="form-control" required minlength="2" maxlength="10" id="input_name"
name="name" placeholder="请写入你的姓名" autocomplete="off">
</div>
<div class="form-group">
<label for="textarea_message">留言内容</label>
<textarea class="form-control" name="message" id="textarea_message" cols="30" rows="10" required
minlength="5" maxlength="20" placeholder="请在这里输入您的评论"></textarea>
</div>
<button type="submit" class="btn btn-default">发表</button>
</form>
</div>
</body>
</html>
app.js页面：
创建项目的时候，你先找一个目录：npm init下，生成一个package.json文件，这样你下载的什么包，什么版本的都一目了然。 比如我的这个：
用淘宝的镜像快一点~
npm install cnpm -g --registry=https://registry.npm.taobao.org