「首席架构师推荐」React生态系统大集合

关于React生态系统的一系列令人敬畏的事情。

React

• React一般资源

• React社区

• React在线游乐场

• React教程

• React通用教程

• React钩子

• React和TypeScript

• React性能

• React内部

• React面试问题

• React工具

• React开发工具

• React框架

• React造型

• React路由

• React组件库

• React真棒组件

• 对命令行做出React

• React测试

• React库

• React整合

• 形式

• 自动完成

• 图像

• 模型库

• 数据管理

• 地图

• 图表

• React原生

• React本机常规资源

• React原生社区

• React原生教程

• React原生开发工具

• React原生样本应用程序

• React Native Boilerplates

• React Native Awesome Components

• ReactAR / VR

• ReasonReact

• Flux

• Flux一般资源

• Flux实现

• Flux教程

• Redux

• Redux通用资源

• Redux工具

• Redux教程

• MobX

• MobX通用资源

• MobX工具

• MobX教程

• GraphQL

• GraphQL规范

• GraphQL工具

• GraphQL教程

• GraphQL实现

• 服务器集成

• 数据库集成

• Relay

• 中继一般资源

• 中继教程

• 中继工具

• Apollo

• Apollo综合资源

• 影片

• 重要会谈

• React.js Conf 2015播放列表

• ReactEurope Conf 2015第1天播放列表

• ReactEurope Conf 2015第2天播放列表

• ReactRally Conf 2015播放列表

• React.js Conf 2016播放列表

• ReactRally Conf 2016播放列表

• React.js Amsterdam 2018播放列表

• 视频教程

• 演示

• 示例应用

• 真正的应用

• 贡献

React

用于构建用户界面的JavaScript库

React教程

React通用教程

• React官方教程

• 在Visual Studio代码中使用React

• Scrimba - 以交互方式免费学习React

• FreeCodeCampReact挑战

• ReactCheatsheet

• React模式

• 使用React设置流程

React钩子

• React钩子

• 用React Hooks和Context替换Redux

• React Hooks备忘单：解锁常见问题的解决方案

• 如何使用React Hooks获取数据？

• 易于理解React Hook食谱

• 令人敬畏的React Hooks

React和TypeScript

• TypeScript，React和Webpack

• TypeScript中的JSX

React性能

• React优化性能

• 介绍React Profiler

• 优化React：虚拟DOM解释

• React中优化主要性能问题的权威指南

• Twitter Lite和高性能Retive渐进式Web应用程序

• 使用React DevTools Profiler诊断React App性能问题

• 提高React性能的五大实践

• React很慢，React很快：在实践中优化应用程序

• 使用react-window渲染大型列表

React内部

• Reconciliation

• React Fiber Architecture

• Build your own React

• Inside Fiber: In-depth overview of the new reconciliation algorithm in React

React面试问题

• 13个基本的React面试问题

• React面试问题和答案列表

React工具

React开发工具

• create-react-app - 通过运行一个命令来设置现代Web应用程序

• react-starter-kit - 同构Web应用程序样板

• react-devtools - 检查Chrome和Firefox开发人员工具中的React组件层次结构

• react-hot-loader - 实时调整React组件

• react-loadable - 用于加载具有promise的组件的更高阶组件

• loadable-components - 简化了React代码拆分

• reactotron - 用于检查React和React Native项目的桌面应用程序

• storybook - UI组件开发和测试

• react-styleguidist - 隔离的React组件开发环境，带有生活方式指南

• react-cosmos - 用于创建可重用React组件的开发工具

• eslint-plugin-react - 为ESLint实现特定的linting规则

• eslint-plugin-jsx-a11y - 针对JSX元素的a11y规则的静态AST检查器

• react-axr - React应用程序的可访问性审计

React框架

• next.js - React框架

• gatsby.js - 基于React的免费开源框架

React风格

• styled-components - 组件年龄的可视原语

• emotion - 用于使用JavaScript编写CSS样式的库

• radium - 用于React组件样式的工具链

• jss - CSS的创作工具

React路由

• react-router - React的声明性路由

• navi - React的声明性异步路由

• curi - 用于单页面应用程序的JavaScript路由器

React组件库

• material-ui - React组件，可以更快，更轻松地进行Web开发

• ant-design - 具有自然和确定性价值的设计系统

• blueprint - 基于React的Web工具包

• office-ui-fabric-react - 用于构建Microsoft Web体验的React组件

• react-bootstrap - 使用React构建的Bootstrap组件

• reactstrap - 简单的React Bootstrap 4组件

• semantic-ui-react - 官方的Semantic-UI-React集成

• react-fontawesome - 用于React的Font Awesome 5组件库

• Reakit - React的可访问，可组合和可自定义的组件

React很棒的组件

• Awesome的React Components列表

• react-select - 选择React组件

• react-dnd - 拖放React

• react-grid-layout - 具有响应断点的可拖动和可调整大小的网格布局

• react-table - React的轻量级，快速且可扩展的数据网格

• react-data-grid - 使用React构建的类似Excel的网格组件

• react-draggable - React draggable组件

• react-resizable-and-movable - React的可调整大小和可拖动的组件

• react-resizable - 一个简单的React组件，可以使用句柄调整大小

• react-resizable-box - React的可调整大小的组件

• react-sortable-pane - React的可排序和可调整大小的窗格组件

• react-dates - 一个易于国际化，适合移动设备的网络日期选择器库

• react-big-calendar - 日历组件

• react-datepicker - ReactJS Datepicker

• react-list - 一个多功能的无限卷轴React组件

• react-intl - 国际化React应用程序

• react-i18next - React的国际化做得对

• react-aria-modal - 一个完全可访问的React模态

• react-hotkeys - React的声明性热键和焦点区域管理

• react-keydown - React组件的轻量级keydown包装器

• react-joyride - 为您的应用创建导游

• react-virtualized - 用于有效渲染大型列表和表格数据的React组件

• react-window - 用于有效渲染大型列表和表格数据的React组件

• react-text-mask - React的输入掩码

• react-loading-skeleton - 创建自动适应您的应用程序的骨架屏幕

• react-spinkit - 使用CSS为React设置动画的加载指示符集合

• rheostat - 使用React构建的可访问滑块组件

• qrcode.react - 用于React的QR组件

做出React 命令行

• ink - 对交互式命令行应用程序进行React

• react-blessed - 用于祝福终端接口库的React渲染器

React测试

• jest - 令人愉快的JavaScript测试框架

• enzyme - 针对React的JavaScript测试实用程序

• react-testing-library - 简单而完整的React DOM测试实用程序

• react-hooks-testing-library - React挂钩测试实用程序，鼓励良好的测试实践

React库

• react-border-wrapper - 用于在React中沿div边界放置元素的包装器。

• react-magic - 利用React的强大功能自动AJAXify纯HTML

• react-toolbox - 一组实现Google Material Design规范的React组件

• tcomb-react - 允许您检查React组件的所有道具的库

• react-responsive - 媒体查询响应响应式设计

• react-is-responsive - 一种在React中创建响应组件的实用程序

• react-cursor - 用于Facebook React的功能状态管理抽象

• Omniscient.js - 抽象React组件，用于快速自上而下渲染不可变数据

• Touchstonejs - React.js支持的UI框架，用于开发漂亮的混合移动应用程序。

• Elemental - React.js网站和应用程序的UI工具包

• StateTrooper - 使用CSP集中管理React应用程序的状态

• Preact：使用相同的ES6 API快速3kb React替代方案。

• riotjs - 一个类似React的3.5KB用户界面库

• Maple.js - 将Web组件的概念引入React

• react-i13n - 一种高性能，可扩展且可插拔的方法，用于检测React应用程序

• react-icons - svgReact流行图标包的图标

• Keo - Plain用于创建React组件的功能更强大的Deku方法，具有管道，memoize等功能性好处......

• Bit - 用于跨应用程序管理和使用React和其他Web组件的虚拟存储库

• AtlasKit - Atlassian的React UI库

• ReactiveSearch - Elasticsearch的UI组件库

• Slate - 用于构建富文本编辑器的完全可自定义的框架。

• react-animated-transitions - React中的简单动画过渡

• react-json-schema - 通过将JSON定义映射到您公开的React组件，构造来自JSON的React元素。

• compose-state - 在React中编写多个setState或getDerivedStateFromProps更新程序

• react-with-analytics - 轻松实现Google Analytics for React应用程序

• react-cache-me-outside - React应用程序的OTA数据更新。如何弓数据！

• PrimeReact - React最完整的UI框架！

• react-lodash - Lodash作为React组件

• react-helmet - React的文档主管

• Stator - 简单，简单的JavaScript状态管理，内置支持React

• ClearX - 快速，轻松的React状态管理，零学习曲线。ClearX为您的React应用程序分离关注点提供了极大的灵活性

• react-snap - 针对SPA的零配置框架无关的静态预渲染

• Draft.js - 用于构建文本编辑器的React框架

• refract - 利用React式编程的强大功能为组件增压

• react-desktop - 使用React构建的OS X和Windows UI组件

• Reapop - React和Redux通知系统

• react-extras - 使用React的有用组件和实用程序

• react-instantsearch - Algolia快速搜索React和React Native应用程序

• uppy - Web浏览器的下一个开源文件上传器

• react-motion - 解决动画问题的弹簧

• react-esi - React Edge Side包含

React整合

• React Rails

• ReactJS.NET

• React ASP.NET Boilerplate

• React Bootstrap组件游乐场

• om - ClojureScript接口

• quiescent - React上的轻量级ClojureScript抽象

• Reagent - React.js的简约ClojureScript接口

• react-haskell - Haskell的React绑定

• Express React views

• Express Coffee-React视图 - 在服务器上呈现咖啡React

• React页面中间件

• ngReact - Angular中的React组件

• ReactLaravel

• coffee-react-transform - 为Coffeescript提供React JSX支持

• sprockets-coffee-react - CJSX的链轮预处理器

• react-kup - 一个简单的，非侵入性的替代jsx的coffeescript

• turbo-react - 结合Turbolinks和React来应用DOM差异

• react-bacon - 使用React和Bacon.js的一个小模块

• msx - React的JSX Transformer，调整为向Mithril输出调用

• React.withBackbone - React 16 ready骨干绑定

• Backbone React Component

• react-backbone - 用于React的Backbone-aware mixins

• NestedReact - 与Backbone Views和NestedTypes模型的透明集成

• backbone-reaction - React，Backbone然后一些

• react.backbone - React插件使Backbone迁移更容易

• reactbone - Backbone的React扩展

• backbone-react-ui - 用于骨干和骨干分离器的React组件

• react-events - React组件的声明性托管事件绑定

• react-mixin-manager - React mixin注册管理器

• gsap-react-plugin - 用于补间React.js组件状态的GSAP插件

• @plaxdan的react-topcoat - 使用React库构建的Topcoat CSS组件

• @arnemart的React面漆 - 面漆的React成分集合

• reactdown - 使用markdown语法编写React组件

• react-jade - 编译Jade以ReactJavaScript

• jade-react - 将Jade模板编译为React.DOM表达式

• gulp-jade-react - 将Jade模板编译成React脱糖JSX和Gulp

• sbt-reactjs - 使用npmReactSBT插件

• scalajs-react - Scala.js和Facebook的React之间的内疚

• react-xtags - 使用React实现xtags

• jreact - 在服务器端Java上React（使用Rhino或Nashorn）

• React.hiccup - 用sweet.js编写的JSX的完全替代品

• react-play - 使用JDK8的Nashorn渲染Play框架中的React组件

• rx-react - 在RxJS中与React一起使用的实用程序

• react-with-di - 一个被反射的React.js原型

• reactfire - ReactJS mixin，可轻松实现Firebase集成

• firedux - ReactJS的Firebase + Redux

• react-clickdrag-mixin - ClickDrag mixin for React组件

• Rewrite the Admin UI of KeystoneJS in React

• react-masonry-mixin - 用于砌体的独立混合物（@desandro）

• react-packery-mixin - 独立混合用于Packery（Metafizzy）

• react-dropzone - 带有React.js的简单HTML5拖放区域。

• aframe-react - A-Frame VR + React

• react-three - 使用three.js创建和控制3D场景的React绑定

• react-three-renderer - 使用React渲染到three.js画布中

• react-threejs - React和Three.js之间最简单的绑定

• react-masonry-css - 由CSS驱动的快速砌体布局，无依赖性

• react-captcha - 针对Google的react.js reCAPTCHA

• reaptcha - 用于Google reCAPTCHA的干净，现代且简单的React包装器

• react-recaptcha-that-works - React的reCAPTCHA桥

Form

• React Forms

• react-formal - 为React提供更好的表单验证和价值管理，提供最少的布线

• react-forms - React的表单库

• valuelink - 具有扩展React链接的全功能双向数据绑定

• wingspan-forms - Facebook React的动态表单库

• newforms - React的同构形式处理

• formjs - Reactjs的表单生成器

• react-form-builder - React.js的表单生成器

• plexus-form - 使用JSON-Schema进行React的动态表单组件

• tcomb-form - 用于开发表单编写较少代码的UI库

• formsy-react - React JS的表单输入构建器和验证器

• Learn Raw React: Ridiculously Simple Forms

• Winterfell - 在React中生成复杂，经过验证和扩展的基于JSON的表单

• Redux-Autoform - 从元数据中动态创建Redux-Forms

• uniforms - 一堆React组件和帮助器，可以轻松生成和验证表单

• formik - React中的表单，没有眼泪

• NeoForm - 用于表单状态管理和验证的模块化HOC

• react-jsonschema-form - 用于从JSON Schema构建Web表单的React组件

• List View Select - 具有本机组件的React Native的Toggleable选择框

• Final Form

• formland - 一个简单，超灵活，可扩展的基于配置的表单生成器

• React - React形式 - React中的角状React形式

• unform - ReactJS表单库，用于创建不受控制的表单结构，包含嵌套字段，验证等等！

自动完成

• @rackt的React自动完成 - 符合WAI-ARIA的React自动完成功能

• react @ autosuggest由@moroshko提供 - 符合WAI-ARIA标准的React autosuggest组件

• @ eliseumds的React自动完成 - 只需品尝一些ReactJS + RxJS

• @prometheusresearch的react-autocomplete - 基于React的自动完成小部件

• instaleype by @gragland - 简单React自动完成组件

• downshift - 构建简单，灵活，符合WAI-ARIA标准的增强型输入React组件的原语

• React Bootstrap Typeahead - 基于React的typeahead，依赖于Bootstrap进行样式化，最初受到Twitter的typeahead.js的启发。

Graphics

• react-art - 反映ART绘图库的桥梁

• react-canvas - React组件的高性能渲染

• react-famous - 使用Famo.us以60 FPS的复杂3D动画UI

• react-kinetic - HTML5 Canvas通过KineticJS使用React

• react-svg-morph - 将你的svg组件变为另一个

• react-hooks-svgdrawing - 使用React钩子绘制SVG

模型库

• mori - ClojureScript的持久数据结构和支持API

• NestedTypes - 具有“纯渲染”支持的快速可变模型

• swarm - JavaScript复制模型（MVC的M）库

• caplet - JavaScript模型库

数据管理

• Immutable.js - Javascript的不可变数据集合

• cortex - 用于使用React集中管理数据的JavaScript库

• avers - 一个现代客户端模型抽象库

• imvvm - React的不可变模型 - 视图 - 视图模型

• morearty.js - 在纯JavaScript中更好地管理React

• valuable - React的不可变数据存储

• react-resolver - 用于React组件的递归延迟加载数据的同构库

• freezer-js - React的轻量级和React式不可变数据结构

• MobX - 简单，可扩展的状态管理

• Qaf - 作为商店的组件。基于上下文的React的简单状态管理

• baobab - 带有游标的JavaScript持久性和可选的不可变数据树

• baobab-react - 为Baobab进行React整合

• datascript - ClojureScript中的不可变数据库和Datalog查询引擎

• immstruct - 不可变数据结构，具有基于组件的库（如React）中从上到下属性的历史记录

• seamless-immutable - JavaScript的不可变数据结构，它与普通的JS Arrays和Objects向后兼容

• tydel - 使用React绑定的类型模型和集合

• extendedable-immutable - 扩展任何Immutable.js数据结构

• statty - React和Preact应用程序的一个微小且不显眼的状态管理库

• Hydux - React的Elm-Like州经理，“包括电池”

• ReSub - 用于编写更好的React组件和数据存储的库

• ProppyJS - 用于功能道具组合的小型库

• WatermelonDB - 下一代数据库，用于强大的React和React Native应用程序，可扩展到10,000个记录并保持快速

• Effector - 快速而强大的无功状态管理器。允许您编写简单，快速且类型安全的代码并轻松管理React状态。

• reactn - React，但内置全局状态管理

• immer - 通过改变当前状态来创建下一个不可变状态

地图

• react-googlemaps - 反映Google地图的界面

• react-maps - React的映射组件

• react-google-maps - React.js Google Maps集成组件

• react-gmaps - React.js的Google Maps组件

• react-map-gl - MapboxGL-js加上覆盖API的React包装器

• google-map-react - Isomorphic google map React组件

• react-mapbox-gl - 一个mapbox-gl-js包装器，使APIReact友好

• google-maps-react - 使用React，延迟加载依赖项，当前位置查找器和Fullstack React团队的测试驱动方法的声明式Google Map React组件。

• react-leaflet - 用于Leaflet映射的React组件

• react-geo - 使用react，antd和ol的一组与地理相关的组件

• pigeon-maps - 没有外部依赖关系的ReactJS映射

图表

• DevExtreme React Chart - 基于高性能插件的Bootstrap和Material Design的React图表

• react-chartjs - 使用chart.js的常见React图表组件

• react-stockcharts - 具有ReactJS和d3的高度可定制的股票图表

• Number Picture - 使用React和D3构建动画可视化的低级构建块。

• Victory - 用于构建交互式数据可视化的可组合React组件的集合

• Recharts - 一个基于D3的图表库，带有一个很棒的声明式API

• React-ApexCharts - ApexCharts的React组件（交互式SVG图表库）

• reaviz - 基于D3.js的React数据可视化库

• react-vis - 一个React可视化库，其设计考虑了以下原则：React友好，高级和可定制，富有表现力和行业强大。

• nivo - 它提供了丰富的数据可视化组件，构建在D3和React库之上。

• vx - 可重用的低级可视化组件的集合。它结合了D3的强大功能，可以利用React的优势生成可视化，以更新DOM。

• echarts-for-react - 一个非常简单的ECharts React包装器。

• Chartify - 使用CSS构建图表的React插件。

• Semiotic - 结合了React和D3的数据可视化框架。

React原生

使用React构建本机应用程序的框架

• React本机常规资源

• React原生官方网站

• React Native GitHub

• React原生通讯

• React本机游乐场

• React Native Awesome List

• React Native StackOverflow

• React原生无线电

React原生教程

• React Native Tutorial

• 介绍React Native：使用JavaScript构建应用程序

• React Native简介：使用JavaScript构建iOS应用程序

• React Native符合异步函数

• React Native中的手势检测 - 修复意外的平移

• Digital Smart Mirror lab with React Native

• React Native的美丽：使用JavaScript构建您的第一个iOS应用程序（第1部分）

• React Native的美丽：使用JavaScript构建您的第一个iOS应用程序（第2部分）

• React Native Flexbox上的迷你课程

• Flexbox完整指南

• Test driving react native applications

• 在TypeScript中使用React Native

React原生开发工具

• react-native-code-push - 用于CodePush的React Native模块

React原生样本应用程序

• HackerNews

• Ziliun

• FinanceReactNative

• SplashWalls

• NBAreact

React Native Boilerplates

• 创建React Native App - 在没有构建配置的任何操作系统上创建React Native应用程序，包含或不包含Expo

• Snowflake - 使用Redux，Parse.com，Jest（88％覆盖率）React原生iOS和Android

• Ignite - React Native，样板，插件，生成器等最热门的CLI！

• React Native Starter Kit - 一个强大的入门项目，用于引导您的移动应用程序的开发

React Native Awesome Components

• Expo - 用于制作跨平台移动应用程序的世博会平台

• react-navigation - React Native应用程序的路由和导航

• react-native-social-share - 使用React Native的iOS和Android原生Twitter和Facebook共享弹出窗口

• react-native-fbsdk - 围绕iOS Facebook SDK的包装器

• react-native-side-menu - 用于创建侧边菜单的简单可自定义组件

• react-native-mapbox-gl - Mapbox GL对原生模块做出React

• react-native-icons - React Native中的快速简单图标

• react-native-vector-icons - 用于React Native的3000个可自定义图标，支持NavBar / TabBar

• react-native-google-signin - Google Signin for React Native

• React天然选取器模态视

ReactAR / VR

React用于增强和虚拟现实的用法

• React 360 - 使用React创建令人兴奋的360和VR体验

• Viro React - 使用React Native快速构建AR / VR应用程序的平台

ReasonReact

ReactJS的原因绑定

• ReasonReact官方网站

Flux

用于构建用户界面的应用程序架构

Flux一般资源

• Flux官方网站

• Flux GitHub

Flux实现

• Flux Comparision

• RefluxJS

• Fluxxor

• Marty

• McFly

• Alt

• Fluxible

• NuclearJS

• Flummox

• Coflux

• MobX

• Sinux

Flux教程

• 使用React和Flux构建应用程序

• Flux：构建客户端应用程序的简单架构模型

• 使用来自Yahoo的Dispatchr和Fetchr的Isomorphic Flux示例

• 使用React.js和Flux进行异步请求

• 在CoffeeScript中实现Flux

• React：Flux Architecture

• 了解Flux

• 在Flux中哟

• React.js架构 - Flux VS Reflux

• 避免单页应用程序中的事件链

• ReactJS和Flux

• 解构ReactJS的流量

• Flux一步一步

• 实践中的流量

• 什么是Flux应用程序架构？

• React + Flux由Rails API支持：第1部分

• Reails + Flux由Rails API支持：第2部分

• Reails + Flux由Rails API支持：第3部分

• Flux解决方案通过实例比较

• Flux Cargo-Culting

• 通量案例

• Flux框架的演变

• 通过示例与Flux作出React - 解析了一个简单的Todo List

• 从入门到放弃！- 初学者教程

• 使用React和Nuclear JS的简单计数器应用程序

• LearnCode.academy Flux教程系列

Redux

JavaScript应用程序的可预测状态容器

Redux通用资源

• Redux GitHub

• Redux官方网站

• 很棒的Redux列表

Redux工具

• react-redux - Redux的官方React绑定

• redux-devtools - Redux的DevTools，具有热重新加载，动作重放和可自定义的UI

• react-router-redux - 保持react-router和redux同步的绑定

• redux-form - 使用react-redux保持形状状态的高阶组件

• redux-thunk - 用于redux的Thunk中间件

• redux-logger - 用于redux的Logger中间件

• reselect - Redux的选择器库

• normalizr - 根据模式规范化嵌套JSON

• redux-saga - Redux应用程序的另一种副作用模型

• redux-data-fx - Redux的声明性副作用

• redux-observable - Redux的RxJS中间件

• redux-analytics - Redux的分析中间件

• redux-undo - 用于向redux状态容器添加撤消/重做功能的高阶减少器

• redux-search - 用于客户端搜索的Redux绑定

• redux-mock-store - 用于测试redux异步动作创建器和中间件的模拟存储

• redux-immutable - 创建一个与Immutable.js状态一起使用的Redux combineReducers的等效函数

• redux-react-i18n - 用于还原/React的i18n溶液

• R16N - 还原/ReactI18n溶液

• redux-actiontyper - Helper为Redux创建更简洁的动作类型

• redux-state-validator - 一个简单的redux中间件，用于使用JSON Schema验证redux状态值和对象类型

• redux-persist - 坚持并补充redux商店

Redux教程

• 在ES6中使用React和Redux构建应用程序

• Redux入门

• 使用惯用Redux构建React应用程序

• Redux教程

• React，Redux和Immutable入门：测试驱动的教程：第1部分

• React，Redux和Immutable入门：测试驱动的教程：第2部分

• 全栈Redux教程

• 使用Redux和React-Router进行服务器端渲染

• Redux深度介绍

• 单元测试Redux应用程序

• 使用JWT身份验证保护您的React和Redux应用程序

• 使用React，Redux和redux-saga构建图像库

• 使用redux调用API的简化方法

• 基于React Redux的献血者演示应用程序

• LearnCode.academy Redux教程系列

• 实用的Redux

• 初学者的完整React Redux教程

MobX

JavaScript应用程序的简单，可扩展状态管理

MobX通用资源

• MobX GitHub

• MobX官方网站

MobX工具

• mobx-react - React组件包装器，用于将React与MobX结合使用

MobX教程

• 10分钟介绍MobX和React

• 使用MobX管理React应用程序中的复杂状态

• 将您的应用程序从Redux重构为MobX

• Redux或MobX：尝试解散混乱

GraphQL

查询语言

GraphQL规范

• GraphQL官方网站

• GraphQL规范

• GraphQL规范库

GraphQL工具

• GraphCMS - GraphQL无头CMS

• GraphQL CMS

• Mongoose模式到GraphQL

• GraphQL桥接到REST API

• GraphQL Playground - GraphQL IDE，用于更好的开发工作流程

GraphQL教程

• GraphQL简介

• 关于GraphQL的第一个想法

• 以类似的方式在GraphQL中建模查询

• Thin and Graphy

• GraphQL概述 - GraphQL和Node.js入门

• 使用GraphQL编写基本API

• 使用Node.js和SQL构建GraphQL服务器

• GraphQL Tour：变量

• 如何Graphql - GraphQL的Fullstack教程

GraphQL实现

• graphql-js - GraphQL for JavaScript的参考实现

• react-transmit - 基于JavaScript Promises的Relay-inspired库

• graphql-ruby - Facebook的GraphQL的Ruby实现

• graphql-java - GraphQL Java实现

• sangria - Scala GraphQL客户端和服务器库

• graphql-php - GraphQL参考实现的PHP端口

• graphene - Python中的GraphQL变得简单

• graphqllib - Python的GraphQL实现

• graphql-dotnet - 用于.NET的GraphQL

• graphql-go - Go / Golang的GraphQL

服务器集成

• express-graphql - 使用Express创建GraphQL HTTP服务器

• graphql-yoga - 运行GraphQL服务器的最简单方法

数据库集成

• Hasura - Postgres上的即时实时GraphQL

• Prisma - 一个高性能的开源GraphQL ORM-like层，可以在GraphQL服务器中完成繁重的任务。

• graphql-bookshelf - 一些帮助定义BookshelfJS模型周围的GraphQL架构

• GraphpostgresQL - PostgreSQL的GraphQL

• graffiti - Node.js GraphQL ORM

• sql-to-graphql - 根据您的SQL数据库结构生成GraphQL API

• graphql-sequelize - 通过Sequelize实现MySQL和Postgres的GraphQL和Relay

Relay

数据驱动的React应用程序

Relay一般资源

• 接力官方网站

• 接力GitHub

Relay教程

• 官方接力入门

• 视觉学习者的接力

• Getting Started with Relay

• Relay and Routing

Relay工具

• graphql-relay-js - 一个帮助构建支持react-relay的graphql-js服务器的库

• react-router-relay - React Router的中继集成

• relay-local-schema - 在没有GraphQL服务器的情况下使用Relay

• relay-codemod - 基于jsodeshift的Codemod脚本，用于更新中继API

Apollo

基于GraphQL的数据堆栈

阿波罗综合资源

• 阿波罗官方网站

• Apollo GitHub

• 阿波罗博客

• Apollo Slack

Apollo工具

• react-apollo-redux - 一个小包装器，用于响应阿波罗突变自动发送动作

影片

• reactjsvideos.com

重要会谈

• Pete Hunt：React：重新思考最佳实践 - JSConf EU 2013

• Pete Hunt：React：重新思考最佳实践（更新） - JSConf.Asia 2013

• Tom Occhino和Jordan Walke：Facebook上的JS应用程序 - JSConfUS 2013

• React：JS中的CSS

• Pete Hunt：可预测，不正确 - Mountain West JavaScript 2014

• 黑客方式：重新思考Facebook上的Web应用程序开发

• Christopher Chedeau：为什么React Scale？- JSConf2014

• Christopher Chedeau：React的架构 - OSCON 2014

• Pete Hunt：ReactRESTful UI渲染 - 奇怪的循环2014

• Pete Hunt：Instagram.com如何运作 - OSCON 2014

• Bill Fisher和Jing Chen：React和Flux - NewCircle Training 2014

• Sebastian Markbage：最小的API表面积 - JSConf EU 2014

• Avik Chaudhuri：规模的JavaScript测试和静态类型系统 - 规模2014

• React Native＆Relay：为移动设备带来现代网络技术 - f8 2015）

• Citrusbyte推出GraphQL：与Nick Schrock合作的横向平台

• Laney Kuenzel：接力中的突变和订阅 - JSConf 2015

• React今天和明天和90％清洁React与钩子 - React Conf 2018

• React会议

• React视频

• 令人敬畏的React会谈

• React.js Conf 2015播放列表

• ReactEurope Conf 2015第1天播放列表

• ReactEurope Conf 2015第2天播放列表

• ReactRally Conf 2015播放列表

• React.js Conf 2016播放列表

• React Amsterdam 2016播放列表

• ReactEurope Conf 2016第1天播放列表

• ReactEurope Conf 2016第2天播放列表

• ReactRally Conf 2016播放列表

• React.js Amsterdam 2018播放列表

视频教程

• 第一次和Dan Abramov一起尝试React Hooks

演示

• React和React原住民博物馆

• react.rocks - 具有可用代码的Pinterest风格的在线演示目录

• react-hn - 一个React＆react-router-powered of Hacker News

• react-pokemon - 用于显示神奇宝贝的React组件

• React + Backbone TodoMVC

• React + NestedTypes TodoMVC

• react-rxjs-todomvc - 使用React和RxJS实现TodoMVC

• react-mvc - 用React和纯MVC编写的示例聊天应用程序

• react-observe-todomvc - 在React和Object.observe之上构建的TodoMVC实现

• react-lights-out - React框架功能和灵活性的简单演示

• todomvc-swarm - 使用Swarm进行实时协作的React TodoMVC实现

• reactodo - 使用React构建的多个localStorage TODO列表

• lifequote - 人寿保险快速报价申请的React端口

• reactor-demo - 使用React的同构Javascript应用程序

• imgible - 基于React的Imgur-like同构演示应用程序

• wow-realm-status-react - React - 魔兽世界状态：React版

• react-json-editor - 一个通用的JSON编辑器

• react-todos - Backbone的示例TODO应用程序与React JS的视图

• github-issues-viewer - github在react + backbone中发出查看器构建

• wolfenstein3D-react - Wolfenstein用React编写的渲染层

• Flux ImmutableJS TodoList

• Hapi + React + Flux用户管理系统

• Redux TodoMVC

• React / Redux CRUD在本地存储中具有持久状态

• React Slack克隆 - 使用React和Chatkit构建的综合Slack克隆

• React颜色漂移 - 与React的生成艺术

• overreacted.io - Dan Abramov的个人博客

示例应用

• isomorphic500 - 使用React和Fluxible构建的同构JS应用程序

• fil - 浏览器中解释器的游乐场（Redux）

• sound-redux - 使用React / Redux构建的Soundcloud客户端

• react-pomodoro - 开发人员的番茄钟计时器

• Do - 使用React和Redux构建的Notes管理应用程序

• soundcloud-react-redux - 使用React / Redux构建的SoundCloud客户端

• soundcloud-react-mobx - 使用React / MobX构建的SoundCloud客户端

• 用React和Redux重新实现Winamp 2.9

• ComingOrNot - 使用react，react-router，redux，graphQL和无服务器构建的Event Planner

• React Reduction - 使用React + Bootstrap4构建的Admin Dashboard

• React Code Splitting Sample - React + React Router + Flux

• 响应式React'电影数据库'（TMDb）应用程序

• CoreUI - 使用React和Bootstrap 4构建的免费管理面板

• react-shopping-cart - 使用React和Redux构建的简单电子商务购物车应用程序

• hackernews-react-graphql - 使用React和GraphQL用通用JavaScript重写的黑客新闻克隆

真正的应用

• Firefox调试器

• 远程复古 - 分布式团队的敏捷回顾

• Spectrum - 简单，强大的在线社区

• Mattermost - 开源Slack替代品

讨论:请加入知识星球【首席架构师圈】

原文：【首席架构师推荐】关于React生态系统的一系列精选资源 | 首席架构师(全网同号:超级架构师）