0.7.1 • Published 4 years ago

simple-redux-js v0.7.1

Weekly downloads
7
License
ISC
Repository
github
Last release
4 years ago

Simple Redux is a state management library for the layman. It is just a global store to get and update values.

  • Dead simple — One hook for receiving values and updating them.
  • Redux based — Opinionated version of Redux. Core Redux concepts still apply.
  • Plug & Play — Copy and paste the code below and you are ready to go.

Getting Started

  1. Install the npm package.

    npm i simple-redux-js
  2. Load the provider in App.js.

    const App = () => (
      <SimpleProvider initialState={{ token: 'default_token' }}>
        <Child>
      </SimpleProvider>
    )
  3. Access and update global state in any other component.

    const Child = () => {
      const simpleDispatch = useSimpleDispatch()
      return (
        <div>
          <span>{useSimpleSelector('token')}</span>
          <button onClick={() => simpleDispatch('token', 'value')}>
        </div>
      )
    }

Documentation

  • useSimpleSelector (propertyName) Selects the property by name from the store.
const token = useSimpleSelector('token')
  • getSimpleState (propertyName) Selects the property by name outside of a component.
const token = getSimpleState('token')
  • getSimpleStates () Selects all states of the store outside of a component.
const allStates = getSimpleStates()
  • store Access the store outside of a component.
store.subscribe(() => {
  console.log('the store has been updated')
})
  • useSimpleDispatch () Creates a dispatch method to update the store.
  const simpleDispatch = useSimpleDispatch()
  • simpleDispatch (propertyName, propertyValue) Updates the property by name with the specified value.
  const setToken = (token) => simpleDispatch('token', token)

Full Example

// App.js
import React from 'react'
import ReactDom from 'react-dom'

import { SimpleProvider } from 'simple-redux-js'

import { Child } from './Child'

const defaultToken = localStorage.getItem('token')

const App = () => (
  <SimpleProvider initialState={{ token: defaultToken }}>
    <Child>
  </SimpleProvider>
)
ReactDom.render(<App/>, document.getElementById('root'))

// Child.js
import React from 'react'

import { useSimpleSelector, useSimpleDispatch } from 'simple-redux-js'

const Child = () => {
  const simpleDispatch = useSimpleDispatch()
  const token = useSimpleSelector('token')
  const setToken = (token) => simpleDispatch('token', token)

  return (
    <div>
      <span>{token}</span>
      <button onClick={() => setToken('user_token')}>
    </div>
  )
}
export { Child }

Publish

npm login
git commit (clean repo)
npm version patch (or minor)
npm publish
git push

License

simple-redux-js is released under the ISC License.

0.7.1

4 years ago

0.7.0

4 years ago

0.6.3

4 years ago

0.6.2

4 years ago

0.6.1

4 years ago

0.5.11

4 years ago

0.5.10

4 years ago

0.5.9

4 years ago

0.5.8

4 years ago

0.5.7

4 years ago

0.5.4

4 years ago

0.5.3

4 years ago

0.5.6

4 years ago

0.5.5

4 years ago

0.5.2

4 years ago

0.5.1

4 years ago

0.5.0

4 years ago