React的豆瓣demo
- 搭架子(路由)
- css在react中的应用
- 列表渲染
- 分页
- 上拉加载更多
- 加载提示
- 详细页面
- loading组件
- react-loading
- menu菜单的切换
- 搜索要做
- 异步代码加载
- 解决browerHistory的跨路由访问问题
- 部署到服务器上
- webpack
- react
- react-router
- fetch
- redux+react-redux
- webpack:https://webpack.github.io/
- react:
- react-router
- fetch:https://my.oschina.net/u/1416844/blog/731749
- sass:http://sass.bootcss.com/
- Flex:http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_source=tuicool
- ES6:http://es6.ruanyifeng.com/
- YARN:http://www.open-open.com/lib/view/open1478485680274.html
- PM2:https://www.douban.com/note/314200231/
- AVA:https://github.com/avajs/ava-docs/blob/master/zh_CN/readme.md#%E7%94%A8%E6%B3%95
- TypeScript:https://tslang.cn/index.html
- Immutable:
- node:
- 常见react的组件库
- 正在热映:https://api.douban.com/v2/movie/in_theaters?start=3&count=10
- 即将上映:https://api.douban.com/v2/movie/coming_soon?start=6&count=10
- top250:https://api.douban.com/v2/movie/top250?start=6&count=10
- 详细数据:https://api.douban.com/v2/movie/subject/25847558
- 搜索数据:https://api.douban.com/v2/movie/search?q={text}
- setState方法不是立即赋值,而是在componentDidUpdate方法之后才从新为state赋值
- 如果全局为div设置了宽高100%,后面组件里面会自动继承全局的,然后效果是撑满全屏,如果只想撑满父组件,需要在div中从新设置htight=100%
- 组件拆分不可能一下分的非常好,那么你先把大的部分给分出来,哪里有性能问题再去优化,整个模块的拆分**是,从大往小去分,从外往内去分。
- 组件化开发,代码组织结构是按ui界面去划分的,不是按业务功能区组织。这样可能会导致代码冲突,但是带来的好处比代码冲突更多,就可以忽略代码冲突问题了。不可能每个点都照顾到。
- 只要看不明白了,就过组件的生命周期,给你一个组件,要按照生命周期的顺序去看这个组件,如果一个js中有多个组件,我们先看export default 导出的模块
- 注意css和js文件的命名规范
- 注意代码健壮性,业务逻辑完整性
- 现在环境:
npm install
- 项目开发环境:
npm run develop
- 项目部署环境:
npm run publish
- gulp和webpack的集成:
npm run gulp
- webpack2的官网<webpack.js.org>
- webpack2的examplehttps://github.com/wxyyxc1992/Webpack2-React-Redux-Boilerplate/tree/master/dev-config