Back to rankings

GantMan/ReactStateMuseum

JavaScript

A whirlwind tour of React state management systems by example

reactreact-nativereduxmobxmobx-state-treeapollographqlappsyncreact-automataunstatedfreactalstate-managementunistore
Star Growth
Stars
1.5k
Forks
76
Weekly Growth
โ€”
Issues
19
5001k1.5k
Apr 2018Jan 2021Oct 2023Jul 2026
Artifactsnpmnpm install reactstatemuseum
README


One Packing List App Written in:

Technology React React Native
setState
React 16.x Context
React 16.x useContext
Redux
MobX
unstated
MobX-State-Tree
GraphQL Apollo + Amazon AppSync
apollo-link-state
setState + react-automata
Freactal
pure-store
ReactObservableStore
react-easy-state
rematch
unistore
Microstates
react-recontext
remx Coming Soon - Contribute Here?
simple-remx
constate
controllerim Coming Soon - Contribute Here?
immer
parket Coming Soon - Contribute Here?
react-contextual Coming Soon - Contribute Here?
react-copy-write Coming Soon - Contribute Here?
react-simplified
reim Coming Soon - Contribute Here?
React 16.x Context + Redux Coming Soon - Contribute Here?
ReComponent Coming Soon - Contribute Here?
undux Coming Soon - Contribute Here?
React 16.7.0-alpha useState Hook
redux-lightweight Coming Soon - Contribute Here?
overmind Coming Soon - Contribute Here?
Venti Coming Soon - Contribute Here?
Recoil Coming Soon - Contribute Here?
Effector Coming Soon - Contribute Here?
zustand Coming Soon - Contribute Here?
Jลtai Coming Soon - Contribute Here?

Examples to help portray the how, why, which, pros, and cons of various state management systems in the React ecosystem.

Every app is meant to be small, simple, and the same as each other. The only difference should be the state management decisions of each. The repeated React and ReactNative app is a Packing List, with the name based on the state technology.

Web Native
example gif of app example gif of app

What are the differences?

Ye honest truth here

This repo exists so you can look at the code for yourself, OR check this blog post on my findings if you'd like:

To Run Web

  • Click the codesandbox link in the list above
  • OR Clone this repo, then cd into each folder and follow the directions in readme

To Run Native

  • Clone this repo, then cd into each folder and follow the directions in readme

Contributors

Special thanks to all the wonderful people who contributed in some way to the React State Museum


Arthur Gunn

๐Ÿ’ป ๐Ÿ’ก

Jason Lengstorf

๐Ÿ“–

Marco Afonso

๐Ÿ’ป ๐Ÿ’ก

Robert DeLuca

๐Ÿ’ป ๐Ÿ’ก

stereobooster

๐Ÿ“–

Juan David Castro

๐Ÿ’ป ๐Ÿ“– ๐Ÿ’ก

Iurii Kyrylenko

๐Ÿ’ป

Charles Lowell

๐Ÿ’ป

Jakub Wadas

๐Ÿ’ป ๐Ÿ“–

Anton Rusinov

๐Ÿ’ป ๐Ÿ’ก

Miklos Bertalan

๐Ÿ’ป

Gant Laborde

๐Ÿ’ป ๐Ÿ“– ๐Ÿ’ก ๐Ÿ“ โš ๏ธ

Tyler Reitz

๐Ÿ’ป ๐Ÿ“–

Daniel Zlotin

๐Ÿ’ป ๐Ÿ’ก โš ๏ธ

Nuno Jesus

๐ŸŽจ

Alek Merani

๐Ÿ’ป ๐Ÿ“–

Ole Christian Eidheim

๐Ÿ’ป ๐Ÿ“–

Haz

๐Ÿ’ป

Stephen Mathieson

๐Ÿ“–

Christoph Benjamin Weber

๐Ÿ› ๐Ÿ’ป

Aaron Yoshitake

๐Ÿ’ป

IniZio

๐Ÿ’ป

Ryan Linton

๐Ÿ’ป

Joe Duran

๐Ÿ’ป

Minh Tran

๐Ÿ’ป

Tudor Pavel

โš ๏ธ

Lubos Belak

๐Ÿ“–

Ryan

๐Ÿ’ป

Niko Salminen

๐Ÿ’ป

J.C. Hiatt

๐Ÿ’ก

doniyor2109

๐Ÿ’ป

marcelkalveram

๐Ÿ’ป ๐Ÿค”

Alex Lewis

๐Ÿ“–

Steven Langbroek

๐Ÿ›

Kevin

๐Ÿ’ป ๐Ÿ“–

Lubos Belak

๐Ÿ›

Will Schmid

๐Ÿ’ป ๐Ÿ“–

Solomon Ayoola

๐Ÿ’ป ๐Ÿ“–

Dominik Ferber

๐Ÿ“–

Will Caulfield

๐Ÿ’ป

Gleb

๐Ÿ’ป ๐Ÿ“–

Pawel Sas

๐Ÿ’ป

Lubos Belak

๐Ÿ›

Imre Osswald

๐Ÿ’ป

Frontend Dev

๐Ÿ’ป ๐Ÿ“– ๐Ÿ’ก

This project follows the all-contributors specification. Contributions of any kind welcome!

Related repositories
freeCodeCamp/freeCodeCamp

freeCodeCamp.org's open-source codebase and curriculum. Learn math, programming, and computer science for free.

TypeScriptnpmBSD 3-Clause "New" or "Revised" Licenselearn-to-codenonprofits
contribute.freecodecamp.org
452.4k45.6k
react/react

The library for web and native user interfaces.

JavaScriptnpmMIT Licensejavascriptreact
react.dev
246.7k51.3k
facebook/react

The library for web and native user interfaces.

JavaScriptnpmMIT Licensejavascriptreact
react.dev
233k47.8k
vercel/next.js

The React Framework

JavaScriptnpmMIT Licensereactserver-rendering
nextjs.org
141.1k31.5k
react/react-native

A framework for building native applications using React

C++MIT Licenseandroidapp-framework
reactnative.dev
126.2k25.2k
facebook/react-native

A framework for building native applications using React

C++MIT Licenseandroidapp-framework
reactnative.dev
120.9k24.5k
shadcn-ui/ui

A set of beautifully-designed, accessible components and a code distribution platform. Works with your favorite frameworks. Open Source. Open Code.

TypeScriptnpmMIT Licensecomponentsnextjs
ui.shadcn.com
119.5k9.5k
justjavac/free-programming-books-zh_CN

:books: ๅ…่ดน็š„่ฎก็ฎ—ๆœบ็ผ–็จ‹็ฑปไธญๆ–‡ไนฆ็ฑ๏ผŒๆฌข่ฟŽๆŠ•็จฟ

GNU General Public License v3.0pythonjavascript
weibo.com/justjavac
117.7k28.2k
nextlevelbuilder/ui-ux-pro-max-skill

An AI SKILL that provide design intelligence for building professional UI/UX multiple platforms

PythonPyPIMIT Licenseai-skillsantigravity
uupm.cc
108.6k11.6k
react/create-react-app

Set up a modern web app by running one command.

JavaScriptnpmMIT Licensereactzero-configuration
create-react-app.dev
103.3k26.9k
facebook/create-react-app

Set up a modern web app by running one command.

JavaScriptnpmMIT Licensereactzero-configuration
create-react-app.dev
103.1k27k
ant-design/ant-design

An enterprise-class UI design language and React UI library

TypeScriptnpmMIT Licensereactui-kit
ant.design
98.8k54.7k