awesome-react

Awesome React

關於 React 生態系統的一系列很棒的東西。

• [反應]（#反應）

  • 反應通用資源

  • 反應社區

  • 反應在線遊樂場

  • React 教程

    • React 通用教程

    • 反應掛鉤

    • React 和 TypeScript

    • 反應性能

    • 反應內部

    • 反應面試問題

  • 反應工具

    • React 開發工具

    • 反應框架

    • 反應樣式

    • 反應路由

    • React 組件庫

    • React Awesome 組件

    • 反應測試

    • 反應庫

    • 反應集成

    • 反應狀態管理

    • 反應 AR 和 VR

    • 反應渲染器

    • 表格

    • 自動完成

    • 圖形

    • 數據管理

    • 地圖

    • 圖表

• 反應原生

  • React Native 通用資源

  • React Native 教程

  • React Native 開發工具

  • React Native 示例應用程序

  • React Native Boilerplates

  • React Native Awesome 組件

  • 反應原生庫

• Redux

  • Redux 通用資源

  • Redux 工具

  • Redux 教程

• GraphQL

  • GraphQL 通用資源

  • GraphQL 工具

  • GraphQL 教程

  • GraphQL 實現

  • 數據庫集成

• 中繼

  • 中繼通用資源

  • 繼電器教程

  • 中繼工具

• 視頻

  • 重要會談

  • React.js Conf 2015 播放列表

  • ReactEurope Conf 2015 第 1 天播放列表

  • ReactEurope Conf 2015 第 2 天播放列表

  • ReactRally Conf 2015 播放列表

  • React.js Conf 2016 播放列表

  • ReactRally Conf 2016 播放列表

  • React.js 阿姆斯特丹 2018 播放列表

  • 視頻教程

• 演示 React 應用程序

• Real React 應用程序

• 貢獻

---

反應

用於構建用戶界面的 JavaScript 庫

React 通用資源

• React 官網
• 反應文檔
• 反應 GitHub

反應社區

• Reactiflux Discord 頻道
• 反應 StackOverflow
• 反應推特

React 在線遊樂場

• CodePen
• CodeSandbox
• JSFiddle

另一個很棒的列表

• React/Redux 鏈接

React 教程

React 通用教程

• React 官方教程
• 在 Visual Studio Code 中使用 React
• Scrimba - 免費交互式學習 React
• FreeCodeCamp React 挑戰
• 反應備忘單
• 反應模式
• 使用 React 設置流程

反應鉤子

• 反應掛鉤
• Awesome React Hooks
• 在 React Hooks 中思考
• 用 React Hooks 和上下文替換 Redux
• React Hooks 備忘單：解鎖常見問題的解決方案
• 如何使用 React Hooks 獲取數據？
• 簡單易懂的 React Hook 食譜
• React Hooks 視頻教程

React 和 TypeScript

• TypeScript、React 和 Webpack
• TypeScript 中的 JSX
• 為經驗豐富的 React 開發人員提供 TypeScript 入門的備忘單
• React by Example

反應性能

• React 優化性能
• 介紹 React Profiler
• 優化 React：虛擬 DOM 解釋
• 優化 React 主要性能問題的權威指南
• 大規模的 Twitter Lite 和高性能 React 漸進式 Web 應用程序
• [使用 React DevTools Profiler 診斷 React App 性能問題](https://www.netlify.com/blog/2018/08/29/using-the-react-devtools-profiler-to-diagnose-react-app -性能問題/）

• 提高 React 性能的 5 大實踐
• React 很慢，React 很快：在實踐中優化 react 應用程序
• 使用 react-window 渲染大型列表

反應內部

• 和解
• React Fiber 架構
• 構建自己的 React
• Inside Fiber：React 中新的對賬算法深入概述
• 通過可視化塊方案解釋整個 React 代碼庫

React 面試問題

• 13 個基本 React 面試問題
• React 面試問答列表
• React 編碼挑戰

反應工具

React 開發工具

• react-devtools - 在 Chrome 和 Firefox 開發者工具中檢查 React 組件層次結構
• react-hot-loader - 實時調整 React 組件
• react-loadable - 用於加載帶有 Promise 的組件的高階組件
• loadable-components - React 代碼拆分變得容易
• reactotron - 用於檢查 React 和 React Native 項目的桌面應用程序
• storybook - UI 組件開發和測試
• docz - 零配置，使用 Markdown + JSX 實時重新加載文檔
• react-styleguidist - 獨立的React組件開發環境，帶有生活方式指南
• react-cosmos - 用於創建可重用 React 組件的開發工具
• eslint-plugin-react - 為 ESLint 反應特定的 linting 規則
• eslint-plugin-jsx-a11y - JSX 元素上 a11y 規則的靜態 AST 檢查器
• @axe-core/react - React 應用程序的可訪問性審計
• DataFormsJS JSX 加載器 - 用於在網頁上直接將 JSX 快速轉換為 JS 的小型 JavaScript 編譯器
• 你為什麼渲染 - 猴子補丁 React 通知你可避免的重新渲染。
• Divjoy - React 代碼庫和 UI 生成器以加快開發速度（付費）
• Plasmic - 用於可視化構建 React 組件的強大設計工具。
• jsx-ast-utils - 用於靜態分析 JSX 的 AST 實用程序模塊
• react-scanner - 從代碼中提取 React 組件和 props 使用

React 入門套件和工具鏈

• create-react-app - 通過運行一個命令設置現代 Web 應用程序
• Razzle - 構建生產就緒的 React 應用程序。Razzle 是現代靜態和動態網站和 Web 應用程序的工具鏈
• Neutrino React Preset - @neutrinojs/react 是一個支持構建 React Web 應用程序的 Neutrino 預設
• react-starter-kit - 同構 Web 應用程序樣板
• create-react-library - 使用 Rollup 和 create-react-app 創建可重用的現代 React 庫的 CLI。
• tsdx - 用於 TypeScript 包開發的零配置 CLI

反應框架

• next.js - React 框架
• gatsby.js - 基於 React 的免費開源框架
• react-admin - 用於在 REST/GraphQL API 之上構建 B2B 應用程序的前端框架
• remix - 最後，來自 React Router 創建者的殺手級 React 框架
• Blitz - 全棧 React 框架
• aleph.js - Deno 中的 React 框架
• refine - 一個基於 React 的框架，用於立即構建數據密集型應用程序。

反應樣式

• styled-components - 組件時代的視覺原語
• emotion - 專為使用 JavaScript 編寫 CSS 樣式而設計的庫
• radium - React 組件樣式的工具鏈
• jss - CSS 創作工具
• aphrodite - 與框架無關的 CSS-in-JS，支持服務器端渲染、瀏覽器前綴和最小 CSS 生成
• linaria - JS 中的零運行時 CSS
• stitches - CSS-in-JS 具有接近於零的運行時、SSR、多變量支持和一流的開發人員體驗
• vanilla-extract - 零運行時 Stylesheets-in-TypeScript

反應路由

• react-location - React 的企業客戶端路由
• react-router - React 的聲明式路由
• navi - React 的聲明式異步路由
• curi - 用於單頁應用程序的 JavaScript 路由器
• reach - React 的下一代路由
• universal-router - 用於同構 JavaScript Web 應用程序的簡單中間件式路由器
• wouter - 一個極簡友好的~1.3KB 路由庫

React 組件庫

• material-ui - React 組件用於更快、更輕鬆的 Web 開發
• blueprint - 一個基於 React 的網絡 UI 工具包
• Fluent UI - 一組用於構建 Microsoft Web 體驗的 React 組件
• react-bootstrap - 使用 React 構建的引導組件
• reactstrap - 簡單的 React Bootstrap 4 組件
• ant-design - 一個具有自然和確定性價值觀的設計系統
• chakra-ui - 適用於您的 React 應用程序的簡單、模塊化和可訪問的 UI 組件
• semantic-ui-react - 官方 Semantic-UI-React 集成
• evergreen - Evergreen React UI Framework by Segment
• grommet - 一個基於 react 的框架，在一個整潔的包中提供可訪問性、模塊化、響應性和主題
• rebass - React 使用 styled-system 構建的原始 UI 組件
• reakit - React 的可訪問、可組合和可定制的組件
• rsuite - 一套 React 組件
• atlaskit - Atlassian 的官方 UI 庫，根據 Atlassian 設計指南構建。
• baseweb - Base Web 是啟動、發展和統一網絡產品的基礎。
• primereact - 一個完整的 React UI 框架，包含 50 多個組件，包括材料、引導程序和自定義主題。
• eui - 彈性 UI 框架
• react-spectrum - Adob​​e 的庫和工具集合，可幫助您構建自適應、可訪問和強大的用戶體驗
• ring-ui - JetBrains Web UI 組件
• react-bulma-components - Bulma 框架的 React 組件
• react-bulma - 基於 Flexbox 的現代 CSS 框架的 React.js 組件
• trunx - Super Saiyan React 組件，Bulma 之子，用 TypeScript 實現
• bumbag-ui - 使用您的 Bumbag 構建可訪問且可主題化的 React 應用程序
• Mantine – 一個功能齊全的 React 庫，包含 100 多個鉤子和組件，支持原生深色主題
• radix - 一個開源 UI 組件庫，用於構建高質量、可訪問的設計系統和 Web 應用程序

React 很棒的組件

• Awesome React 組件列表
• react-select - React 的選擇組件
• react-beautiful-dnd - 漂亮且易於使用的 React 列表拖放
• react-dnd - React 的拖放
• react-grid-layout - 具有響應斷點的可拖動和可調整大小的網格佈局
• react-table - 用於 React 的輕量級、快速且可擴展的數據網格
• react-data-grid - 使用 React 構建的類似 Excel 的網格組件
• react-draggable - React 可拖動組件
• react-resizable-and-movable - React 的可調整大小和可拖動組件
• react-resizable - 一個簡單的 React 組件，可通過句柄調整大小
• react-resizable-box - React 的可調整大小組件
• react-searchbox-awesome - 簡約的搜索框
• react-sortable-pane - React 的可排序和可調整大小的窗格組件
• react-spaces - 可調整大小、錨定、可滾動的嵌套組件
• react-dates - 一個易於國際化、移動友好的網絡日期選擇器庫
• react-big-calendar - 日曆組件
• react-datepicker - ReactJS Datepicker
• react-list - 一個多功能的無限滾動 React 組件
• react-intl - 國際化 React 應用程序
• react-i18next - 正確完成 React 的國際化
• react-aria-modal - 一個完全可訪問的 React modal
• react-hotkeys - React 的聲明式熱鍵和焦點區域管理
• react-keydown - React 組件的輕量級 keydown 包裝器
• react-joyride - 為您的應用創建導覽
• react-virtualized - 用於高效渲染大型列表和表格數據的 React 組件
• react-window - 用於高效渲染大型列表和表格數據的 React 組件
• 數據源 - 為 Facebook 的 Flipper 中使用的流數據可視化提供動力的庫
• react-text-mask - React 的輸入掩碼
• react-loading-skeleton - 創建自動適應您的應用程序的骨架屏幕
• react-spinkit - 使用 CSS 為 React 設置動畫的加載指示器集合
• rheostat - 使用 React 構建的可訪問滑塊組件
• qrcode.react - 用於 React 的 QR 組件
• react-archer - 在 React 元素之間繪製箭頭
• react-pdf-viewer - 為 React 製作的 PDF 查看器
• react-parallax-tilt - 在 React 組件上輕鬆應用傾斜懸停效果
• react-popper - 以優雅、高效的方式定位工具提示和彈出框
• react-tsparticles - 輕鬆創建高度可定制的粒子動畫
• react-spring - 基於 Spring-physics 的 React 應用程序動畫庫
• framer-motion - 一個 React 庫，用於為生產就緒的動畫提供動力
• react-accessible-accordion - 用於創建符合 WAI ARIA 可訪問性規範的“手風琴”的 React 組件。
• react-truncate-markup - 用於截斷 JSX 標記的 React 組件。
• react-cookie - React 的通用 cookie
• react-slick - 使用 React 構建的輪播組件
• react-gtm-module - React 的谷歌標籤管理器模塊
• react-device-detect - 為 React 檢測設備
• react-colorful - 一個小巧 (2,5 KB)、無依賴、快速且可訪問的顏色選擇器組件
• react-modal - React 的可訪問模式對話框組件
• cleave.js - 鍵入時格式化輸入文本內容
• react-fontawesome - Font Awesome 5 React 組件
• react-advanced-cropper - 用於圖像裁剪的高級 React 組件
• swiper - 現代移動觸摸滑塊

反應測試

• jest - 令人愉快的 JavaScript 測試框架
• enzyme - React 的 JavaScript 測試工具
• react-testing-library - 簡單而完整的 React DOM 測試工具
• react-hooks-testing-library - 鼓勵良好測試實踐的 React hooks 測試實用程序
• majestic - Jest 的零配置 GUI

反應庫

• react-border-wrapper - 在 React 中沿 div 邊界放置元素的包裝器。
• react-magic - 使用 React 的強大功能自動 AJAXify 純 HTML
• react-toolbox - 一組實現 Google 的 Material Design 規範的 React 組件
• tcomb-react - 允許您檢查 React 組件的所有道具的庫
• react-responsive - 響應式設計中的媒體查詢
• preact - 具有相同 ES6 API 的快速 3kb React 替代方案。
• riotjs - 一個類似 React 的 3.5KB 用戶界面庫
• Maple.js - 將 Web 組件的概念引入 React
• react-i13n - 一種高性能、可擴展和可插拔的方法來檢測你的 React 應用程序
• react-icons - 流行圖標包的 svg react 圖標
• react-open-doodles - 很棒的免費插圖作為反應組件。
• Keo - 用於創建 React 組件的功能更強大的 Deku 方法的普通函數，具有管道、記憶等功能的好東西...
• Bit - 一個虛擬存儲庫，用於跨應用程序管理和使用 React 和其他 Web 組件
• AtlasKit - Atlassian 的 React UI 庫
• ReactiveSearch - Elasticsearch 的 UI 組件庫
• Slate - 一個完全可定制的框架，用於構建富文本編輯器。
• react-json-schema - 通過將 JSON 定義映射到您公開的 React 組件，從 JSON 構造 React 元素。
• react-lodash - Lodash 作為 React 組件
• react-helmet - React 的文檔主管管理器
• react-snap - SPA 的零配置框架無關靜態預渲染
• Draft.js - 用於構建文本編輯器的 React 框架
• refract - 利用反應式編程的力量來增強你的組件
• react-desktop - 使用 React 構建的 OS X 和 Windows UI 組件
• reapop - 一個簡單且可定制的 React 通知系統
• react-extras - 使用 React 的有用組件和實用程序
• react-instantsearch - 快速搜索 React 和 React Native 應用程序，由 Algolia
• uppy - 下一個用於網絡瀏覽器的開源文件上傳器
• react-motion - 一個解決你動畫問題的彈簧
• react-esi - React Edge Side Includes
• react-aria - Adob​​e 的 React Hooks 庫，為您的設計系統提供可訪問的 UI 原語
• react-uploady - React 的現代文件上傳組件和鉤子。

反應集成

• ReasonReact
• React Rails
• ReactJS.NET
• om - ClojureScript 接口
• Reagent - React.js 的簡約 ClojureScript 接口
• 表達反應視圖
• React 頁面中間件
• ngReact - Angular 中的 React 組件
• coffee-react-transform - 為 Coffeescript 提供 React JSX 支持
• sprockets-coffee-react - CJSX 的 Sprockets 預處理器
• react-kup - 一個簡單、非侵入式的 jsx 替代方案，用於咖啡腳本
• turbo-react - 結合 Turbolinks 和 React 以應用 DOM 差異
• react-bacon - 一個使用 React 和 Bacon.js 的小模塊
• msx - React 的 JSX 轉換器，經過調整以輸出對 Mithril 的調用
• react-backbone - 用於反應的 Backbone-aware mixins
• NestedReact - 與 Backbone 視圖和 NestedTypes 模型的透明集成
• backbone-reaction - React、Backbone 和一些
• react.backbone - React 插件使 Backbone 遷移更容易
• reactbone - Backbone 的 React 擴展
• backbone-react-ui - 用於骨幹網和骨幹網分頁器的 React 組件
• react-events - React 組件的聲明式託管事件綁定
• react-mixin-manager - React mixin 註冊管理器
• react-topcoat by @plaxdan - 使用 React 庫構建的 Topcoat CSS 組件
• react-topcoat by @arnemart - Topcoat 的 React 組件集合
• reactdown - 使用 Markdown 語法編寫 React 組件
• react-jade - 編譯 Jade 以響應 JavaScript
• jade-react - 將 Jade 模板編譯為 React.DOM 表達式
• gulp-jade-react - 使用 Gulp 將 Jade 模板編譯成 React 去糖 JSX
• sbt-reactjs - 使用 npm 反應 SBT 插件
• scalajs-react - Scala.js 和 Facebook 的 React 之間的內疚
• react-xtags - 使用 React 實現 xtags
• jreact - 在服務器端 Java 上反應（使用 Rhino 或 Nashorn）
• React.hiccup - 完全替代用 sweet.js 編寫的 JSX
• react-play - 在 Play Framework 中使用 JDK8 的 Nashorn 渲染 React 組件
• rx-react - 在 RxJS 中使用 React 的實用程序
• react-with-di - 帶有 DI 的 React.js 的黑客原型
• reactfire - ReactJS mixin 用於輕鬆集成 Firebase
• react-clickdrag-mixin - React 組件的 ClickDrag 混合
• react-masonry-mixin - Masonry 的獨立 mixin (@desandro)
• react-packery-mixin - Packery 的獨立 mixin (Metafizzy)
• react-dropzone - 帶有 React.js 的簡單 HTML5 拖放區。
• aframe-react - A-Frame VR + React
• react-three-fiber -threejs (web 和 react-native) 的 react 協調器
• react-three - React 綁定以使用 three.js 創建和控制 3D 場景
• react-three-renderer - 使用 React 渲染成 three.js 畫布
• react-threejs - React 和 Three.js 之間最簡單的綁定
• react-masonry-css - 由 CSS 提供支持的快速砌體佈局，無依賴
• react-captcha - 谷歌的 react.js reCAPTCHA
• reaptcha - Google reCAPTCHA 的干淨、現代和簡單的 React 包裝器
• react-recaptcha-that-works - 適用於 React 的 reCAPTCHA 橋

反應狀態管理

• redux - JavaScript 應用程序的可預測狀態容器
• mobx - 簡單、可擴展的狀態管理
• react-query - 在 React 中獲取、緩存和更新異步數據的鉤子
• flux - 用於構建用戶界面的應用程序架構
• recoil - React 應用的實驗狀態管理庫
• xstate-react - 現代網絡的狀態機和狀態圖
• zustand - 在 React 中承擔狀態管理的必需品
• easy-peasy - React 的素食友好狀態
• hookstate - 基於 hooks 的 React 簡單但非常強大且速度極快的狀態管理
• 效應器 - 快速而強大的反應式狀態管理器
• reactn - React，但具有內置的全局狀態管理
• react-facet - React 內置的高性能遊戲 UI 的基於 Observable 的狀態管理

反應 AR 和 VR

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

反應渲染器

• react-three-fiber - Three.js 的 React 渲染器
• react-pdf - 使用 React 創建 PDF 文件
• ink - React 用於交互式命令行應用程序
• react-blessed - Blessed 終端界面庫的 React 渲染器
• react-sketchapp - 將 React 組件渲染到 Sketch
• react-figma - Figma 的 React 渲染器
• react-nil - 一個反應空渲染器
• remotion - 在 React 中以編程方式創建視頻

＃＃＃＃＃ 形式

• formik - 在 React 中構建表單，沒有眼淚
• react-hook-form - 用於表單驗證的 React Hooks
• react-jsonschema-form - 用於從 JSON Schema 構建 Web 表單的 React 組件
• react-final-form - React 的高性能基於訂閱的表單狀態管理
• unform - React 表單的以性能為中心的 API
• formily - 阿里巴巴集團統一表單解決方案
• uniforms - 用於從任何模式構建表單的 React 庫
• formsy-react - React 的表單輸入構建器和驗證器
• react-formal - React 的複雜 HTML 表單管理
• vest - 受單元測試語法啟發的聲明式表單驗證框架。

自動完成

• react-autocomplete by @rackt - 符合 WAI-ARIA 的 React 自動完成（存檔，只讀）
• react-autosuggest by @moroshko - 符合 WAI-ARIA 的 React autosuggest 組件
• react-autocomplete by @eliseumds - 只是品嚐一些 ReactJS + RxJS
• react-autocomplete by @prometheusresearch - 基於 React 的自動完成小部件
• instatype by @gragland - 簡單的反應自動完成組件
• downshift - 🏎 用於構建簡單、靈活、符合 WAI-ARIA 的增強型輸入 React 組件的基元
• React Bootstrap Typeahead - 一個基於 React 的 typeahead，它依賴於 Bootstrap 進行樣式設置，最初受到 Twitter 的 typeahead.js 的啟發。

圖形

• react-art - React Bridge 到 ART 繪圖庫
• react-canvas - React 組件的高性能<canvas> 渲染
• [react- Famous](https://github.com/pilwon/react- Famous) - 使用 Famo.us 以 60 FPS 的複雜 3D 動畫 UI

• react-kinetic - HTML5 Canvas 通過 KineticJS 使用 React
• react-svg-morph - 將你的 svg 組件變形為另一個
• react-hooks-svgdrawing - 帶有 React 鉤子的 SVG 繪圖
• react-svg-pan-zoom - 向 SVG 添加平移和縮放功能的 React 組件。

數據管理

• immer - 通過改變當前狀態來創建下一個不可變狀態
• ReSub - 一個用於編寫更好的 React 組件和數據存儲的庫
• immutable-js - Javascript 的不可變數據集合
• baobab - JavaScript 和 TypeScript 具有游標的持久和可選不可變數據樹
• WatermelonDB - 🍉 強大的 React 和 React Native 應用程序的反應式和異步數據庫⚡️
• RxDB - JavaScript 應用程序的實時數據庫

地圖

• react-googlemaps - 谷歌地圖的反應接口
• react-maps - React 的地圖組件
• react-google-maps - React.js 谷歌地圖集成組件
• react-gmaps - React.js 的谷歌地圖組件
• react-map-gl - MapboxGL-js 和覆蓋 API 的 React 包裝器
• google-map-react - 同構 google map React 組件
• react-mapbox-gl - 一個 mapbox-gl-js 包裝器，使 API 反應友好
• google-maps-react - 使用 React、延遲加載依賴項、當前位置查找器和測試驅動方法的聲明性 Google Map React 組件由 Fullstack React 團隊提供。
• react-leaflet - 用於 Leaflet 地圖的 React 組件
• react-geo - 一組使用 react、antd 和 ol 的地理相關組件
• pigeon-maps - 沒有外部依賴的 ReactJS 映射

圖表

• vx - 可視化組件
• victory - 用於構建交互式數據可視化的可組合 React 組件的集合
• react-vis - 數據可視化組件
• recharts - 重新定義了用 React 和 D3 構建的圖表庫
• nivo - 提供一組豐富的數據可視化組件，構建在 D3 和 React 庫之上
• echarts-for-react - 用於 React 包裝器的 Apache ECharts 組件
• react-apexcharts - ApexCharts 的 React 組件
• chartify - 使用 CSS 構建圖表的 React 插件

---

反應原生

使用 React 構建原生應用程序的框架

React Native 通用資源

• React Native 官網
• React Native GitHub
• React Native 時事通訊
• React Native Playground
• React Native 超讚列表
• React Native StackOverflow
• React Native Radio

React Native 教程

• React Native 教程
• 介紹 React Native：使用 JavaScript 構建應用程序
• React Native 簡介：用 JavaScript 構建 iOS 應用
• React Native 遇到異步函數
• 使用 React Native 的數字智能鏡實驗室
• [React Native 之美：使用 JavaScript 構建您的第一個 iOS 應用程序（第 1 部分）]（https://www.smashingmagazine.com/2016/04/the-beauty-of-react-native-building-your-first -ios-app-with-javascript-part-1/)

• [React Native 之美：使用 JavaScript 構建您的第一個 iOS 應用程序（第 2 部分）]（https://www.smashingmagazine.com/2016/04/how-to-build-your-first-ios-app-with -javascript/)

• 關於 React Native Flexbox 的迷你課程
• Flexbox 完整指南
• 試駕 react native 應用
• 使用帶有 TypeScript 的 React Native

React 原生開發工具

• react-native-code-push - CodePush 的 React Native 模塊

React Native 示例應用程序

• HackerNews
• 子流
• FinanceReactNative
• SplashWalls
• NBAreact
• 巴士時刻表

反應原生樣板

• 創建 React Native 應用程序 - 創建可在 iOS、Android 和 Web 上運行的 React Native 應用程序
• Ignite - React Native、樣板、插件、生成器等最熱門的 CLI！

React Native Awesome 組件

• Expo - 製作跨平台移動應用的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-native-icons - React Native 中快速簡單的圖標
• react-native-vector-icons - 3000 個可自定義的 React Native 圖標，支持 NavBar/TabBar
• react-native-google-signin - React Native 的 Google 登錄
• react-native-picker-modal-view
• react-native-gifted-chat - React Native 最完整的聊天 UI
• react-native-fast-image - FastImage，高性能 React Native 圖像組件
• recyclerlistview - React Native 和 web 的高性能列表視圖！
• react-native-largelist - React Native 最好的大列表組件
• react-native-gesture-handler - 將平台原生觸摸和手勢系統暴露給 React Native 的聲明式 API
• rn-placeholder - 在 React Native 中渲染文本或媒體內容之前顯示一些佔位符內容

React 原生庫

• sentry-react-native - 為您的 Web 應用程序、移動應用程序和遊戲提供實時崩潰報告。
• realm-js - Realm 是一個移動數據庫：SQLite 和鍵值存儲的替代品
• react-native-device-info - React Native iOS 和 Android 的設備信息
• react-native-react-bridge - 在 React Native 中運行 React Web 應用程序並處理它們之間的通信的工具集。
• uncompress-react-native - 在 React Native 中解壓文件 .zip、.rar、.cbz、.cbr 的簡單庫。

還原

JavaScript 應用程序的可預測狀態容器

Redux 通用資源

• Redux GitHub
• Redux 官方網站
• Awesome Redux 列表

Redux 工具

• react-redux - Redux 的官方 React 綁定
• redux-toolkit - 官方的、固執己見的、包含電池的工具集，用於高效的 Redux 開發
• redux-devtools - 適用於 Redux 的 DevTools，具有熱重載、動作回放和可定制的 UI
• 重新選擇 - Redux 的選擇器庫
• redux-thunk - redux 的 Thunk 中間件
• redux-saga - Redux 應用程序的替代副作用模型
• connected-react-router - React Router 的 Redux 綁定
• redux-form - 使用 react-redux 保持表單狀態的高階組件
• normalizr - 根據模式規範嵌套 JSON
• redux-observable - Redux 的 RxJS 中間件
• redux-undo - 高階 reducer 為 redux 狀態容器添加撤消/重做功能
• redux-persist - 對 redux 存儲進行持久化和再水化
• 重新匹配 - Redux 變得簡單

Redux 教程

• Redux Essentials
• Redux 基礎知識
• Dan Abramov 的 Redux 基礎課程
• 使用 Idiomatic Redux 構建 React 應用程序

---

GraphQL

API 的查詢語言

GraphQL 一般資源

• GraphQL 官方網站
• GraphQL 規範
• GraphQL 規範存儲庫

GraphQL 工具

• graphql-js - JavaScript 的 GraphQL 參考實現
• express-graphql - 使用 Express 創建 GraphQL HTTP 服務器
• Apollo - 行業標準的 GraphQL 實現
• GraphQL Playground - 用於更好的開發工作流程的 GraphQL IDE

GraphQL 教程

• GraphQL 介紹
• How to Graphql - GraphQL 全棧教程

GraphQL 實現

• graphql-ruby - Ruby GraphQL 的實現
• graphql-java - GraphQL Java 實現
• sangria - Scala GraphQL 客戶端和服務器庫
• graphql-php - GraphQL 參考實現的PHP 端口
• 石墨烯 - Python 的 GraphQL 框架
• graphql-dotnet - .NET 的 GraphQL
• graphql-go - Go 的 GraphQL
• juniper - Rust 的 GraphQL 服務器庫

數據庫集成

• Hasura - 所有數據的即時 GraphQL
• Prisma - 下一代 ORM 用於 Node.js 和 TypeScript
• graphql-sequelize - GraphQL & Relay for MySQL & Postgres via Sequelize

---

繼電器

數據驅動的 React 應用程序

中繼通用資源

• 接力官方網站
• 中繼 GitHub

繼電器教程

• 【官方接力入門】(https://facebook.github.io/relay/docs/en/introduction-to-relay.html)

• 視覺學習者接力
• Relay 入門
• 中繼和路由

中繼工具

• graphql-relay-js - 幫助構建支持 react-relay 的 graphql-js 服務器的庫
• react-router-relay - React Router 的中繼集成
• relay-local-schema - 在沒有 GraphQL 服務器的情況下使用 Relay
• relay-codemod - 基於 jsodeshift 更新 Relay API 的 Codemod 腳本

---

視頻

reactjsvideos.com

重要會談

• Pete Hunt: React: Rethinking best practice - JSConf EU 2013
• Pete Hunt: React: Rethinking Best Practices (更新) - JSConf.Asia 2013
• Tom Occhino 和 Jordan Walke：Facebook 上的 JS 應用程序 - JSConfUS 2013
• 反應：JS 中的 CSS
• Pete Hunt：可預測，不正確 - Mountain West JavaScript 2014
• Hacker Way: Rethinking Web App Development at Facebook
• Christopher Chedeau：為什麼 React 會擴展？- JSConf2014
• Christopher Chedeau：React 的架構 - OSCON 2014
• Pete Hunt: React RESTful UI Rendering - Strange Loop 2014
• Pete Hunt：Instagram.com 如何運作 - OSCON 2014
• Bill Fisher 和 Jing Chen：React 和 Flux - NewCircle 培訓 2014
• Sebastian Markbage：最小 API 表面積 - JSConf EU 2014
• Avik Chaudhuri：大規模的 JavaScript 測試和靜態類型系統 - Scale 2014
• React Native & Relay：將現代 Web 技術引入移動設備 - f8 2015)
• Citrusbyte 展示 GraphQL：與 Nick Schrock 合作的水平平台
• Laney Kuenzel：中繼中的突變和訂閱 - JSConf 2015
• React Today and Tomorrow and 90% Cleaner React With Hooks - React Conf 2018
• 反應會議
• 反應視頻
• Awesome React Talks

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 Conf 2017 播放列表

React.js 阿姆斯特丹 2018 播放列表

React Amsterdam 2019 播放列表

視頻教程

• 與 Dan Abramov 第一次嘗試 React Hooks

---

演示 React 應用程序

• hackernews-react-graphql - 使用通用 JavaScript 重寫的黑客新聞克隆，使用 React 和 GraphQL
• react-reduction - 使用 React 和 Bootstrap4 構建的免費管理模板
• reactjs-tmdb-app - 響應式 React The Movie Database App
• react-shopping-cart - 使用 React Redux 構建的簡單電子商務購物車應用程序

---

真正的 React 應用程序

• kibana - 您進入 Elastic Stack 的窗口
• firefox 調試器 - 可在任何地方工作的 Firefox 調試器
• spectrum - 簡單、強大的在線社區
• mattermost - 開源 Slack 替代方案
• 反應過度 - Dan Abramov 的個人博客
• winamp2-js - 為瀏覽器重新實現 Winamp 2
• dnote - 具有多設備同步和網絡界面的命令行筆記本

---

＃＃＃ 貢獻

這個列表開始是作為關於 React 的有趣事物的個人集合。React 剛開始的時候還處於 beta 階段，有專門的腳本可以將 JSX 轉換為 JS，甚至 Flux 還沒有發布。React 現在是主流，發生了很多事情。請不要嘗試將此列表用作廣告板或公開推送您的實驗的地方。請在這裡只提供完全免費的資源。不要猶豫，為過時的項目和文章以及新的貢獻建議清理 PR。衷心歡迎您的貢獻和建議♡歡迎。(✿◠‿◠)