https://github.com/mustafadalga/state-syncer

A simple state management library for React.js applications.
https://github.com/mustafadalga/state-syncer

react-store react-store-manager slicer state state-management store

Last synced: 3 months ago
JSON representation

A simple state management library for React.js applications.

• Host: GitHub
• URL: https://github.com/mustafadalga/state-syncer
• Owner: mustafadalga
• License: mit
• Created: 2024-04-08T20:09:25.000Z (almost 2 years ago)
• Default Branch: main
• Last Pushed: 2024-04-08T20:09:59.000Z (almost 2 years ago)
• Last Synced: 2025-03-05T23:38:36.186Z (about 1 year ago)
• Topics: react-store, react-store-manager, slicer, state, state-management, store
• Language: TypeScript
• Homepage: https://www.npmjs.com/package/state-syncer
• Size: 9.77 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# State Syncer

A simple state management library for React.js applications.



[![version](https://img.shields.io/npm/v/state-syncer.svg)](https://www.npmjs.com/package/state-syncer)



## Installation

```sh

npm i state-syncer

```

## Usage

You can create your store like this.

**usePosts.ts**

```ts

import { createSlice } from "state-syncer";

type State = {

    count: number

}

const initialState: State = {

    count: 0,

};

export const { useGlobalState: useCounter } = createSlice(initialState);

```

Then use with relevant components 

**Counter**

```tsx

import { useCounter } from "@/store/useCounter";

export default function Counter() {

    const [ count, setCount ] = useCounter('count');

    return (

        


            
Count: {count}

            


                 setCount(prevValue => prevValue + 1)}>

                    Increment

                


                 setCount(prevValue => prevValue - 1)}>

                    Decrement

                

            

        

    );

};

```


**Foo**

```tsx

import { useCounter } from "@/store/useCounter";

export default function Foo() {

    const [ count ] = useCounter('count');

    return (

        
Counter : {count}

    )

}

```



 

## License

[![License](https://img.shields.io/badge/license-MIT-blue)](https://github.com/mustafadalga/state-syncer/blob/main/LICENSE)