第九周
date
Jun 12, 2022
tags
summary
type
Post
status
Published
slug
week-9
Vue 3 学习项目：Idered/chalk.ist: 📷 Create beautiful images of your source code
单看 Vue3 组合式 API 部分的文档会让我有点迷茫，对着实际项目再去查阅有疑问部分的文档。像是带着问题去找答案的感觉，这种方式会让我理解得更加深。
稍微总结一下读完整个项目的感受：
- 单文件组件语法糖：顶层的绑定会被暴露给模板，有点 Svelte 那味道了
- 项目中使用‣和 vite-plugin-vue-layouts 让 Vue 项目的路由基于文件系统来自动生成，省去了注册路由（像 Next.js 和 Nuxt.js 那样）
- 使用 ‣ 来在浏览器中 Resize 图片，和用 JS 来按比例裁剪图片。在项目中前端处理 Twitter 头像上传功能
- 用 VueUse 中的 Hooks 来解决通用问题，比如 useStorage、useElementSize、useFuse(JS模糊搜索)
Next.js 项目学习：‣
我写 Blog 项目就是这样，文章没怎么更新，就瞎搞，自嗨模式
他这个还不一样一点，你这个是静态生成也是现在搭建博客比较流行的方式（Next.js 的 getStaticProps）
他这个项目是服务端渲染（Next.js 的 getServerSideProps），自己维护了数据库，用 Prisma 做查询，有自己的管理后台
原来 egoist 早几天又改了，把他的博客部分删除掉了，可以看看历史的 commit。下面截图是跑在我本地的
懂了懂了，自己维护数据库，更新文章数据后都不用重新构建 Next.js 项目，能学到一点全栈流程相关的知识
最近看一些全栈项目比较多，有些项目需要 Postgres、MongoDB、Redis 这些数据库的。自己懒得去查怎么安装数据库，之前使用 ‣ 跑在本地的 Docker 里面。但如果需要公网访问的数据库时就无能为力了。发现 Railway 启动一个数据库实例 10 秒就能搞定，真的太好用啦！
程序中的“状态机” 可以这么写
某个状态是在几个固定的状态枚举之间轮转，可以用这种更好读的方式
使用 ‣ 提供 Mock 接口
太简单啦，只需要写一个 `db.json` 文件就够了！支持增、删、改操作让我很是惊喜
如果发出 POST、 PUT、 PATCH 或 DELETE 请求，更改将使用 lowdb 自动并安全地保存到 db.json。
