Getting started with easy-model (quick start guide)
TL;DR Install and write a model class. Use useModel to create/subscribe in React. Use provide for shared instances. 1) Install pnpm add @e7w/easy-model 2) Create a model class TodoModel { items: st...

Source: DEV Community
TL;DR Install and write a model class. Use useModel to create/subscribe in React. Use provide for shared instances. 1) Install pnpm add @e7w/easy-model 2) Create a model class TodoModel { items: string[] = []; add(text: string) { this.items.push(text); } remove(index: number) { this.items.splice(index, 1); } } 3) Use it in a component import { useModel } from "easy-model"; function TodoList() { const todo = useModel(TodoModel, []); return ( <div> <button onClick={() => todo.add("new item")}>Add</button> <ul> {todo.items.map((it, i) => ( <li key={i} onClick={() => todo.remove(i)}> {it} </li> ))} </ul> </div> ); } This is the core workflow: model-first design with minimal React glue. If you already model business logic with classes, easy-model makes state feel natural. GitHub: easy-model npm: @e7w/easy-model