Custom hooks π§βπ»
-
PersonalWebsite My personal website
-
@bahachammakhi/hooks NPM package for this library
- Typescript TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. π»
- React A JavaScript library for building user interfaces. π»
$ npm install @bahachammakhi/hooks
#
$ yarn add @bahachammakhi/hooksList of features ready and TODOs for future development
- useApi hook
To-do list:
- useForm hook (documentation /exemple)
- useCurrentWidth (documentation / exemple)
- useLifeCycle (documentation / exemple)
Project is: in progress
import React, { useState, useEffect } from "react"; import { useApi } from "@bahachammakhi/hooks"; import axios from "axios"; const getPeople = () => axios.get("https://swapi.dev/api/people/"); const App = () => { const { ...calls } = useApi({ getPeople }); const [people, setPeople] = useState < any > []; useEffect(() => { calls.getPeople.call(); }, []); useEffect(() => { setPeople(calls.getPeople.data); }, [calls.getPeople.success]); return ( <div> {people.results.map((element: any) => { return <>{element.name}</>; })} </div> ); };
import React from "react"; import { useCurrentWidth } from "@bahachammakhi/hooks"; const App = () => { const width = useCurrentWidth(); return ( <div> <div style={{ width: width, backgroundColor: "black" }}>Name</div> </div> ); };
Created by @bahachammakhi - feel free to contact me!