1. 从零到一：我的第一个原创项目"微记账"诞生记
去年夏天，我决定开发一个属于自己的原创项目。作为一名刚入行的开发者，我选择了"微记账"这个看似简单却充满挑战的方向。这个决定源于我自己生活中的痛点——每次月底查看信用卡账单时，总会被一些不明消费吓一跳。市面上的记账软件要么功能臃肿，要么广告满天飞，我想要做一个极简但实用的解决方案。
2. 项目定位与核心功能设计
2.1 为什么选择记账应用作为第一个项目
记账类应用有几个独特优势：首先，它有明确的使用场景和用户需求；其次，功能模块相对清晰（记录、分类、统计）；最重要的是，它可以从简单开始，逐步迭代复杂功能。我给自己定的第一个版本目标很简单：让用户能快速记录一笔支出，并看到当天的消费总额。
2.2 最小可行产品(MVP)功能清单
经过多次推敲，我确定了首个版本的核心功能：
- 支出记录（金额、分类、时间、备注）
- 简单的日/周消费统计
- 本地数据存储
- 基础分类管理（餐饮、交通、购物等）
这些功能看似简单，但已经能满足最基本的记账需求。我刻意避开了账户同步、多设备支持等复杂功能，确保项目能在合理时间内完成。
3. 技术选型与架构设计
3.1 前端框架的选择困境
作为新手，我在React和Vue之间犹豫了很久。最终选择Vue.js的原因是：
- 学习曲线相对平缓，文档友好
- 单文件组件结构清晰
- 社区活跃，遇到问题容易找到解决方案
// 一个典型的支出记录组件结构 <template> <div class="expense-form"> <input v-model="amount" type="number" placeholder="金额"> <select v-model="category"> <option v-for="cat in categories" :value="cat.id">{{ cat.name }}</option> </select> <button @click="saveExpense">保存</button> </div> </template>3.2 后端与数据存储方案
考虑到第一个版本的用户量预期，我决定使用纯前端方案：
- 数据存储在浏览器的localStorage中
- 使用vuex-persistedstate插件实现状态持久化
- 没有使用数据库，大大简化了部署复杂度
这个决定后来被证明是明智的——它让我能专注于核心功能的开发，而不是陷入后端配置的泥潭。
4. 开发过程中的关键挑战
4.1 数据结构的反复调整
最初的支出记录设计非常简单：
{ amount: 20, category: "food", date: "2023-05-01" }但随着开发的深入，我遇到了几个问题：
- 分类需要支持多级（如"餐饮→午餐"）
- 需要记录创建和修改时间
- 可能需要支持图片附件
经过三次重构后，数据结构变成了：
{ id: "exp_123", amount: 20.5, currency: "CNY", category: {id: "cat1", parent: "food"}, notes: "公司楼下奶茶", createdAt: "2023-05-01T12:30:00Z", updatedAt: "2023-05-01T12:30:00Z", attachments: [] }4.2 本地存储的性能优化
当记录超过1000条时，我发现应用的响应速度明显下降。通过分析，发现两个主要瓶颈：
- 每次保存都全量写入localStorage
- 统计计算没有缓存
解决方案：
- 实现增量更新，只修改变动的记录
- 添加统计缓存，每日汇总数据只计算一次
- 添加分页加载，不一次性读取所有记录
5. 那些踩过的坑与宝贵经验
5.1 日期处理的陷阱
初期我天真地使用new Date()获取当前时间，直到用户反馈跨时区使用时数据混乱。解决方案：
- 统一使用ISO8601格式存储时间
- 在前端显示时转换为用户本地时区
- 使用day.js替代原生Date对象
// 错误的做法 const now = new Date(); // 依赖运行环境时区 // 正确的做法 import dayjs from 'dayjs'; const now = dayjs().toISOString(); // "2023-05-01T12:30:00Z"5.2 分类系统的设计教训
第一个版本使用固定分类列表，很快就有用户要求自定义分类。我学到的重要一课：任何看似固定的数据，最终用户都会想要自定义。现在我会为所有可配置项预留扩展接口。
6. 从项目中学到的非技术经验
6.1 用户反馈的价值
发布第一个版本后，我通过朋友圈收集了20多位朋友的试用反馈。最意外的发现是：超过一半的用户希望有"快速记录"功能——不用打开完整表单，只需输入金额就能保存（其他信息可后续补充）。这个简单的功能让用户留存率提高了40%。
6.2 持续迭代的重要性
第一个版本我只用了两周就完成了，但后续的优化和改进持续了三个月。最大的体会是：发布不是终点，而是起点。即使是小项目，持续迭代带来的提升也远超预期。
7. 给想做第一个原创项目的新手建议
- 从小开始：选择你能在2-4周内完成的项目范围
- 解决真实问题：最好是你自己遇到的痛点
- 拥抱不完美：第一个版本可以简陋，但核心功能要可靠
- 收集反馈：即使是小范围试用也能发现关键问题
- 持续学习：把每个项目当作学习机会，不要害怕重构
我的"微记账"项目至今仍在维护，虽然用户不多，但它带给我的成长远超预期。当你完成第一个原创项目时，那种"这是我创造的"成就感是无与伦比的。现在回头看那些早期的代码，虽然稚嫩，却弥足珍贵。
