心情墙项目
项目地址：https://github.com/MiaoQ/react-app-1
写在前面
最近学习了时下前端较为火热的MVVM框架React，于是心痒痒的想要做个东西出来。焦急又焦急，不知道做个什么东西出来比较好，搜了搜别人都在做什么，还是没灵感（其实我特别想做一个微博那样的东东，但是觉得后台好可怕，数据库好复杂…暂时搁置）。实在想不到了，就学别人做个记事本吧，搜到一个做记事本的项目，用IndexedDB存储数据，还好，还在前端范畴，开始动手。
大框架搭了一点点，越看越不顺眼，做个记事本感觉一点也不好玩，InddexedDB也不怎么好管理，于是造型开始往微博的样子在变化，数据库也由mongoDB代替…折折腾腾十几天，终于收获战果，大大的满足。
罗里吧嗦这么多，其实就想谈谈我的两点最大的感触：
一、自己喜欢的才是最好的，刚开始做的记事本排版和逻辑都不是我想要的，越做越难受，不仅没动力，还有嚼蜡的感觉；
二、不要无限扩大对未知事物的畏惧，渡过开头的难关，柳暗花明又是一村。
大致过程
一、使用create-react-app来构建React环境。
二、一个完整的应用大致需要三个部分：视图呈现 + 数据交互 + 数据处理
视图呈现
先在脑海中设计好自己想要的界面结构，再将构图拆分成一个个组件，在写每一个组件的时候要清楚的知道数据的流动。在需要数据交互的地方，先用静态数据填充，并留好api。
数据交互
数据交互就是前台与后台的数据传递，首先想到ajax，对于我个人来说，非常不喜欢使用原生的XMLHttpRequest来写，之前写了几次结构都有点乱。然后想到jQuery，但是很多人也不建议在React中使用。再继续搜，选定了fetch。
自己写项目，肯定自己要用得顺手，最不喜欢每次用个东西都跑过去复制，于是开始封装fetch，封装成了自己能记住的样子。
数据处理
引用Node.js的Express模块搭建一个简单的server，处理来自前台的请求，对数据库进行操作。
Node.js提供了操作MongoDB的方法，连接数据库，再次封装成自己喜欢的方式。
小结
本项目从前端页面呈现到后台服务器搭建以及数据库操作，全都使用js搞定，是前端工程师的一大福音。
在完成每一部分的时候都要有模块化的思想，server、数据库的操作、fetch方法的封装、React组件的构建…当项目从记事本的样子变成微博的样子，只需移除那些不想要的组件，是非常有魅力的一件事。
有些灵感会在项目进行中一点点迸发出来，比如功能的扩展，处理数据的方式，甚至是文件夹的摆放…不要轻易放过它们，一切都会向着更美好的方向前进。