vivian blog

todoApp

todoApp思路

这个App使用了MVC的设计思想,现在具体说一下三个层的具体实现方式。

  • view层

    • 使用了ejs动态模板,可以将后台传来的数据动态地写入html文件,而无须使用js来获取选择器,从而填充,但是本app每次请求成功后,都需要重绘整个页面,这是硬伤,学术解释为

      界面设计人员进行图形界面设计。

  • controller层

    • controller主要功能是进行路由选择,向服务器发出请求之后,给客户端的响应,突然感觉这样功能没有分的很明晰,因为我们使用了express模块,所以不需要额外设置一个server模块和一个route模块。一言以蔽之

      负责转发请求,对请求进行处理

  • Model层

    • 应用的业务逻辑层,主要负责功能的实现,但是此处的功能主要是添加和删除,而恰好http方法中有delete和post方法,可以直接使用,所以这里的app就没有特地设立一个model层。学术解释为

      程序员编写程序应有的功能(实现算法等等)、数据库专家进行数据管理和数据库设计(可以实现具体的功能)。

以及模块的导出和导入方式,注意模块不需要将整个文件都设为一个模块(因为模块是一个封装所需功能的能访问并记住其所在词法作用域的代码片段)

app具体实现

controller

controller层的主要难点是连接数据库,在mlab中新建完数据库之后,要再新建一个账户和密码,来连接云mongodb。

1
2
3
4
5
6
7
8
9
10
//text是账户名,第二个text则是密码
mongoose.connect('mongodb://text:text@ds147681.mlab.com:47681/todolist');
//create a Schema,tell the db what properties it should contain
var todoSchema = new mongoose.Schema({
item: String
});
//what schema was base in the model
var Todo = mongoose.model('Todo',todoSchema);

然后连接完数据库便就可以对请求进行处理了,主要是向数据库发出查找请求,并执行相对的操作(删除/新增)

view层

使用ejs模板,ejs语法<% %>即可嵌入js语法,其和java开发中jsp语法是差不多的,现在想来我公司的代码很多时候都是重绘整个子页面的,感觉性能上就做得不是那么到位