用若依(RuoYi)在摸鱼时间做了一款小程序

881 阅读2分钟

为什么做这款小程序?

一直想学习一下做小程序,刚好前段时间领证了要发朋友圈,搜索了一下九宫格配图文案的时候,发现了一款小程序感觉挺有意思的,就借鉴了一下它的UI设计,不断踩坑向公司的后台请教学习,完成了下面这个还算满意的小程序

下载.png

技术栈?

小程序:Tdesign

后端:RuoYi+MySQL+Nginx

因为本身是做Android原生开发的,所以对CSS了解的不够,想省事儿且发现Tdesign里面的自定义Tabbar有个悬浮效果,果断选择了使用Tdesign来开发小程序。

最终小程序效果图:
微信图片_20230629105606.jpg 微信图片_20230629105610.jpg 微信图片_20230629105558.jpg

请教我们后台的朋友用什么技术来搭建后台,为小程序提供API,他推荐我试试用RuoYi来搭建自己的管理后台,所以我听劝了。

后台搭建

  1. 先去Gitee上下载了RuoYi:gitee.com/y_project/R…
  2. 然后根据文档让项目先Run起来
  3. 接下来就是创建一个子模块(因为我想以后要是还开发小程序或APP也可以用这个来提供API)
  4. 使用里面的代码生成功能,完善接口及管理后台的代码编写
  5. 打包项目,部署到云服务器
子模块搭建过程

新建module

项目根目录下选择 New -> Module 1688008569486.png

image.png

继承groupID,填写artifactID

image.png

填写Module名,点击 Finish

image.png

以上创建目录完成 下面这个是我创建的子模块

image.png

在新建子模块的 pom.xml 中引入若依的通用工具方便后面的开发

image.png
<!-- 通用工具-->
<dependency>
    <groupId>com.ruoyi</groupId>
    <artifactId>ruoyi-common</artifactId>
</dependency>

修改 ruoyi-admin module下的配置

image.png

参考文档,使用代码生成功能便捷开发 后台手册 | RuoYi

最终后端管理效果

image.png

image.png

开发中其实遇到了好多问题,什么Nginx配置Https,什么域名解析,什么Https证书,最终还是靠百度,靠向别人请教也算是一一解决了,还是一次不错的体验!!!

不会写文章,反正最后!!!最后的最后!!!求个识别访问吧!!!!毕竟都放了这么大张图片了

下载.png