【视频】Nuxt3+Vercel+Serverless 全栈开发（3）：实现投票效果，使用 Redis

课程继续。仍然结合近期的开发经验，分享最近我比较喜欢的全栈+高效+免费+云原生技术方案。

本次课程内容：

• CSS 里使用 ~ 兄弟选择器实现投票效果
• 使用 Upstash Redis
• 使用 Nuxt3 风格的加载方法读取数据

打分组件，我们需要用到 ~ 选择器选择某个节点后面的所有弟弟节点，配合蒙版属性 mask-* 可以实现我们要的打分效果。

接下来我们开始接触远程数据的操作。Vercel 免费版 Redis 每天只有 1k 的请求数，不太够用；如果升级付费版，也没法针对某个部分单独升级。所以很明显，Upstash 这样专门的服务商更合适。

Nuxt3 为实现 SSR，对远程请求进行了封装，提供 useFetch、useLazyFetch、useAsyncData、useLazyAsyncData 这 4 个新方法。其中前两者可以视作后两者的封装。在本节课里，我们先实现了读取数据的 API，然后用 useFetch 加载数据，实现服务器端渲染。

这期视频也剪得很细，还做了字幕，希望大家能学到东西。

如果你有任何问题、建议，欢迎留言讨论。请 b 站有号的同学帮忙分享完播一键三连，谢谢大家。

另外，我也在 YouTube 上上传了一份，大家有空的话，麻烦帮忙关注下我的油管频道，感谢感谢。肉山全栈小课堂 – YouTube