首页 > 数据库技术 > 详细

【原】无脑操作:express + MySQL 实现CRUD

时间:2016-12-30 16:49:19      阅读:301      评论:0      收藏:0      [点我收藏+]

基于node.js的web开发框架express简单方便,很多项目中都在使用。这里结合MySQL数据库,实现最简单的CRUD操作。

技术分享

开发环境:

IDE:WebStorm

DB:MySQL

-------------------------------------------------------------------------------------------

1、使用WebStorm创建node.js express应用程序,express框架可以根据使用者的爱好设置页面引擎,默认为jade,我比较喜欢ejs,这里设置时选择Template为EJS即可

这里WebStorm实际使用了express-generator这个生成器为我们生成了express应用程序

技术分享

2、创建结束时,可以看到express工程结构如图

技术分享

3、执行调试的设置(不设置也可以,只不过执行或调试时看的有些奇怪而已)

技术分享

修改一下Name的内容为工程名称

注意:express工程中的bin目录下有一个www文件,它用来设置express工程的一些配置,比如express引用程序的端口(默认:3000)等

技术分享

4、配置好后就可以执行(alt+F10)或调试(alt+F9)了

技术分享

5、试着访问一下,在浏览器的地址栏中输入localhost:3000,可以看到下图,说明express框架的应用程序已经搭建好了

技术分享

-------------------------------------------------------------------------------------------

6、express-generator生成器生成的代码中有users相关内容,我们不需要的,所以删除之。先在app.js这个文件中删除相关内容,下图中的第9行和第26行都删除掉

技术分享

7、另外,路由目录routes中的users.js文件也删除掉

技术分享

-------------------------------------------------------------------------------------------

8、接着添加MySQL数据库驱动,在package.json文件中添加"mysql" : "latest",意思是不知道mysql对应的驱动是什么版本,使用latest表示获取最新的mysql数据库驱动

技术分享

9、观察一下工程目录中的node_modules目录,现在是没有mysql驱动的

技术分享

10、在命令行窗口中当前工程路径下使用指令:npm install,这样就可以依据package.json文件中写的依赖添加mysql驱动了

技术分享

添加完毕,如下提示

技术分享

再次观察node_modules目录,这时有mysql驱动了

技术分享

-------------------------------------------------------------------------------------------

11、最终实现的效果

【客户信息列表页面】

技术分享

【客户新增页面】

技术分享

【客户修改页面】

技术分享

 【根据条件查询】

技术分享

技术分享

-------------------------------------------------------------------------------------------

12、创建数据访问层,在express工程中创建db目录,在其中创建两个文件dbconfig.js 和 customersql.js文件,dbconfig.js文件是MySQL数据库连接配置信息模块文件,customersql.js文件记录客户管理功能模块要用到的sql语句,当然都以JavaScript对象的形式,以node.js中模块的结构组织。

技术分享

对于数据库连接配置模块,还是那些连接信息:服务器名称啦、连接用户名称啦、连接用户密码啦、数据库名称啦、端口号啦

而具体业务模块的数据库操作对象模块说白了就是对SQL语句进行了JavaScript对象方式的封装,调用时获取对象的CRUD相应的属性值(也就是相应的SQL语句)

-------------------------------------------------------------------------------------------

13、路由规划

默认index.js文件如下,只有对默认路径(即http://localhost这样)形式访问的路由处理

技术分享

添加自定义的路由规划,包括路由对应的处理器函数,无非是对应页面的CRUD操作,设置get、post方式的处理器函数

技术分享

-------------------------------------------------------------------------------------------

14、最终的工程结构

技术分享

 

看到这里,是不是感觉到特别无脑操作、特别简单呀?

后续有空,再写一个更好一些的版本(涉及:分页、多表连接、Ajax等)

 

整个工程代码:https://github.com/temptation/watermalon_v1

【原】无脑操作:express + MySQL 实现CRUD

原文:http://www.cnblogs.com/iflytek/p/6237068.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!