I Created React AppState! 🤗

Ryota Murakami Nov 19 ・1 min read

#showdev #react #typescript #javascript

Why React doesn't provide straightforward way to get/set value without Component hierarchy? 🤔

I saw Andrew Clark opened PR that get/settable context feature once but there is no exists it in the current Context.

I guess there is any complex circumstances barrier so I wanna investigate past PR discussion. 🕵️‍♂️

Anyway, I created straightforward library that simple combination of context, state, hook to make get/settable context aka you know, just global store.
Get by 😆: https://github.com/ryota-murakami/react-appstate

If you need handle entire React App states Like DarkThemeButton, uncompleted input, control modal/snackbars etc...
React AppState provide straightforward way. 😀https://t.co/qmpF3O9afM
— Ryota Murakami (@malloc007 ) November 19, 2019

Thank you for reading my poor English post! ☕️
Welcome comment feel free If you know more better English, If you know more tech things, or other your special 😀🚀

DISCUSS (8)

Sore eyes?

dev.to now has dark mode.

Select night theme in the "misc" section of your settings ❤️

Ryota Murakami

I live in Tokyo. I’ve been fascinated to React/React Core Team and Future Web Technology! I like designing Straightforward Software Architecture experience for the people 🌎

Saurabh Daware

Nov 19

so cool! I'll give it a try the next time I work on react🌻 Good job :)

Ryota Murakami

Author

Nov 20

Thank you so much!
I'm so glad to hear that 🤗

RobbieGM

Nov 19

You could also use redux for this though.

Ryota Murakami

Author

Nov 20

Redux is also nicer way, Thank you!

At Thoriq

Nov 20

cool! i'll try it soon. but can you share how it differs from redux?

Ryota Murakami

Author

Nov 20

Originally I'm fan of Redux! So I could describe with long text containing trivial thing...
We call Redux in React world generally, that's combined 2 another library "React" "Redux" by "react-redux".

So, Redux(combined React) manage global value based on Flux essence. you know Dispatch Named Action with payload...

My React AppState has nothing to do with Redux.
Which constructed React build-in feature "state/context/hooks".

Thank you, this is great question I think.
I should start write more straight to understand post with sample code 👨‍💻

short answer is... React AppState designed set/get direct values 🌍

import { useAppState } from '@ryotamurakami/react-appstate'

const MyComponent = () => {
  const [appState, setAppState] = useAppState()

  function toggleDarkTheme() {
    setAppState({ isDarkTheme: !appState.isDarkTheme})
   }

   return (<button onClick={toggleDarkTheme}>{appState.isDarkTheme ? 'Disable DarkMode?' : 'Enable DarkMode!' }</button>)

}

At Thoriq

Nov 21

it seems very simple. i am currently developing react project with redux as its state management and i am a newbie here. i should probably try yours soon! thank you for the explanation :)

THREAD

Ryota Murakami

Author

Nov 21

Your welcome! 🤗

code of conduct - report abuse

I Created React AppState! 🤗

Ryota Murakami Nov 19 ・1 min read

Ryota Murakami

Vue's Darkest Day

How To Declare And Pass Parameters To An Ionic + React Modal

David Dal Busco - Dec 10

Is Web Browser local storage available?

Ziga Brencic - Dec 10

Dev API with Ruby

Davide Santangelo - Dec 10

Iterations in Javascript

Cesare Ferrari - Dec 10

Ryota Murakami

Vue's Darkest Day

How To Declare And Pass Parameters To An Ionic + React Modal

David Dal Busco - Dec 10

Is Web Browser local storage available?

Ziga Brencic - Dec 10

Dev API with Ruby

Davide Santangelo - Dec 10

Iterations in Javascript

Cesare Ferrari - Dec 10

Join our DEV Community :)