feat(vibe-stories): add new vibe stories section with interactive carousel

2026-03-28 23:26:53 +08:00
parent f42a633226
commit 7392d8a805
10 changed files with 778 additions and 17 deletions
@@ -0,0 +1,27 @@
+---
+title: 我的第一个全栈项目
+description: 记录如何使用 AI 从零开始完成一个全栈项目。
+---
+
+# 我的第一个全栈项目
+
+> **作者：Sanbu**
+> **头像：👨‍💻**
+
+在这里，我将分享我是如何使用 AI（Cursor 和 Claude）在短短几天内完成我的第一个全栈项目的。
+
+## 想法诞生
+
+我一直想做一个属于自己的工具，但是因为缺乏技术背景，很多想法都停留在脑海里。直到我遇到了 Vibe Coding 的概念。
+
+## 开发过程
+
+1. **前端搭建**：通过对话，AI 帮我生成了 React 组件。
+2. **后端对接**：使用 Supabase 作为后端，AI 帮我写了所有的增删改查逻辑。
+3. **部署上线**：使用 Vercel 一键部署。
+
+![项目截图](https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?q=80&w=2564&auto=format&fit=crop)
+
+## 总结
+
+AI 编程真的改变了普通人创造产品的方式。只要你有想法，就能把它变成现实！
@@ -0,0 +1,25 @@
+---
+title: 从产品经理到独立开发者
+description: 一个产品经理如何使用 AI 实现身份的转变。
+---
+
+# 从产品经理到独立开发者
+
+> **作者：Alice**
+> **头像：👩‍🎨**
+
+作为一名产品经理，我习惯了写 PRD 和画原型，但总是需要依赖开发团队才能把产品做出来。现在，一切都不一样了。
+
+## 我的转型之路
+
+我开始学习 Vibe Coding 工作流，把画原型的精力直接用来和 AI 结对编程。
+
+- 第一周：学会了如何写出结构化的提示词。
+- 第二周：完成了一个基础的记账工具。
+- 第一个月：上线了我的第一个商业化产品。
+
+![我的作品](https://images.unsplash.com/photo-1550745165-9bc0b252726f?q=80&w=2564&auto=format&fit=crop)
+
+## 给其他 PM 的建议
+
+不要害怕代码，把 AI 当作你的首席开发工程师，你只需要做好产品定义。
@@ -0,0 +1,23 @@
+---
+title: 用 AI 提效 10 倍
+description: 探索日常开发中的 AI 提效实践。
+---
+
+# 用 AI 提效 10 倍
+
+> **作者：Bob**
+> **头像：🚀**
+
+我已经有几年的开发经验了，一开始我对 AI 写代码持怀疑态度，但尝试之后，真的被震撼到了。
+
+## 提效点
+
+1. **写测试用例**：以前最讨厌写单测，现在 AI 几秒钟就能生成覆盖率很高的测试。
+2. **重构老代码**：把长达几百行的意大利面条代码扔给 AI，它能完美地拆分成设计模式良好的模块。
+3. **学习新技术**：遇到没用过的库，直接问 AI 要最佳实践。
+
+![提效场景](https://images.unsplash.com/photo-1558655146-d09347e92766?q=80&w=2564&auto=format&fit=crop)
+
+## 结论
+
+拥抱 AI，不要被时代淘汰。