1. 项目目录
|—app.js 入口 |—controllers |—models 存储使用mongoose设计的数据模型 |—package.json 包描述文件 |— package-lock.json 第三方包版本锁定文件 |—public 公共的静态资源 |—routes 如果业务比较多,代码量大,最好吧路由按照业务的分类存储到routes中 |—router.js 简单一点把所有的路由都放在这个文件 |— views 存储视图文件
2. 项目路由
| 路径 | 方法 | post参数 | 是否需要登录 | 备注 |
|---|---|---|---|---|
| / | GET | 渲染首页 | ||
| /register | GET | 渲染注册页面 | ||
| /register | POST | email、nickname、password | 处理注册请求 | |
| /login | GET | 渲染登录页面 | ||
| /login | GET | email、password | 处理登录页面 | |
| /logout | GET | 处理退出请求 |
3. 书写顺序
- 创建目录结构
- 整合静态页-模板页
- include
- block
- extend
- 设计用户登录、退出、注册的路由
- 用户注册
- 先处理好客户端页面的内容(表单控件的name、收集表单数据、发送请求)
- 服务端
- 获取客户端表单请求的数据
- 操作数据库
- 若有错,发送500告诉客户端服务器错了
- 其他的根据你的业务发送不同的响应数据
- 用户登录
- 用户退出
4. art-template引入模板
一般项目的头部和底部时候相同的,所以可以把页面共同的部分拿出来。父级页面中用include引入头部和底部,子级页面用extend扩展父级页面,子级页面单独的部分写在block中
- parent.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{block 'title'}}默认标题{{/block}}</title>
<link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">
{{block 'head'}}{{/block}}
</head>
<body>
{{include '../_partials/header.html'}}
{{block 'body'}}{{/block}}
{{include '../_partials/footer.html'}}
<script src="/node_modules/jquery/dist/jquery.js"></script>
<script src="/node_modules/bootstrap/dist/js/bootstrap.js"></script>
{{block 'script'}}{{/block}}
</body>
</html>
- child.html
{{extend './_layouts/home.html'}}
{{block 'body'}}
每个页面单独的部分
{{/block}}