23 个仓库
Libraries that connect external state management containers to React UI components.
Distinct from React Integrations: Distinct from general React components or renderers; specifically refers to the bridge between a state store and the UI framework.
Explore 23 awesome GitHub repositories matching web development · React State Bindings. Refine with filters or upvote what's useful.
React Redux is a set of official bindings and integration layers that connect a Redux global state container to a React user interface. It functions as a state synchronization library and a communication bridge, allowing components to read state and dispatch actions to a centralized store. The project decouples business logic from the view layer, ensuring that the user interface automatically updates whenever the underlying global state changes. It manages complex data flows by linking the UI to a central state container to share data across different components and screens. The library impl
Provides official state bindings that connect a Redux store to React UI components.
React Redux is a global state management bridge and a set of bindings that connect React components to a Redux state store. It serves as a communication layer and state store connector, allowing a declarative user interface to synchronize with a centralized source of truth. The library enables the synchronization of shared global state across an application by providing mechanisms to read state and dispatch actions directly from the view layer. It ensures predictable state transitions by bridging the gap between UI components and the Redux state container. The project covers core capabilitie
Bridges the gap between Redux state containers and React components for efficient data synchronization and rendering.
React-Redux provides the official bindings that connect a Redux state container to a React user interface. It functions as a state management integration and UI state connector, enabling the synchronization of a centralized data store with a component tree. The library ensures a predictable UI state flow by implementing a unidirectional data path between the interface and the state container. It allows components to read global state and dispatch actions to trigger updates, maintaining a single source of truth across the application. The project handles state synchronization through a combin
Connects an external Redux state management container to React UI components for automatic synchronization.
Draft-js is a framework for building customizable rich text editors within React applications. It functions as a content editable framework that separates the underlying data model from the visual rendering layer, acting as a rich text content engine to manage complex text data and formatting. The project utilizes an immutable state management system to ensure consistent updates and predictable undo history. It manages editor state through persistent data structures, providing an immutable data state manager to prevent accidental mutation. The framework includes capabilities for high perform
Integrates the editor's internal state with React components using specialized state bindings.
Enzyme is a testing utility for React components designed to verify their output and behavior in a test environment. It serves as a test harness for UI components, providing tools to render visual elements, manage state transitions, and simulate synthetic events. The library distinguishes itself through multiple rendering modes, including a shallow rendering engine for isolated unit testing and full DOM rendering for testing deep integration. It employs an adapter-based integration system to maintain compatibility across different versions of the underlying framework. The toolkit covers a br
Allows updating component properties and props to verify the user interface response to data changes.
Dva is a state management library and client-side application framework designed for building user interfaces with React and Redux. It functions as an asynchronous logic orchestrator and a single page application router, organizing application data through a structured data flow of reducers, effects, and subscriptions. The framework distinguishes itself through the use of generator functions to manage asynchronous workflows and sequential side effects, keeping these operations separate from synchronous state updates. It implements namespace-based model organization to group business logic and
Connects the Redux-based state management container to React UI components via structured data flow.
Recompose is a suite of toolsets for implementing higher-order component composition, context extraction, render optimization, and external state integration. It provides a library of utilities to wrap components in reusable logic and behavioral layers, allowing developers to chain functional wrappers and reduce nesting within a component tree. The project focuses on the composition of functional wrappers to inject properties and behavior into components. It includes a set of helpers for extracting values from component context and passing them as direct properties, as well as tools for integ
Bridges external data sources and state management containers to React UI components.
Frontend Workshop from HTML/CSS/JS to TypeScript/React/Redux
Teaches binding React components to state changes for automatic UI re-rendering.
Reactide is the first dedicated IDE for React web application development.
Debugs React applications by viewing a live component tree with props and state for every component.
Valtio is a proxy-based state management library and reactive state engine that provides a mutable state store. It allows application state to be updated through direct object mutations rather than immutable patterns, using JavaScript proxies to track changes and trigger updates. For React applications, it includes a synchronization hook that ensures components re-render only when the specific properties they access are modified. The system supports reactive data derivation through computed properties that automatically update when their underlying dependencies change. It maintains reactivity
Ships a synchronization hook that connects proxy state to React components for optimized rendering.
Craft.js is a framework for building extensible drag-and-drop page editors using React components and serializable state management. It provides the core infrastructure to construct custom page builders where users can compose layouts by dragging, dropping, and repositioning elements within a structured editor environment. The framework manages editor state through a component-based node tree, where each user element is represented as an internal node storing its type, props, and parent relationships. This state is managed via React Context and can be serialized to JSON for persistence and sh
Manages editor state through React Context, enabling components to read and manipulate the page composition tree.
react-native-mmkv is a synchronous mobile persistence system that provides an encrypted key-value store for mobile applications. It serves as a high-performance wrapper for the MMKV storage engine, eliminating asynchronous overhead by reading and writing values directly to disk. The project distinguishes itself through shared app group storage, which allows data access across multiple application extensions via a shared filesystem directory. It also provides state-synced storage hooks that automatically trigger component updates when stored key-value pairs change. The system covers a broad r
Ships state-synced storage hooks that automatically trigger React component updates when stored values change.
re-frame is a functional framework for building single-page applications in ClojureScript. It provides a centralized, immutable database that serves as the single source of truth for the entire application state, enforcing a strict unidirectional data flow where events trigger state transitions and subsequent view updates. The framework distinguishes itself through a reactive signal graph and an interceptor-based middleware pipeline. By treating application logic as a sequence of data-driven events and declarative side effects, it decouples business logic from the view layer. This architectur
Connects external state management containers to React UI components to decouple business logic.
Refluxjs 是一个状态管理库,旨在实现单向数据流架构。它通过严格的动作(actions)和存储(stores)循环来管理应用程序状态,以防止不可预测的更新循环。 该库通过管理事件流并触发相关的成功或失败动作来协调异步操作。它还提供了一个全局状态注册表,通过唯一标识符追踪存储状态,从而实现用于持久化和时间旅行调试的深度克隆。 其功能面涵盖了集中式状态管理,包括数据存储的创建和派生状态聚合。它包括通过预触发钩子(pre-emission hooks)拦截动作发射的工具,以及将存储状态直接绑定到用户界面组件以实现自动重新渲染的机制。
Binds central store data directly to React components to trigger automatic view re-renders.
该项目是一个专门的测试工具和 Mock 实用程序,旨在隔离测试 React Hook。它提供了一个模拟组件环境,用于执行 Hook 逻辑并跟踪返回的值,而无需完整的用户界面。 该库支持验证 Hook 的生命周期,包括挂载、更新和卸载阶段。它具有注入属性以强制重新渲染的机制,以及一个异步等待系统,以确保在运行断言前处理状态更新。 该工具集涵盖了状态管理验证、防止测试间状态泄漏的自动化生命周期清理,以及触发状态更新以验证 Hook 如何响应输入变化的能力。
Utilities for verifying how hooks respond to state changes by triggering re-renders and managing cleanup.
TinyBase 是一个响应式数据存储和内存关系数据库,专为客户端状态持久化而设计。它作为一个本地优先(local-first)的同步引擎,使用无冲突复制数据类型(CRDT)和逻辑时钟合并分布式状态,以确保确定性的数据收敛。 该项目具有一个模式验证库,可将来自 Zod、Yup 和 TypeBox 等工具的外部定义转换为类型安全的存储定义。它为实时协作编辑提供了基础设施,利用与 Automerge、Yjs 和 PartyKit 的同步来维护跨多个客户端和服务器的一致状态。 能力范围包括具有表和外键的关系数据建模、类似 SQL 的查询和索引,以及用于分组变更的原子事务。它支持广泛的持久化适配器,包括浏览器存储、SQLite 和 Cloudflare Durable Objects。该系统还提供双向状态绑定和用于与 React、SolidJS 和 Svelte 集成的声明式组件。
Provides specialized bindings that connect the reactive data store to React UI components.
Sound-redux 是一个基于 React 的音频播放器和 SoundCloud API 客户端,旨在浏览和播放音频轨道。它作为一个 Redux 状态管理器,用于在整个应用程序中同步播放和轨道元数据。 该项目与 SoundCloud API 集成以获取和显示音乐轨道及艺术家信息。这使得能够构建一个音乐流媒体界面,将自定义用户界面连接到远程外部服务以供公众消费。 该应用程序利用基于 Redux 的状态管理系统和基于组件的 UI 渲染模型。它结合了单页应用程序路由和基于 REST 的 API 集成来管理数据流和导航。
Handles complex application states and data flows for a media player using React and Redux.
Effector is a reactive state management library and data flow orchestrator designed for building complex, event-driven applications. It models application logic as a directed acyclic graph, where state updates and asynchronous side effects propagate automatically through declarative pipelines. By decoupling business logic from user interface layers, it allows developers to maintain state in independent containers that communicate via standard interfaces, ensuring the system remains framework-agnostic. The library distinguishes itself through its robust support for isolated execution scopes, w
Connects state containers to components using specialized hooks to trigger re-renders based on data changes.
Effector is a reactive state management library designed for building complex, event-driven applications. It functions as a data flow engine that models application logic as a directed acyclic graph, ensuring that state updates propagate automatically through interconnected nodes. By utilizing atomic state updates and declarative unit composition, the library maintains data consistency and provides a predictable execution model for managing application state. The project distinguishes itself through its framework-agnostic architecture, which decouples business logic from user interface implem
Creates a component that observes a state store and triggers re-renders when the stored value changes using the render props pattern.
mobx-react 是一个将 React 组件与 MobX 可观察状态进行绑定的库。它充当组件状态同步器的角色,确保用户界面元素仅在所消费的特定观察数据发生变化时自动重新渲染。 该项目通过将业务逻辑和领域状态移至独立的 Store 中,实现了状态架构的解耦,从而将数据管理与 React 组件树分离开来。它利用 Provider 和 Context 在深层组件层级中分发全局状态,避免了手动进行属性逐层传递(prop drilling)。 该库涵盖了广泛的状态管理原语,包括可观察集合、基于动作的更新以及计算状态派生。它为类组件和函数式组件提供了 UI 集成辅助工具,并针对组件重新渲染的精确度以及服务端渲染期间的内存泄漏预防进行了性能优化。 该项目使用 TypeScript 实现。
Connects external MobX observable state management containers to React UI components for automatic re-renders.