lumia2046 / cnode

基于react编写的cnodejs论坛第三方webapp

项目简介

一个WebApp版的cnode客户端，项目采用react技术栈构建。组件选用的是Material-UI，让界面更适合触控操作。

• 感谢来自cnodejs论坛官方提供的api！

功能

• 首页列表，下拉时自动加载下一页，在顶端上拉刷新
• 主题详情，登陆后能够收藏，评论和点赞
• 消息提醒，能查看消息详情和清空所有未读消息
• 个人主页，包括最近参与，回复，以及收藏的主题
• 发表主题，成功后能跳转到相应主题页面
• 页面后退，能还原数据和滚动位置

运用的技术主要有:

• 采用react技术栈，通过Redux来管理页面状态，通过Router来设置页面路由
• 组件选用的是Material-UI，不再自己造轮子，既美观又能方便触控操作
• 使用react-route v4 和 react原生的react-transition-group v2 来实现路由切换动画
• 使用react-flip-move插件来实现list的加载动画
• 应用isomorphic-fetch库代替XMLHttpRequest实现网络请求
• 使用PostCSS对CSS进行预处理
• 通过CSSModules处理模块内部的类名

预览

DEMO

运行项目

  git clone https://github.com/lumia2046/cnode.git
  cd cnode
  npm install
  npm start
  打开浏览器访问：http://localhost:5678

生产项目

  windows下
  npm run build-win
  linux、mac下
  npm run build-win