# @makejack4/react-simple-client-hook
> This package is sitll beta.
Latest version **0.0.5** (published 2023-08-25) · MIT license · 0 weekly downloads
## Install
```sh
npm install @makejack4/react-simple-client-hook
pnpm add @makejack4/react-simple-client-hook
yarn add @makejack4/react-simple-client-hook
bun add @makejack4/react-simple-client-hook
```
## Health
**Score 20/100 (F)** — status: abandoned.
Positive: has types; no vulnerabilities.
Warnings: low downloads; no esm support; pre 1.0.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 0.0.5 |
| Published | 2023-08-25 |
| First published | 2023-08-24 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Node | 20 |
| Dependencies | 0 |
| Unpacked size | 17.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Rattanapol Piakaew |
| Maintainers | superauman |
| Keywords | react, react hooks, state management |
## Links
- npm: https://www.npmjs.com/package/@makejack4/react-simple-client-hook
- npm.io page: https://npm.io/package/@makejack4/react-simple-client-hook
## Alternatives
- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads
## Recent versions
- 0.0.5 (latest) — 2023-08-25
- 0.0.4 — 2023-08-25
- 0.0.3 — 2023-08-24
- 0.0.2 — 2023-08-24
- 0.0.1 — 2023-08-24
## README
# Welcome to React Simple Client Hook!
This package is sitll beta.
Note : This package work only client side.
# Installation
> npm install @makejack4/react-simple-client-hook
or
> yarn add @makejack4/react-simple-client-hook
# How to use
| Name | Optional | Type |
| :-------- | :------: | :----------------------------: |
| data | false | Type of task Return |
| onReuqest | false | function(payload: [your type]) |
| loading | false | boolean |
| error | true | any |
# Setup Provider in Root Project
```ts
import { ReactSimpleClientHookProvider } from '@makejack4/react-simple-client-hook'
export const RootApp = () => {
return (
{children}
)
}
```
## Create Hook
```ts
import { CreateClientHook } from '@makejack4/react-simple-client-hook'
export const useTestHook = () =>
CreateClientHook({
name: 'testHook',
task: async (payload: { id: string; number: number[] }) => {
// .... your logic
return {
key: payload.id,
myArray: payload.number,
}
},
})
```
## Use Hook
```ts
import { useTestHook } from '[YOUR_RELATIVE_PATH]'
export const MyPageComponent () => {
const { data, onRequest, loading } = useTestHook()
const onClickTest = async () => {
const response = await onRequest({ id: '1', number: [1,2,3] })
// should output { ok : true, data : { key : '1', myArray: [1,2,3]}, error: null } follow by task while create hook
console.log(response)
}
return (
data : {JSON.stringify(data)}
loading : {loading}
)
}
```
## Props Description
| Name | Required | Type | Default value | Return |
| :----------- | :------: | :-------------------------------: | :-----------: | :-----------------: |
| name | true | String | | |
| task | true | function | | Type of task Return |
| dataPolicy | false | 'default','merge-deep','no-store' | 'default' | |
| initialState | false | Value | null | |
## dataPolicy Props Description
By default on create your hook will be set 'default' but you can change it, each "dataPolicy" value will be describe below.
- 'default' = your return data of task is latest will be store in "context"
- 'merge-deep' = your return data of task is latest will be merged with previous data in "context" and store in "context"
- 'no-store' = your return data of task will not be store in "context" but only return during you get callback "onRequest" only
---
_Source: https://npm.io/package/@makejack4/react-simple-client-hook · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._