DEV Community

Discussion on: State management in React Native using context

Collapse
 
devhammed profile image
Hammed Oyedele • Edited

Nice, I recently created a state management library (useGlobalHook) using this Hooks and Context concept.

Features: Lightweight (1kb), No external dependencies, Nestable, Support for class components (yeah, hooks for the class 💯) etc.

GitHub logo devhammed / use-global-hook

Painless global state management for React using Hooks and Context API in 1KB!

use-global-hook

Painless global state management for React using Hooks and Context API in 1KB!

NPM JavaScript Style Guide

Installation

npm install @devhammed
/use-global-hook
Enter fullscreen mode Exit fullscreen mode

Quick Example

import React from 'react'
import ReactDOM from 'react-dom'
import { GlobalHooksProvider, createGlobalHook, useGlobalHook } from '@devhammed
/use-global-hook'
const store = createGlobalHook(/** 1 **/ 'counterStore', () => {
  const [count, setCount] = React.useState(0)
  const increment = () => setCount(count + 1)
  const decrement = () => setCount(count - 1)
  const reset = () => setCount(0)
  return { count, increment, decrement, reset }
})
function Counter () {
  const { count, increment, decrement, reset } = useGlobalHook('counterStore') /** 1. This is where you use the name you defined in `createGlobalHook` function,
Enter fullscreen mode Exit fullscreen mode
Collapse
 
nagarajanchinnasamy profile image
Nagarajan Chinnasamy

Excellent. It will be nice if you can explain how "use-global-hook" can be used to rewrite the example given in this post. Thanks.