前言

最近接触了 midway.js ，打算结合 mysql 开发一个全栈项目，并记录下自己的学习过程。

关于技术选型

前端

基础框架：vue3 + typescript

状态管理：pinia

拖拽：vue3-dnd + react-dnd-html-backend

UI 样式：naive-ui + tailwindcss

构建工具：vite3

后端

基础框架：midwayjs + typescript

数据库：mysql8 + redis7

数据库 orm：typeorm

对象存储：腾讯云 cos

短信服务：腾讯云 sms

技术要点

前端

1. vue3、typescript、setup 语法的基本使用
2. vue-router4、pinia 的使用
3. axios + typescript 的请求封装
4. jwt、refresh token 的使用和处理
5. tailwind css 和 naive-ui 的使用，并接入暗黑模式
6. vue3-dnd 结合 react-dnd-html5-backend 进行拖拽
7. 腾讯云 cos 的使用，获取服务端下发的临时密钥并进行头像上传
8. vite 的使用，图片压缩插件的使用
9. 结合 node-ssh 和 ali-oss 编写服务器部署脚本 和 阿里云 oss 部署脚本

后端

1. midway 框架的使用
2. typeorm + mysql 的增删改查、事务的使用
3. redis 的使用，负责存储短信验证码
4. 接入 腾讯云 sms 短信服务
5. 接入 腾讯云 cos 并下发临时密钥
6. passport 的身份验证库的使用，并接入 localStorage 本地策略
7. jwt 中间件、全局请求响应中间件、全局异常处理器的编写
8. 部署至 Serverless

部署

1. 接入 gitlab ci/cd，服务器安装 gitlab runner
2. gitlab webhooks 的使用，负责从镜像仓库中拉取最新镜像
3. Dockerfile、docker-compose.yml、.gitlab-ci.yml 的编写
4. docker 的使用，nginx 的常用配置（前端视角）
5. docker compose 的使用，编排了 app(业务)、redis、mysql 三个容器
6. 创建阿里云私有镜像仓库，并进行镜像的 push 和 pull