入门React实例 以express+mongodb+ES6重写官网评论实例

#1

源码地址:需要你star的鼓励


###运行
####clone后运行npm install(推荐使用淘宝镜像cnpm,会快很多),再开启mongodb,然后npm start 然后访问[http://localhost:8888]我们就可以看到项目跑起来了。

###重写

后台使用express,并把数据存入mongodb数据库,前端加入webpack编译,react语法完全用ES6重写。并利用setState更新状态来取消官网极其影响性能的轮询。


###感想
跟着官网敲了才发现,例子里面实现发表评论实时更新是用每两秒轮询一次来实现的。感觉有了状态机这么美妙的东西,为什么不用呢?上手重写才发现,要更新State没那么简单,我最后以组件间层层嵌套来消灭了轮询。后来才知道,让组件之间通信变得优雅的东西叫Redux:joy:

React的这个实例看似简单,但是我在重写的时候确是踩了不少的坑。因为一开始对于React部分的代码理解不够深入,我在用express搭建后台和试图用状态更新替代原本的每两秒轮询一次的时候,都遇到了不少问题。随着我在论坛(如stackoverflow)查询相关的问题和文档,问题逐渐解决。当查到论坛上和我相同的问题被解答并解决时,竟然有一种幸福感╮(╯▽╰)╭ 。嗯,问题总是能解决的。

#2

不妨改用websocket啊。

#3

确实可以啊,要上手的时候发现自己对websocket很不熟:joy:难受