最近自己做了一个React记账项目，作为一个新手前端，开发能力相对有限，在自己做了一个Demo之后，又借鉴了一个大厂前端大佬的代码。特此写下一篇总结。
前期设计非常重要
不管是页面设计还是项目结构设计，前期如果这些工作没有做好，后面的开发工作可能就会因为设计不合理的问题大大降低开发效率。
学好JavaScript是关键
React是一个Javascript的library，并不像Vue那样什么事情都给你设计好了现成的工具，自己去调用就行。React给你的东西非常少，但正因如此，React给你做开发的自由度非常高，能够实现高度定制化的组件。借鉴了大佬的代码之后我发现大佬对JS数据结构的掌握和运用相当娴熟，再加上React项目都是搭配Typescript做开发，所以要想真正精通React，需要你对js有相当深厚的功底。
此外，在写代码之前，做好typescript的类型声明也非常关键。做好类型声明，可以说工作就完成了一半，剩下的就是照着骨架填充肉体。
总之，React是JavaScript的一个库，Typescript是JavaScript的超集，所以JavaScript基础决定你的React开发下限。这两个东西会倒逼你去master JavaScript这门语言。
实现一个CRUD应用非常依赖React Hooks
做React开发的我，相信未来函数式组件会取代类组件。函数式组件配合React Hooks，能够实现更高层面的抽象和简化代码逻辑。
就拿我做记账项目来说，如何使用各种钩子去实现一个全局的状态管理工具以及优雅地实现CRUD交互功能，非常考验代码水平，特别是对hooks的理解。我自己做的项目基本只用到useEffect、useState和用这两个钩子构建的自定义钩子。但是观摩大佬的代码，useContext、useReducer、useCallback这种高级的钩子用得恰到好处，大大地简化了代码，增强了可读性。我的代码对照来看简直就是灾难。。。
原始数据的数据结构一定要保证简单
这其实也是设计的问题，但依然值得注意。账单项目的原始数据就是一条条账目记录，里面包含了账目类别、账单id、金额、日期、备注等内容。每一条记录请以最简单的对象形式保存，不要层层嵌套。
我自己的项目就犯了这个错误，导致代码的可读性非常差。
要做测试！
我对驱动测试开发（TDD）持有保留意见，不推崇也不排斥。但不管是先写测试样例再开发，还是先开发再补充测试样例，做单元测试总归会提高代码的健壮性，而且能够培养思维的缜密性。 随着项目代码的增加，业务量的逐步积累。在后期，单元测试所能为我们节约的时间要远远大于写测试代码所带来的额外成本。
一个简单的原则是：简单的常用的方法和函数可以先做测试样例再去实现，复杂的先开发再补充测试样例。
总之，做单元测试是相当重要的职业习惯！！！
多学习一些业界流行的包和框架
比如axios, lodash, moment, antd这类包和框架。
自己的项目基本没有用到上述这些库，一步一步全都自己实现会大大降低开发效率，设计观感上也比较欠缺。
