zhaohongxuan / Hellossm

使用Spring +Spring MVC +Mybatis 构建的简单的框架的Demo，前端界面使用vue.js+bulma，后台使用Spring MVC Restful控制器实现前后端分离。 使用webpack打包实现前端资源的部署 具体介绍页面请点击 使用Maven搭建Spring+SpringMVC+Mybatis+ehcache项目 文章可能已经过去很久了，和目前的代码稍微有点出入，主要是前端代码的变化。

主要功能

1. 实现Spring、SpringMVC、Mybatis三个框架的整合
2. 使用ehcache缓存
3. vue.js的简单使用
4. Maven Profile的使用，方面环境切换
5. Mybatis Generator的使用

一、配置开发环境

配置好以下开发工具

JDK: 1.7
Maven:3.1.1
Tomcat：7.0.65
Mysql：5.5.20
vue.js: V1.0.26

Fork项目Clone到本地

二.创建数据库表

1.本地安装好mysql数据库，使用自带的test数据库，或者新建数据库

jdbc.driverClassName=com.mysql.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3307/test
jdbc.username=root
jdbc.password=root

2.在数据库中创建表

  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');  

三.添加tomcat服务器并部署war包

1.File-Project Structure点击Artifacts一栏

点击+，选择Web-Application-Exploded然后选择from maven选中本项目 Web Application Exploded是没有压缩的war包，相当于文件夹 Web Application Achieved是压缩后的war包

2.生成war包

依次执行maven Lifecyle的clean->compile->package命令 maven会在target目录生成war包

Tips：

maven的设置选项 use Maven Output Directories 要勾选上

3.配置Tomcat

1. 点击Run-Run Configurations
2. 点击+选择tomcat server->local
3. 点击Configure 配置好Tomcat的解压目录，端口号8082
4. 点击Deployment选项卡，点击+号，选择一个artifact，就是第二部的war包，Application Context 配置为HelloSSM
5. 点击 Tomcat的右边的运行按钮,运行tomcat

四.访问Rest接口

使用Spring的RestTemplate来进行测试 直接在RestFulClientTest类上点击Junit的按钮进行接口测试

五、前端

1. 首先要确保你的电脑上安装了npm进入前端资源文件夹 假如现在的目录就在HelloSSM的目录下面，则需要 cd src/main/webapp/frontend 进入到前端资源的文件夹下面，然后npm install 安装依赖
2. 然后执行命令 npm run dev 前端资源就会部署起来了，运行在8080端口

六、页面管理

在任务栏输入http://localhost:8080/,回车出现用户管理的简单页面，一个简单的SSM+vuejs 前后端分离的项目环境就搭建好了。