更新记录
1.0.4(2022-12-04)
1.重构,并更换技术实现。
2.导入或者下载后可以用 VSCode 打开并安装依赖。
1.0.3(2022-03-27)
1.更新视频教程
2.优化前端页面
1.0.2(2022-03-26)
1.更新
查看更多平台兼容性
Vue2 | Vue3 |
---|---|
× | × |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 3.3.10 | × | × | × | × | × | × |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 |
---|---|---|---|
× | × | × | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | √ | √ | √ | √ | √ |
签到前端
基于 React、TypeScript, 使用 Material UI 组件库构建。
注意:本页面只针对此前端项目进行介绍,后端使用 Docker 配置见下。
描述
流程:导入项目 -> 安装依赖 -> 构建项目 -> 部署
命令描述:
yarn install
,安装依赖,如果时间太长请尝试挂代理或使用淘宝源。yarn dev
,启动开发服务器,不要忘记把接口服务也运行起来。yarn build
,构建项目,输出到 dist 文件夹。
前端配置
src/config/api.ts
:该文件中配置 baseUrl
变量为接口地址,默认 http://127.0.0.1:5000
。若接口部署在服务器,不要忘记将接口地址改为服务器IP或绑定的域名。
实践
步骤:
- 在本地的项目目录下运行
yarn build
或npm run build
,将构建网页并输出到 dist 目录下。 - 将 dist 目录内的所有内容(不包括dist文件夹),在静态网站托管页面上传。
后端操作步骤
后端使用 Docker 部署。若不会 Docker 请勿使用。
-
1.在终端输入
docker run --name xxtqd -p 5000:5000 -d upman01/xxtqdrear:1.0
即可运行 Docker 容器 -
2.在浏览器输入
http://127.0.0.1:5000
即可看到信息。这个http://127.0.0.1:5000
地址就是后端的API地址
定期更新
免责声明
本项目仅作为交流学习使用,通过本项目加深网络通信、接口编写、交互设计等方面知识的理解,请勿用作商业用途,任何人或组织使用项目中代码进行的任何违法行为与本人无关。