基于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的更多相关文章

  1. 【原】无脑操作:IDEA + maven + Shiro + SpringBoot + JPA + Thymeleaf实现基础认证权限

    开发环境搭建参见<[原]无脑操作:IDEA + maven + SpringBoot + JPA + Thymeleaf实现CRUD及分页> 需求: ① 除了登录页面,在地址栏直接访问其他 ...

  2. 【原】无脑操作:IDEA + maven + Shiro + SpringBoot + JPA + Thymeleaf实现基础授权权限

    上一篇<[原]无脑操作:IDEA + maven + Shiro + SpringBoot + JPA + Thymeleaf实现基础认证权限>介绍了实现Shiro的基础认证.本篇谈谈实现 ...

  3. 【原】无脑操作:EasyUI Tree实现左键只选择叶子节点、右键浮动菜单实现增删改

    Easyui中的Tree组件使用频率颇高,经常遇到的需求如下: 1.在树形结构上,只有叶子节点才能被选中,其他节点不能被选中: 2.在叶子节点上右键出现浮动菜单实现新增.删除.修改操作: 3.在非叶子 ...

  4. 【原】无脑操作:eclipse + maven搭建SSM框架

    网上看到一些Spring + Spring MVC + MyBatis框架的搭建教程,不是很详细或是时间久远了,自己动手整一个简单无脑的! 0.系统环境 1)Windows 10 企业版 2)JDK ...

  5. 【原】无脑操作:ElasticSearch学习笔记(01)

    开篇来自于经典的“保安的哲学三问”(你是谁,在哪儿,要干嘛) 问题一.ElasticSearch是什么?有什么用处? 答:截至2018年12月28日,从ElasticSearch官网(https:// ...

  6. 【原】无脑操作:Windows 10 + MySQL 5.5 安装使用及免安装使用

    本文介绍Windows 10环境下, MySQL 5.5的安装使用及免安装使用 资源下载: MySQL安装文件:http://download.csdn.net/detail/lf19820717/9 ...

  7. 【原】无脑操作:IDEA + maven + SpringBoot + JPA + Thymeleaf实现CRUD及分页

    一.开发环境: 1.windows 7 企业版 2.IDEA 14 3.JDK 1.8 4.Maven 3.5.2 5.MariaDB 6.SQLYog 二.Maven设置: Maven目录下的con ...

  8. 【原】无脑操作:IDEA + maven + SpringBoot + JPA + EasyUI实现CRUD及分页

    背景:上一篇文章的界面太丑.没有条件查询功能.所以做一些改进,整合EasyUI做实现.(仅以此文纪念表格中出现的这些朋友工作六周年,祭奠一下逝去的青春^_^) 一.开发环境(参照上一篇文章) 补充:E ...

  9. MySQL轻量版使用,无需安装,无脑操作

    不知道是否有想我一样的,开始用的都是安装版的,特别费事,卸载后注册表很难删除 下面介绍一下MySQL轻量级的如下 首先打开一个网址:www.oracle.com没错就是强大的Oracle官网 也可以直 ...

随机推荐

  1. ABP入门系列(1)——学习Abp框架之实操演练

    作为.Net工地搬砖长工一名,一直致力于挖坑(Bug)填坑(Debug),但技术却不见长进.也曾热情于新技术的学习,憧憬过成为技术大拿.从前端到后端,从bootstrap到javascript,从py ...

  2. Asp.net Boilerplate之AbpSession扩展

    当前Abp版本1.2,项目类型为MVC5. 以属性的形式扩展AbpSession,并在"记住我"后,下次自动登录也能获取到扩展属性的值,版权归"角落的白板报"所 ...

  3. 一个粗心的Bug,JSON格式不规范导致AJAX错误

    一.事件回放  今天工作时碰到了一个奇怪的问题,这个问题很早很早以前也碰到过,不过没想到过这么久了竟然又栽在这里. 当时正在联调一个项目,由于后端没有提供数据接口,于是我直接本地建立了一个 json ...

  4. C语言 · 阶乘计算 · 基础练习

    问题描述 输入一个正整数n,输出n!的值. 其中n!=1*2*3*-*n. 算法描述 n!可能很大,而计算机能表示的整数范围有限,需要使用高精度计算的方法.使用一个数组A来表示一个大整数a,A[0]表 ...

  5. React在开发中的常用结构以及功能详解

    一.React什么算法,什么虚拟DOM,什么核心内容网上一大堆,请自行google. 但是能把算法说清楚,虚拟DOM说清楚的聊聊无几.对开发又没卵用,还不如来点干货看看咋用. 二.结构如下: impo ...

  6. ASP.NET MVC5+EF6+EasyUI 后台管理系统(73)-微信公众平台开发-消息管理

    系列目录 前言 回顾上一节,我们熟悉的了解了消息的请求和响应,这一节我们来建立数据库的表,表的设计蛮复杂 你也可以按自己所分析的情形结构来建表 必须非常熟悉表的结果才能运用这张表,这表表的情形涵盖比较 ...

  7. AI人工智能系列随笔:syntaxnet 初探(1)

    人工智能是 最近的一个比较火的名词,相信大家对于阿尔法狗都不陌生吧?其实我对人工智能以前也是非常抵触的,因为我认为机器人会取代人类,成为地球乃至宇宙的霸主,但是人工智能带给我的这种冲击,我个人感觉是欲 ...

  8. Java中用得比较顺手的事件监听

    第一次听说监听是三年前,做一个webGIS的项目,当时对Listener的印象就是个"监视器",监视着界面的一举一动,一有动静就触发对应的响应. 一.概述 通过对界面的某一或某些操 ...

  9. 集合(set)-Python3

    set 的 remove() 和 discard()  方法介绍. 函数/方法名   等价操作符 说明 所有集合类型 len(s)   集合基数:集合s中元素个数 set([obj])   可变集合工 ...

  10. Android Studio快捷键

      一.android studio 默认快捷键 刚开始接触一款开发软件,想必很想了解它的快捷方式,这会对你的编程起到很好的帮助,提高工作效率,接下来给你介绍下Android Studio一些常用的快 ...