EasyState

Easy State management for React!

Old

import { useState, useEffect } from "react";

function Example() {
	const [count, setCount] = useState(0);

	useEffect(() => {
		alert("Changed~");
	}, [count]);

	return (
		<div>
			<p>You clicked {count} times</p>
			<button onClick={() => setCount(count + 1)}>Click me</button>
		</div>
	);
}

New

import easyState from "easystate-hook";
import { useEffect } from "react";

function Example() {
	const count = easyState(0);

	useEffect(() => {
		alert("Changed~");
	}, [count.effect]);

	return (
		<div>
			<p>You clicked {count.$} times</p>
			<button onClick={() => count.$++}>Click me</button>
		</div>
	);
}

Getting started

Install the package,

npm i easystate-hook

Import it

import easyState from "easystate-hook";

Use it

const name = easyState(InitialValue)

// Use it
name.$

// Update
name.$ = value