使用Spring +Spring MVC +Mybatis 构建的简单的框架的Demo,前端界面使用vue.js+bulma,后台使用Spring MVC Restful控制器实现前后端分离。
使用webpack打包实现前端资源的部署
具体介绍页面请点击 使用Maven搭建Spring+SpringMVC+Mybatis+ehcache项目
文章可能已经过去很久了,和目前的代码稍微有点出入,主要是前端代码的变化。
- 实现Spring、SpringMVC、Mybatis三个框架的整合
- 使用ehcache缓存
- vue.js的简单使用
- Maven Profile的使用,方面环境切换
- Mybatis Generator的使用
配置好以下开发工具
JDK: 1.7
Maven:3.1.1
Tomcat:7.0.65
Mysql:5.5.20
vue.js: V1.0.26
Fork项目Clone到本地
jdbc.driverClassName=com.mysql.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3307/test
jdbc.username=root
jdbc.password=root
CREATE TABLE `user` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`user_name` varchar(40) NOT NULL,
`password` varchar(255) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;
insert into `user`(`user_name`,`password`) values ('赵宏轩','123456');
insert into `user`(`user_name`,`password`) values ('赵小轩','123456'); 点击+,选择Web-Application-Exploded然后选择from maven选中本项目
Web Application Exploded是没有压缩的war包,相当于文件夹
Web Application Achieved是压缩后的war包
依次执行maven Lifecyle的clean->compile->package命令
maven会在target目录生成war包
maven的设置选项 use Maven Output Directories 要勾选上
- 点击
Run-Run Configurations - 点击
+选择tomcat server->local - 点击
Configure配置好Tomcat的解压目录,端口号8082 - 点击
Deployment选项卡,点击+号,选择一个artifact,就是第二部的war包,Application Context 配置为HelloSSM - 点击 Tomcat的右边的
运行按钮,运行tomcat
使用Spring的RestTemplate来进行测试
直接在RestFulClientTest类上点击Junit的按钮进行接口测试
- 首先要确保你的电脑上安装了npm进入前端资源文件夹 假如现在的目录就在HelloSSM的目录下面,则需要
cd src/main/webapp/frontend进入到前端资源的文件夹下面,然后npm install安装依赖 - 然后执行命令
npm run dev前端资源就会部署起来了,运行在8080端口
在任务栏输入http://localhost:8080/,回车出现用户管理的简单页面,一个简单的SSM+vuejs 前后端分离的项目环境就搭建好了。