https://github.com/paripsky/tinystate

A minimalistic and lightweight state management library for React applications.
https://github.com/paripsky/tinystate

react state state-management

Last synced: about 2 months ago
JSON representation

A minimalistic and lightweight state management library for React applications.

• Host: GitHub
• URL: https://github.com/paripsky/tinystate
• Owner: paripsky
• License: mit
• Created: 2023-08-12T17:03:55.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-04-09T18:35:41.000Z (9 months ago)
• Last Synced: 2024-09-18T17:38:42.884Z (4 months ago)
• Topics: react, state, state-management
• Language: TypeScript
• Homepage: https://paripsky.github.io/tinystate/
• Size: 26.4 KB
• Stars: 7
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# tinystate - Tiny React State Management Library

**tinystate** is a super small state management solution for React applications.

It provides a simple and efficient way to manage and share state across your

components without the complexity of larger state management libraries. With

just a few lines of code, you can integrate **tinystate** into your React

project and start managing your application's state effortlessly.

## Bundle Size

[Check out on bundlephobia](https://bundlephobia.com/package/tinystate-react)

## Installation

You can install **tinystate** using npm or yarn:

```bash

npm install tinystate-react

# or

yarn add tinystate-react

# or

pnpm install tinystate-react

```

## Usage

Create your useStore hook: 

```javascript

import { createUseStore } from "tinystate-react";

export const useCountStore = createUseStore(0);

```

Now, you can use the `useCountStore` hook in your components to access and

update the state:

```javascript

import { useCountStore } from "./useCountStore";

function Counter() {

  const [count, setCount] = useCountStore();

  const increment = () => {

    setCount(count + 1);

  };

  const decrement = () => {

    setCount(count - 1);

  };

  return (

    


      
Count: {count}

      Increment

      Decrement

    

  );

}

```


### API Reference

#### `createUseStore(initialState: T)`

Creates a custom hook that encapsulates the store's subscription and state

management.

- `initialState` (T): The initial state of the store.

Returns a hook that, when called, returns a tuple containing (Similar to useState):

- The current state.

- A setter function to update the state.

## License

This project is licensed under the [MIT License](LICENSE).