Redux生态系统
生态系统
Redux 是一个体小精悍的库,但它相关的内容和 API 都是精挑细选的,足以衍生出丰富的工具集和可扩展的生态系统。
如果需要关于 Redux 所有内容的列表,推荐移步至 Awesome Redux。它包含了示例、样板代码、中间件、工具库,还有很多其它相关内容。要想学习 React 和 Redux ,React/Redux Links 包含了教程和不少有用的资源,Redux Ecosystem Links 则列出了 许多 Redux 相关的库及插件。
本页将只列出由 Redux 维护者审查过的一部分内容。不要因此打消尝试其它工具的信心!整个生态发展得太快,我们没有足够的时间去关注所有内容。建议只把这些当作“内部推荐”,如果你使用 Redux 创建了很酷的内容,不要犹豫,马上发个 PR 吧。
学习 Redux
演示
- 开始学习 Redux — 向作者学习 Redux 基础知识(30 个免费的教学视频)
- 学习 Redux — 搭建一个简单的图片应用,简要使用了 Redux、React Router 和 React.js 的核心思想
示例应用
- 官方示例 — 一些官方示例,涵盖了多种 Redux 技术
- SoundRedux — 用 Redux 构建的 SoundCloud 客户端
- grafgiti — 在你的 Github 的 Contributor 页上创建 graffiti
教程与文章
- Redux 教程
- Redux Egghead 课程笔记
- 使用 React Native 进行数据整合
- What the Flux?! Let’s Redux.
- Leveling Up with React: Redux
- A cartoon intro to Redux
- Understanding Redux
- Handcrafting an Isomorphic Redux Application (With Love)
- Full-Stack Redux Tutorial
- Getting Started with React, Redux, and Immutable
- Secure Your React and Redux App with JWT Authentication
- Understanding Redux Middleware
- Angular 2 — Introduction to Redux
- Apollo Client: GraphQL with React and Redux
- Using redux-saga To Simplify Your Growing React Native Codebase
- Build an Image Gallery Using Redux Saga
- Working with VK API (in Russian)
演讲
- Live React: Hot Reloading and Time Travel — 了解 Redux 如何使用限制措施,让伴随时间旅行的热加载变得简单
- Cleaning the Tar: Using React within the Firefox Developer Tools — 了解如何从已有的 MVC 应用逐步迁移至 Redux
- Redux: Simplifying Application State — Redux 架构介绍
使用 Redux
不同框架绑定
- react-redux — React
- ng-redux — Angular
- ng2-redux — Angular 2
- backbone-redux — Backbone
- redux-falcor — Falcor
- deku-redux — Deku
中间件
- redux-thunk — 用最简单的方式搭建异步 action 构造器
- redux-promise — 遵从 FSA 标准的 promise 中间件
- redux-axios-middleware — 使用 axios HTTP 客户端获取数据的 Redux 中间件
- redux-observable — Redux 的 RxJS 中间件
- redux-rx — 给 Redux 用的 RxJS 工具,包括观察变量的中间件
- redux-logger — 记录所有 Redux action 和下一次 state 的日志
- redux-immutable-state-invariant — 开发中的状态变更提醒
- redux-unhandled-action — 开发过程中,若 Action 未使 State 发生变化则发出警告
- redux-analytics — Redux middleware 分析
- redux-gen — Redux middleware 生成器
- redux-saga — Redux 应用的另一种副作用 model
- redux-action-tree — Redux 的可组合性 Cerebral-style 信号
- apollo-client — 针对 GraphQL 服务器及基于 Redux 的 UI 框架的缓存客户端
路由
- redux-simple-router — 保持 React Router 和 Redux 同步
- redux-router — 由 React Router 绑定到 Redux 的库
组件
- redux-form — 在 Redux 中时时持有 React 表格的 state
- react-redux-form — 在 React 中使用 Redux 生成表格
增强器(Enhancer)
- redux-batched-subscribe — 针对 store subscribers 的自定义批处理与防跳请求
- redux-history-transitions — 基于独断的 action 的 history 库转换
- redux-optimist — 使 action 可稍后提交或撤销
- redux-optimistic-ui — A reducer enhancer to enable type-agnostic optimistic updates 允许对未知类型进行更新的 reducer 增强器
- redux-undo — 使 reducer 便捷的重做/撤销,以及 action 记录功能
- redux-ignore — 通过数组或过滤功能忽略 redux action
- redux-recycle — 在确定的 action 上重置 redux 的 state
- redux-batched-actions — 单用户通知去 dispatch 多个 action
- redux-search — 自动 index 站点资源并实现即时搜索
- redux-electron-store — Store 增强器, 可同步不同 Electron 进程上的多个 Redux store
- redux-loop — Sequence effects purely and naturally by returning them from your reducers
- redux-side-effects — Utilize Generators for declarative yielding of side effects from your pure reducers
工具集
- reselect — 受 NuclearJS 启发,有效派生数据的选择器
- normalizr — 为了让 reducers 更好的消化数据,将API返回的嵌套数据范式化
- redux-actions — 在初始化 reducer 和 action 构造器时减少样板代码 (boilerplate)
- redux-act — 生成 reducer 和 action 创建函数的库
- redux-transducers — Redux 的编译器工具
- redux-immutablejs — 将Redux 和 Immutable 整合到一起的工具
- redux-tcomb — 在 Redux 中使用具有不可变特性、并经过类型检查的 state 和 action
- redux-mock-store - 模拟 redux 来测试应用
- redux-actions-assertions — Redux actions 测试断言
开发者工具
- redux-devtools — 一个使用时间旅行 UI 、热加载和 reducer 错误处理器的 action 日志工具,最早演示于 React Europe 会议
- Redux DevTools Extension — 打包了 Redux DevTools 及附加功能的 Chrome 插件
开发者工具监听器
- Log Monitor — Redux DevTools 默认监听器,提供树状视图
- Dock Monitor — A resizable and movable dock for Redux DevTools monitors
- Slider Monitor — Redux DevTools 自定义监听器,可回放被记录的 Redux action
- Inspector — Redux DevTools 自定义监听器,可筛选、区分 action,深入 state 并监测变化
- Diff Monitor — 区分不同 action 的 store 变动的 Redux Devtools 监听器
- Filterable Log Monitor — 树状可筛选视图的 Redux DevTools 监听器
- Chart Monitor — Redux DevTools 图表监听器
- Filter Actions — 可筛选 action 、可组合使用的 Redux DevTools 监听器
社区公约
- Flux Standard Action — Flux 中 action object 的人性化标准
- Canonical Reducer Composition — 嵌套 reducer 组成的武断标准
- Ducks: Redux Reducer Bundles — 关于捆绑多个 reducer, action 类型 和 action 的提案
翻译
- 中文文档 — 简体中文
- 繁體中文文件 — 繁体中文
- Redux in Russian — 俄语
- Redux en Español - 西班牙语
更多
- Awesome Redux 是一个包含大量与 Redux 相关的库列表。
- React-Redux Links React、Redux、ES6 的高质量文章、教程、及相关内容列表。
- Redux Ecosystem Links Redux 相关库、插件、工具集的分类资源。
Redux生态系统的更多相关文章
- 【原】redux学习笔记
上周学习了flux,这周研究了一下redux,其实很早之前都已经在研究他们了,只是之前一直没搞懂,最近这两周可能打通了任督二脉,都算入门了. 写博客的目的主要是做一下笔记,总结一下思路,以及和大家交流 ...
- 2017年 JavaScript 框架回顾 -- React生态系统
前一篇文章中,我们介绍了2017年 JavaScript 框架的整体情况.我们也了解到在众多的前端框架中,目前最为庞大又在快速增长的当属 React 了,本文就来重点介绍 React 的生态系统. 首 ...
- RxJS + Redux + React = Amazing!(译一)
今天,我将Youtube上的<RxJS + Redux + React = Amazing!>翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: https:/ ...
- 通过一个demo了解Redux
TodoList小demo 效果展示 项目地址 (单向)数据流 数据流是我们的行为与响应的抽象:使用数据流能帮我们明确了行为对应的响应,这和react的状态可预测的思想是不谋而合的. 常见的数据流框架 ...
- RxJS + Redux + React = Amazing!(译二)
今天,我将Youtube上的<RxJS + Redux + React = Amazing!>的后半部分翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: ht ...
- redux学习
redux学习: 1.应用只有一个store,用于保存整个应用的所有的状态数据信息,即state,一个state对应一个页面的所需信息 注意:他只负责保存state,接收action, 从store. ...
- webpack+react+redux+es6开发模式
一.预备知识 node, npm, react, redux, es6, webpack 二.学习资源 ECMAScript 6入门 React和Redux的连接react-redux Redux 入 ...
- Redux初见
说到redux可能我们都先知道了react,但我发现,关于react相关的学习资料很多,也有各种各样的种类,但是关于redux简单易懂的资料却比较少. 这里记录一下自己的学习理解,希望可以简洁易懂,入 ...
- Spark 生态系统组件
摘要: 随着大数据技术的发展,实时流计算.机器学习.图计算等领域成为较热的研究方向,而Spark作为大数据处理的“利器”有着较为成熟的生态圈,能够一站式解决类似场景的问题.那你知道Spark生态系统有 ...
随机推荐
- java 泛型的内部原理:类型擦除以及类型擦除带来的问题
一.Java泛型的实现方法:类型擦除前面已经说了,Java的泛型是伪泛型.为什么说Java的泛型是伪泛型呢?因为,在编译期间,所有的泛型信息都会被擦除掉.正确理解泛型概念的首要前提是理解类型擦出(ty ...
- 1.Dockerfile
1.docker build docker build 这个动作有一个context 上下文的概念 docker build -f /path/to/a/Dockerfile .这个动作 通过 -f ...
- HDU-2189来生一起走
题目: 今天,又来了n位志愿者,指挥部需要将他们分为若干个小组,小组的数量不限,但是要求每个小组的人数必须为素数,请问我们有几种分组的方法呢? 特别说明: 1.可以只有一个组: 2.分组的方法只和人数 ...
- R语言常用数据管理
1.变量的重命名 (1)交互式编辑器修改变量名 若要修改数据集x中的变量名,键入fix(x)即可打开交互式编辑器的界面.若数据集为矩阵或数据框,单击交互式编辑器界面中对应要修改的变量名,可手动输入新的 ...
- linux精简开机启动服务
1.可以使用 setup-system services 里面调整,这样调整起来效率低 2.或者 ntsysv 调出来 3.使用脚本一件关闭 #LANG=en chkconfig --list #停止 ...
- 一、C++类库与C#类库相互调用
1.C++调用C#类库 1.准备C#类库(dll文件) 1.1.创建C#类库: 右击项目类库生成即可, 出现.dll(类库)与.pdb(pdb文件包含了编译后程序指向源代码的位置信息, 用于调试的时候 ...
- linux--基础知识1
#进入终端窗口,root命令提示符#,普通用户登陆提示符$,切换终端用户 ctrl+shift+F2,退出终端命令exit #init 0 关机 reboot 重启 ls查看当前目录下文件 ls ...
- Kubernetes部署DNS
前言 阅读地址 http://thoreauz.com/2017/04/16/docker/Kubernetes%E9%83%A8%E7%BD%B2DNS%E5%92%8CDashboard/ Kub ...
- MYSQL中IN与EXISTS的区别
在MYSQL的连表查询中,最好是遵循‘小表驱动大表的原则’ 一.IN与EXISTS的区别1.IN查询分析SELECT * FROM A WHERE id IN (SELECT id FROM B ...
- git 日常 常用命令
初始化git git init 第一次拉代码: 方式1:git clone git clone https://git.oschina.net/*****.git (https远程仓库地址) 方式2: ...