react-reduc-test v1.0.0

热更新、ES6/7、LESS、Router4、redux、webpack3、async／await、前端node服务器，按需加载...

本项目升级到react最新版，测试通过，快来体验吧！

适用人群：该框架集成了react开发常用技术栈，适用于想要学习单向数据流框架搭建的新手、以及想要一个比较干净、简洁的框架从事实践项目的开发者。（doc文件夹附有教程文档）

客户端渲染

本项目是客户端渲染版本

服务端渲染

新发布了基于本框架的服务端渲染版本：https://github.com/hyy1115/react-next

版本更新内容

1、React和React-Dom打包压缩后的总体积由147KB => 116KB

2、React16更新变化请看官方文档：https://facebook.github.io/react/blog/2017/09/26/react-v16.0.html

3、新增preact支持，如果你觉得preact的兼容性不好，可以切换回react，只需要删除webpack.config的alias的几行配置。

 'react': isPro ? 'preact-compat/dist/preact-compat' : 'react', //如果你不想要preact，可以删除这一行
'react-dom': isPro ? 'preact-compat/dist/preact-compat' : 'react-dom', //如果你不想要preact，可以删除这一行
'create-react-class': 'preact-compat/lib/create-react-class' //如果你不想要preact，可以删除这一行

官方推荐：

对于 HTTP/1.1 客户端，由 webpack 打包你的应用程序会尤其强大，因为在浏览器发起一个新请求时，
它能够减少应用程序必须等待的时间。对于 HTTP/2，你还可以使用代码拆分(Code Splitting)以及通过 
webpack 打包来实现最佳优化。

我自己也是基于这套框架做开发，所以我会长期维护该项目，跟随相关插件的升级而升级优化。

==========================

Installation 教程

fork到你的账号，简单省事，或者 download 项目到本地

1、 安装依赖包，已经解决了一些依赖包安装最新版可能出现的bug，如果还有问题，可以看相关社区的issue。

npm install 或者cnpm install

2、运行demo。

npm start

3、将会开启3011端口.

http://localhost:3011

4、打包发布: 假设你用的是阿里云服务器，你可以把静态资源和图片都放到CDN，index.html放到你的域名服务器下面，请注意路径问题。

mac
npm run build-mac

windows
npm run build-win

===========================================

关于DOC文档教程的解释

非常抱歉的是由于各个插件版本升级太快，一些文档教程没有实时跟上维护修改，如果你有参与项目的意愿，可以帮忙更新DOC教程。

关于react-transition-group的注意事项

react-transition-group目前有V1和V2，本项目使用的是V1，如果没有需求，请勿切换到V2，我尝试升级V2，发现过渡动画切换出现了异常。
如果你想升级，那么我可以提供一个简易的代码修改提示。

项目结构

├── doc //各种与该项目或者react有关的开发文档供你参考
├── index.html //单页应用的html
├── package.json //node相关环境的配置文件
├── server.js //前端服务器
├── src //项目的主要目录
│   ├── App.js //根react组件
│   ├── AsyncComponent.js //异步react组件HOC
│   ├── actions //action控制中心
│   ├── app.less //公共样式
│   ├── containers //按页面划分组件，每个页面内部的组件在该目录下面管理，公共组件提取到Commons
│   │   ├── BookList
│   │   │   └── BookList.js
│   │   ├── Commons
│   │   │   ├── MyScroll.js
│   │   │   ├── ReactChildrenMap.js
│   │   │   └── SetDocumentTitle.js
│   │   ├── Home
│   │   │   ├── Home.js
│   │   │   ├── components
│   │   │   ├── files
│   │   │   └── styles
│   │   └── Search
│   │       ├── Search.js
│   │       ├── components
│   │       └── styles
│   ├── entry.js //webpack打包入口
│   ├── reducers //存放state
│   └── utils //提供一些小工具
├── test //jest测试集
│   ├── __snapshots__
├── webpack.config.js //webpack配置文件
└── webpackServerConfig.js //webpack公共对象

echarts 使用方案

想要在react恰当的使用echarts，可以查看 react中使用echarts的最优方案

学习ES6语法

React项目中，使用了大量的ES6语法，如果你还没有学习过ES6，那么推荐你看 深入理解ES6笔记

参与开源项目的方法（详情可以网上搜索教程）

如果你对该项目感兴趣，想共享一份你的力量，请大胆pull PR！