nodejs--express开发个人博客(-)
写完了入门笔记,开始进入开发阶段吧。基于上一节的内容,现在着手开发个人博客系统。先划分一下功能吧/:首页/login:登陆/reg:注册/post:发表文章/logout:退出首先规划一下路由控制,在现在的app.js中控制路由的语句是[javascript]app.get('/', routes.index);app.get('/users', user.list);//路由控制每加一个路由控制就要接一句app.get()或者是app.post(),当路由很多时,app.js里面的代码就会很多,不便于维护和修改。所以换一种写法,在index.js里面写路由控制:[javascript] view plaincopyexports.index = function(req, res){res.render('index', { title: 'Express' });};同时把app.js里面的路由控制语句换成:routes(app);这是你现在看到的写法,咱们为了简化和便于修改,换成下面这种写法:[javascript]module.exports = function(app){app.get('/',function(req,res){});}博客系统中的index.js的雏形:[javascript]module.exports = function(app){app.get('/',function(req,res){res.render('index', { title: '主页' });});app.get('/reg',function(req,res){res.render('reg', { title: '注册' });});app.post('/reg',function(req,res){});app.get('/login',function(req,res){res.render('login', { title: '登录' });});app.post('/login',function(req,res){});app.get('/logout',function(req,res){});app.get('/post',function(req,res){res.render('post', { title: '发表' });});app.post('/post',function(req,res){});};你会发现reg、login和post都有get和post方法,我们可以这么理解:get方法是实现当用户试图访问这个网页时要显示些什么,post方 法是当从这个网页上发出数据(这里时提交表单)时要干些什么,所以访问/和/logout就不需要post方法了。render函数的意思是,当你要访问 比如主页时,服务器找到index.ejs文件并替换变量title的值为字符串’主页’路由控制的雏形出来了,下面写视图部分,在views下面新建几个文件,index.ejs、login.ejs、reg.ejs、post.ejs,然后再给每个页面添加统一的头部导航(header.ejs)和底部说明(footer.ejs),使用的时候把<% -include header%>和<% -include footer%>分别放在头尾就行了。header.ejs[html]<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Blog</title><link rel="stylesheet" href="stylesheets/style.css"></head><body><header><h1><%= title %></h1></header><nav><span><a title="主页" href="/">主页</a></span><span><a title="登录" href="/login">登录</a></span><span><a title="注册" href="/reg">注册</a></span></nav><article>footer.ejs</article></body></html>index.ejs[html]<%- include header %>这是主页<%- include footer %>login.ejs[html]<%- include header %><form method="post" name="form" id="form"><table><tbody><tr><td><label for="username">用户名:</label></td><td><input type="text" id="username" name="username" placeholder="请输入用户名"/></td></tr><tr><td><label for="password">密码:</label></td><td><input type="password" id="password" name="password" placeholder="请输入密码"/></td></tr><tr><td colspan="2" class="btn" ><input type="submit" value="登录"/></td></tr></tbody></table></form><%- include footer %>reg.ejs[html]<%- include header %><form method="post" name="form" id="form"><table><tbody><tr><td><label for="username">用户名:</label></td><td><input type="text" id="username" name="username" placeholder="请输入用户名"/></td></tr><tr><td><label for="password">密码:</label></td><td><input type="password" id="password" name="password" placeholder="请输入密码"/></td></tr><tr><td><label for="comfirm_pwd">再次输入密码:</label></td><td><input type="password" id="comfirm_pwd" name="comfirm_pwd" placeholder="请再次输入密码"/></td> &补充:web前端 , JavaScript ,
上一个:dojo 柱状图
下一个:Js脚本实现选项卡的实例
- 更多JS疑问解答:
- 几个验证11位手机号码格式的js代码
- js把图片转换成 base64代码
- js把base代码转换成图片
- JS 将 base64编码的图片转化为图片文件
- js中的定时器
- js如何获得FCKeditor控件的值
- 用js限制投票的cookie .目前设置的为:<input type="" class="" onclick="'window.location...
- JS验证,这块“牛皮”反复修改都不能实现
- 在JS中使用DOM模型
- 如何用JS 获取本地文件夹的文件列表
- js中new 了两个Object数组。怎么样将数组内容合并,重复的内容?
- 求实现自动生成图片缩略图的JS代码
- JS脚本网页问题
- js,代码中"object"和"Object"区别?
- js+flash实现网页图片切换效果,出现边框,单击激活此控件。