不起眼小系统发布到serverless"/>
不起眼小系统发布到serverless
一个不起眼的小系统
在参加阿里云的serverless活动中,我学会了在线上部署springboot的项目,所以自己做了一个不起眼的小系统,虽然不实用,但是主要技术还是用到了一些,为了方便尝试在阿里云上部署项目。
项目简介
一个随便写的小系统,没有固定作用,功能主要有登录注册,商品管理,echart视图,用户管理等。所用到的技术有springboot,mybatis plus,layui,echarts等,用户管理模块功能比较齐全,增删改查 都已经具备了,不足之处是由于时间太紧,商品管理之做了查询,而且登录认证shiro框架还没咋学,没能做到权限管理。
项目部署
-
首先登陆阿里云开发平台
选择创建新应用,并填写以下信息
此图是应用架构图
- 先复制代码仓库
- 创建新应用完成后进行创建应用搬站。将刚才复制的代码仓库填写在下面
应用搬站创建完成后将本地写的代码打包上传到创建的应用搬站,上传完成后注意根据提示修改pom.xml
项目目录如下图
修改完pom.xml后使用mvn sprong-boot:run 命令进行测试
项目截图
部署成功后,代码平稳运行ing。。。。。
登录界面展示
这个功能接口没有去实现,将来可以学了shiro进行权限 管理,所以目前就是随便输都能登录。。。
注册界面展示
注册还是能注册的,写了一个表单,用ajax传递到后端调方法名称就行了
$.ajax({//几个参数需要注意一下type: "get",//方法类型url: "/user/insert",//urldata: $('#abc').serialize(),success: function (data) {// window.location.reload();alert("注册成功!")}, error: function (error) {alert("失败")}
});
长这样。。。
后端页面展示
这里用到了layui的一个模板,左侧和上侧是导航栏,里面的按钮绑定了触发事件,右边区域写个iframe,动态更换里面的地址路径,就可以不用跳转页面的情况下把多个页面显示在一个框架里。
<!--绑定触发事件-->
<dd><a href="javascript:;" onclick="change('bar')">柱状图</a></dd>
然后在js里写方法。。。。
<script>function change(title){
$('iframe').attr('src',title+".html");}
</script>
右面的显示区代码
<iframe src="table.html" frameborder="0" id="demoAdmin" style="width: 100%; height: 1000px;"></iframe>
显示效果就这样。。。。
视图工具
用的echarts组件,也放在了一个单独的页面里。看官方文档就能会用,一般来说需要查询数据库,传递过来参数后,报表自动生成的,对数据传输格式有一定要求,主要的任务就是自定义SQL(我用的是mybatis plus,底层固定的sql语句可以不写,但是多表关联,自定义SQL要写),将传输数据从映射表的实体类类型转化为echarts需要的自定义的vo类型 。
)]
这个功能做的不太细致,主要是有那个神似的味道。。。就行了吧?
用户管理
最后说一个做的比较全的 ,用户管理。增删改查功能全部实现。
内容主体为表格 ,但是这些功能都是绑定在按钮上的,按钮是通过 监听工具条,工具栏,进而绑定js方法触发的,js学好了,ajax学好了这些功能不成问题,而对我来说比较耗精力的是layui的弹出层layer,就是点了添加按钮会弹出一个表单让填。看 官方文档迷迷糊糊的,视频找不到,最后是在Gitee上找了份别人做的系统看源码,才学会了。
git万岁
后端也是用的springboot,对比ssm优点就是不用配置很多东西。另外mybatis plus更加省事,有逆向代码生成器,虽然我没有用 ,但是仍旧有单表各种写好的增删改查功能,代码开发 省了好多的事。
更多推荐
不起眼小系统发布到serverless
发布评论