All Projects → juliencrn → usehooks-ts

juliencrn / usehooks-ts

Licence: MIT license
React hook library, ready to use, written in Typescript.

Programming Languages

typescript
32286 projects
javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to usehooks-ts

web
React hooks done right, for browser and SSR.
Stars: ✭ 940 (-67.28%)
Mutual labels:  hook, react-hooks, react-hook
useAudioPlayer
Custom React hook & context for controlling browser audio
Stars: ✭ 176 (-93.87%)
Mutual labels:  hook, react-hooks, react-hook
react-use-hotkeys
React hook for creating simple keyboard shortcuts
Stars: ✭ 74 (-97.42%)
Mutual labels:  hook, react-hooks
use-prefers-color-scheme
🪝 React hook for subscribing to user's color scheme preference.
Stars: ✭ 28 (-99.03%)
Mutual labels:  hook, react-hook
formalizer
React hooks based form validation made for humans.
Stars: ✭ 12 (-99.58%)
Mutual labels:  hook, react-hooks
react-hook-videojs
Easy React integration of Video.js using hooks.
Stars: ✭ 37 (-98.71%)
Mutual labels:  hook, react-hooks
ReSift
A state management library for data fetches in React
Stars: ✭ 39 (-98.64%)
Mutual labels:  hook, react-hooks
react-hook-layout
Layouts in React.
Stars: ✭ 16 (-99.44%)
Mutual labels:  hook, react-hooks
Frontend
마음을 잇는 현명한 소비 '잇다'🤝
Stars: ✭ 19 (-99.34%)
Mutual labels:  material-ui, react-hooks
Fre
👻 Tiny Footprint Concurrent UI library for Fiber.
Stars: ✭ 3,195 (+11.21%)
Mutual labels:  hook, react-hooks
use-dencrypt-effect
⚛ A custom React hook generating crypting text effect.
Stars: ✭ 39 (-98.64%)
Mutual labels:  hook, react-hooks
use-async-resource
A custom React hook for simple data fetching with React Suspense
Stars: ✭ 92 (-96.8%)
Mutual labels:  react-hooks, react-hook
Facebook-Messenger
This is a Facebook Messenger clone.You can comminicate to other at realtime.Used ReactJS, Material UI, Firebase, Firestore Database
Stars: ✭ 18 (-99.37%)
Mutual labels:  material-ui, react-hooks
react-daterange-picker
A react date range picker to using @material-ui. Live Demo: https://flippingbitss.github.io/react-daterange-picker/
Stars: ✭ 85 (-97.04%)
Mutual labels:  material-ui, react-hooks
react-ui-hooks
🧩Simple repository of React hooks for building UI components
Stars: ✭ 20 (-99.3%)
Mutual labels:  hook, react-hooks
max-todos
A basic Todo app developed in React.
Stars: ✭ 19 (-99.34%)
Mutual labels:  material-ui, react-hooks
Use Http
🐶 React hook for making isomorphic http requests
Stars: ✭ 2,066 (-28.09%)
Mutual labels:  react-hooks, react-hook
typescript-nextjs-redux-toolkit-material-ui-example
TypeScript v3.8, Next.js v9, Redux Toolkit, Material-UI v4, react-hooks, SSR live demo
Stars: ✭ 61 (-97.88%)
Mutual labels:  material-ui, react-hooks
window-scroll-position
React hook for Window scroll position
Stars: ✭ 81 (-97.18%)
Mutual labels:  hook, react-hooks
use-route-as-state
Use React Router route and query string as component state
Stars: ✭ 37 (-98.71%)
Mutual labels:  hook, react-hooks

usehooks-ts banner


usehooks-ts

React hook library, ready to use, written in Typescript.

License npm bundle size npm All Contributors


npm i usehooks-ts

Created by Julien Caron and maintained with ❤️ by an amazing team of developers.

📖 Summary

🤝 How to Contribute

Thanks for wanting to contribute! It's more than welcome 🤗

Content changes

Most content changes (like fixing a typo) can be made without cloning the repository. Simply locate the file you wish to change in the GitHub UI, and click the little edit icon to make your change directly on the GitHub website.

If you need to make any other substantial changes, then follow the project setup steps below.

Fork to submit a Pull Request (PR)

Before starting, make sure you have the good system dependencies:

Note: To easily switch node version, consider Node Version Manager (nvm).

Then fork the repository, clone it and install.

git clone https://github.com/{your_username}/usehooks-ts.git
cd usehooks-ts
npm install

Create or update a new hook

# This command generates boilerplate for new hooks.
# Skip if updating an existed hook.
npm run plop

# Then develop the hook (aka test:watch)
npm run dev

# Once the hooks is ready
# Launch the documentation website
# Note: to build the website, you have to compile the usehooks-ts lib
# first, which create website content in the `website/generated` folder,
# used by Gatsby to create pages
cd website
npm install
npm run start

# Before commit: exec types-checking, linters and tests
cd ..
npm run test

How is structured a hook ?

📂 ./src
├── 📂 useHookName
│  ├── 📄 useHookName.demo.tsx # working demo
│  ├── 📝 useHookName.mdx # the documentation content
│  ├── 🧪 useHookName.test.ts # unit tests
│  └── 📄 useHookName.ts # the hook
...

When the usehooks-ts is compiled, only the necessary files are used. The other files are copied in the documentation website.

Note: The demo is used different way:

  • It's displayed on the website to illustrate how to use the hook.
  • It's deployed as a CodeSandbox on build to let final users play with.

Contributors

Big thanks goes to these wonderful people ❤️


Julien

🖋 💻 🎨 🤔

a777med

💻

Nguyen Tien Dat

💻

Elias Cohenca

🖋

João Deroldo

🐛 💻

Nishit

💻

Jon Koops

💻

LoneRifle

💻

Viktor

🤔 🐛

Bruno Clermont

💬

yoannesbourg

🤔

Strange2x

🤔

Jason Pickens

🐛

Sel-Vin Kuik

🐛

isaac

🐛

Bruno RZN

💻 👀

Nathan Manceaux-Panot

💻 👀

Dien Vu

🤔

Oleg Kusov

🤔

Matthew Guy

🤔

andrewbihl

🐛

lancepollard

🐛

Mukul Bansal

🐛

Jean-Luc Mongrain sur la Brosse

💻 🤔

Nic

🖋

Dan Wood

💻

jo wendenbuerger

🐛

Andrew Nosenko

🐛

CharlieJhonSmith

💻

Sullivan SENECHAL

🤔 🐛

Jason Long

🐛

kxm766

🐛

Quentin

💻 🤔 🖋

Daniel Lazar

💻 🐛

Mark Terrel

🐛 💻

Andreas Herd

🐛

Sonjoy Datta

💻

Ilya Belsky

🐛

James Barrett

💻

AbbalYouness

💻

didriklind

💻

hexp1989

💻

Alvaro Serrano

🖋

Egehan Dülger

💻

PabloLION

🐛 💻

David Sanchez

🐛

Ajay Raja

🐛

Andy Merskin

🤔

Avirup Ghosh

💻 🐛

Sanne Wintrén

🐛

Alessandro

🐛

Andrey Tatarenko

🐛

Anton Rusak

🐛

Mahmood Bagheri

💻

Anver Sadutt

🖋

Bogdan Ailincai

💻

Simeon Griggs

🐛

Kepro

🐛

Jake Lippert

🐛

Tu Nguyen Anh

🐛 💻

Luke Shiels

🐛

Sergei Kolyago

🤔

Adham Akmal Azmi

🐛

Alek Kowalczyk

🐛

Sean Callahan

🐛

Joshua Bean

💻

Tim Zhao

🐛

Patrick

🐛

Bryce Dorn

💻

angusd3v

💻

Kevin Dai

💻

Gomes

💻

Davide Di Simone

🐛

Jack Herrington

💻 🐛

Avi Sharvit

💻

Nicolae Maties

🐛

Shardul Aeer

🐛

Herlon Aguiar

🐛

Alexis Oney

🖋

curtvict

💻

Josué Cortina

🖋

Alex / KATT

💻

Mourad EL CADI

💻

James Hulena

💻

Matthew Hailwood

💻

Michael Norrie

🐛

Valentin Politov

💻

Marnus Weststrate

💻

This project follows the all-contributors specification (emoji key). Contributions of any kind welcome!

🚗 Roadmap

  • Unit-test all hooks
  • Add more hooks

📝 License

This project is MIT licensed.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].