egg.js + react 实战：从 0 到 1 实现记账本小册学习笔记合集（持续更新中）

Posted 2022-02-13 凯小默

说明

说明：这些文章只是笔者学习记录的笔记，仅供参考，切勿商用。请支持正版的小册【Node + React 实战：从 0 到 1 实现记账本】。

该项目对我提升很大，在此非常感谢作者。

该项目涉及的技术栈：React，ZarmUI，Vite2.0，Egg.js，mysql等，想提升自己这方面能力的可以去支持正版的小册。

正版的项目地址

• 「掘掘记账本」在线预览： cost.chennick.wang，（测试账号：admin，测试密码：111111。也可以自行注册使用。）
• 「掘掘记账本」前端代码开源地址：https://github.com/Nick930826/juejue-vite-h5
• 「掘掘记账本」后端代码开源地址：https://github.com/Nick930826/jue-diary-server

文档地址：

• egg.js 官方文档
• react
• ZarmUI
• Vite 官方中文文档

学习笔记的地址：

• 前端包 github 地址：
• 后端包 github 地址：https://github.com/kaimo313/kaimo-cost-server

项目页面效果

大致的页面效果如下：更多请参考「掘掘记账本」在线预览： cost.chennick.wang，（测试账号：admin，测试密码：111111。也可以自行注册使用。）

登录注册

账单页面

统计页面

账户页

笔记目录

下面这些只是我做的笔记，从遇到的问题记录，到其中部分东西的拓展稍有不同，有错误在所难免，欢迎指正批评，仅供参考。

报错篇

1. 执行 mysqld --install 报错：由于找不到VCRUNTIME140 1.dII, 无法继续执行代码
2. 执行 mysqld --install 报错：Install Remove of the Service Denied
3. 执行 mysqld --install 报错：The service already exists
4. egg.js 项目初始化报错 ConnectionTimeoutError: Connect timeout for 5000ms
5. 启动停止mysql时报：服务正在启动或停止中，请稍候片刻后再试一次。
6. ERROR 1045 (28000): Access denied for user ‘root‘@‘localhost‘ (using password: YES)
7. git push -u origin main 报错 remote: Invalid username or password.
8. git 报错：Support for password authentication was removed. Please use a personal access token instead.
9. Incorrect table definition； there can be only one auto column and it must be defined as a key
10. eggjs 项目报错 Cookie need secret key to sign and encrypt. Please set config.keys first

后端篇

1. 怎么在 window 系统里本地安装 mysql
2. Egg.js 项目初始化介绍
3. egg 项目里编写基础的 GET 接口：使用 GET 请求参数获取
4. egg 项目里编写基础的 POST 接口：使用 POST 请求参数获取
5. egg 项目里从 Service 内获取模拟数据
6. Egg.js 项目中怎么使用前端模板
7. 怎么使用可视化数据库工具 DBeaver 连接本地数据库？
8. 怎么使用可视化数据库工具 DBeaver 新建数据库表？
9. Egg 项目怎么连接 MySQL 实现增删改查接口？
10. 设计数据库表：用于 eggjs 实现记账本
11. 用户鉴权、JWT（JSON Web Token）是什么？
12. eggjs 怎么实现用户注册功能？
13. eggjs 怎么使用 egg-jwt 进行用户鉴权实现登录功能？
14. eggjs 怎么使用 egg-jwt 实现 token 解析？
15. eggjs 怎么使用 egg-jwt 实现登录验证中间件？
16. eggjs 怎么实现获取用户信息接口？
17. eggjs 怎么实现更新用户信息接口去更新个性签名？
18. eggjs 怎么实现上传图片（头像）接口功能？
19. eggjs 怎么实现更新用户信息接口去更新上传头像信息？
20. eggjs 怎么实现返回 base64 图片的接口给前端回显头像？

前端篇