awesome-react-hooks
Awesome React Hooks Resources
Documentation
Discussions
Tutorials
- "Making Sense of React Hooks" by Dan Abramov
- "From React.Component to hooks" by Octave Raimbault
- "React Hooks: What’s going to happen to my tests?" by Kent C. Dodds
- "State Management with React Hooks - No Redux or Context API" by André Gardi
- "How to Fetch Data with React Hooks?" by Robin Wieruch
- Primer on React Hooks
- React Hooks - A deeper dive featuring useContext and useReducer
- "Using Custom React Hooks to Simplify Forms" by James King
- Testing of a Custom React Hook for Fetching Data with Axios
- The Guide to Learning React Hooks (Examples & Tutorials) by Eric Bishard
Videos
-
:clapper: ReactConf 2018: React Today and Tomorrow by Sophie Alpert and Dan Abramov Official announcement and first demo. -
:clapper: ReactConf 2018: 90% Cleaner React by Ryan Florence -
:clapper: React Hooks: A Complete Introduction by Harry Wolff -
:clapper: React Hooks playlist by Ben Awad -
:clapper: React Hooks playlist by Josh Ribakoff -
:clapper: React Hooks playlist by Michael Chan
Podcasts
Tools
-
eslint-plugin-react-hooks
-
hooks.macro
Babel Macros for automatic memoization invalidation - CodeSandbox Starter Kit
- React Hooks Snippets for VS Code
-
hook-into-props
Helper to build HOCs using hooks. Useful for using hooks with class components. -
react-universal-hooks
React Universal Hooks: just use****** everywhere, Functional or Class Components - Jooks Unit-test your custom hooks by mocking React's Hooks API (useState, etc.)
-
react-hooks-testing-library
Library to create unit tests for custom React hooks.
Catalogs
-
@umijs/hooks(
:rice: ) A collection of React Hooks specifically aiming at enterprise applications. - Captain hook Modest list of hooks.
- crooks A collection of unique React Hooks.
- hooks-by-example Collection of beginner-friendly real world examples of hook usage.
- Hooks.guide Collection of React hooks curated by the community.
-
react-recipes
:woman::egg: Collection of essential hook recipes - Searchable Collection of React Hooks
-
Sunflower(
:sunflower: ) Collection of React Hooks returning components of antd. -
useHooks(
:tropical_fish: ) One new React Hook recipe every day. - Use Hooks A collection of reusable React Hooks.
-
beautiful-rect-hooks(
:fire: ) A collection of hooks to speed-up your components and custom hooks development.
Packages
-
@21kb/react-hooks
A set of React Hooks to get hooked on. -
@d2k/react-devto
React hook for Dev.to API requests -
@d2k/react-github
React hook for Github API requests -
@d2k/react-localstorage
React hook that handles updating and clearing localstorage values while keeping them in sync with your components. -
@hookstate/core
Modern, very fast and extendable state management for React. -
@jzone/react-request-hook
:dog: React hook for custom request,compatible with various lib, support redux -
@kevinwolf/formal
Elegant form management primitives for the react hooks era. -
@marvelsq/use-properties-hook
Instance functions inside FunctionComponent likeclass-properties
and equal inShallowCompare
-
@rehooks/component-size
React hook for determining the size of a component. -
@rehooks/document-title
React hook for updating the document-title. -
@rehooks/document-visibility
React hook for subscribing to document visibility. -
@rehooks/input-value
React hook for creating input values. -
@rehooks/local-storage
React hook which syncslocalStorage[key]
with the comp. -
@rehooks/network-status
React hook for getting network-status. -
@rehooks/online-status
React Hook for Online status. -
@rehooks/window-scroll-position
React hook for getting windowx
andy
position. -
@rehooks/window-size
React hook for subscribing to window size. -
@rekindle/use-request
-
@staltz/use-profunctor-state
React Hook for state management with Profunctor Optics -
@withvoid/melting-pot
React hook utility library. -
constate
Transform your local state into global state usinguseContextState
anduseContextReducer
. -
conuse
Share Hook with Context -
easy-peasy
Easy peasy global state for React. -
fetch-suspense
React hook for the Fetch API with support for Suspense. -
graphql-hooks
Minimal hooks-first GraphQL client. -
mobx-react-lite
Lightweight React bindings for MobX based on experimental React hooks. -
modali
A delightful modal dialog component for React, built from the ground up to support React Hooks. -
moment-hooks
A library containing generic react hooks -
nice-hooks
:tropical_drink: A lot of nice hooks to make react hooks easier to use ( useState callback / life cycle / instance variable) -
promise-hook
React hook for simplifying Promise based data fetching. -
react-async-hook
React hook to fetch ad-hoc data into your React components. -
react-cached-callback
React hooks for caching many callbacks by key, for example, in loops. -
react-context-refs
React hooks for getting refs of elements via context. -
react-cool-onclickoutside
-
react-declare-form
React hook based declarative form library. -
react-dom-status-hook
React hook for subscribing to theDOMContentLoaded
event. -
react-enhanced-reducer-hook
An alternative touseReducer
that accepts middlewares. -
react-fetch-hook
React hook for conveniently use Fetch API. -
react-firebase-hooks
A collection of hooks for use with Firebase . -
react-form-stateful
Form library. Exposes dispatch to allow for the library to be extended through side effects. -
react-hanger
A small collection of utility hooks. -
react-hook-mighty-mouse
React hook that tracks mouse events on selected element:mouse: -
react-hook-mousetrap
A hook to trigger callbacks on keys or keys combos, powered by mousetrap. -
react-hookedup
A collection of useful React hooks. -
react-hooks-easy-redux
React hooks for Redux with Proxy-based auto-detection of state usage. -
react-hook-form
Form validation without the hassle. -
react-hooks-global-state
A simple global state management. -
react-hooks-image-size
Hook to get natural image size from url. -
react-hooks-lib
A set of reusable react hooks. -
react-hooks-svgdrawing
A hooks to svg drawing. -
react-hooks-use-modal
A hook to open the modal easily. -
react-hooks-visible
A hook to element visibility. Uses the intersection observer API. -
react-hotkey-hook
React hook for hotkeys. -
react-i18next
Internationalization for react done right. -
react-immer-hooks
useState and useReducer using Immer to update state. -
react-indicative-hooks
Hooks wrapping a data validation library called Indicative -
react-intersection-visible-hook
React hook to track the visibility of a functional component. -
react-media-hook
React hook for Media Queries. -
react-metatags-hook
React Hook to manage html meta tags. -
react-page-name
React Hook for managing the page title. -
react-peer-data
React wrapper for PeerData library for files, media streaming/sharing using WebRTC. -
react-pirate
React lifecycle and utilities hooks. -
react-powerhooks
Hooks api for react-powerplug components. -
react-promiseful
A React component and hook to render children conditionally based on a promise status. -
react-recaptcha-hook
React hook for google-recaptcha v3 -
react-recipes
:woman::egg: Collection of essential hook recipes -
react-request-hook
Managed, cancelable and safe-oriented api requests. -
react-rocketjump
Manage state and side effects like a breeze. -
react-script-hook
React hook to dynamically load an external script and know when its loaded -
react-selector-hooks
Collection of hook-based memoized selector factories for declarations outside of render. -
react-speech-kit
Hooks for browser Speech Recognition and Speech Synthesis. -
react-state-patterns
Utility package for creating reusable implementations of React state provider patterns from hooks. -
react-swipeable
React swipe event handler hook. -
react-use-api
Async HTTP request data for axios. Designed for diverse UI states, SSR and data pre-caching. -
react-use-browser
A hook enabling client side hydration of Server-Side-Rendered components when server-produced markup needs to differ from the final client application markup. -
react-use-calendar
A hook for implementing a calendar with events. -
react-use-clipboard
A hook that copies text to a user's clipboard. -
react-use-data-loader
React hook for loading data -
react-use-fetch-factory
React hook that takes care of fetching and selecting data with redux. -
react-use-form-state
React hook for managing form and inputs state. -
react-use-id-hook
React hook for generating SSR-safe unique id strings. -
react-use-idb
React hook for storing value in the browser usingindexDB
. -
react-use-input
:fishing_pole_and_fish: A hook whose setter can be directly given to HTML inputs -
react-use-lazy-load-image
:sunrise: :zap:️ Add image lazy loading to your React app with ease -
react-use-modal
React hook for manage modal. -
react-use-path
The tiniest hook style react router. -
react-use-scroll-position
React hook for using the scroll position. -
react-use-trigger
React hook for trigger effect from any place of code -
react-use-wavelet
React hooks for connecting to the Wavelet smart-contract platform -
react-use
Collection of essential hooks. -
react-useFormless
React hook to handle forms state. -
react-usemiddleware
React hook for using existing Redux middlewares (like thunk or saga) withuseReducer
. -
react-useportal
:cyclone: usePortal, React hook for Portals -
react-user-media
React wrapper fornavigator.getUserMedia
. -
react-wait
Complex Loader Management Hook for React Applications. -
react-window-communication-hook
React hook to communicate among browser contexts (tabs, windows, iframes). -
react-with-hooks
Ponyfill for the proposed React Hooks API. -
reaktion
useState like hook for global state management. -
redhooks
Global state management with React Hooks. It also supports the use of middleware like redux-thunk or redux-saga or your own custom middleware. -
redux-react-hook
React hook for accessing mapped state from a Redux store. -
region-core
A global state management framework with a hookuseProps
. -
rehooks-visibility-sensor
It checks whether an element has scrolled into view or not. -
resynced
Multiple state management using React Hooks API. -
reto
Flexible and efficient React store with hooks. -
rrh
Super Simple React Hooks for react-redux. -
rxjs-hooks
An easy way to use RxJS v6+ with react hooks. -
scroll-data-hook
Returns information about scroll speed, distance, direction and more. -
style-hook
:art: wirte css in js with react hooks. -
the-platform
Browser API's turned into React Hooks and Suspense-friendly React elements for common situations. -
trousers
:jeans: A hooks-first CSS-in-JS library, focused on semantics and runtime performance -
use-abortable-fetch
React hook that does a fetch and aborts when the components is unloaded or a different request is made. -
use-action
Almost same to useEffect, but not deferred. -
use-async-memo
React hook for generating async memoized data. -
use-axios-react
React CRUD hooks for axios, comprehensive list of examples -
use-browser-history
A React hook to handle browser history events. -
use-cart
A React hook that gives you shopping cart functionality. -
use-clippy
A React hook to reading from and writing to the user's clipboard. -
use-debounce
A debounce hook for React. -
use-deep-compare
It's react's useEffect/useMemo/useCallback hooks, except using deep comparison on the inputs. -
use-deep-compare-effect
:whale2: It's react's useEffect hook, except using deep comparison on the inputs, not reference equality. -
use-detect-print
React hook to detect when a page is being printed. -
use-dimensions
React Native hook for getting screen and window dimensions. -
use-eazy-auth
React hooks for handle auth stuff. -
use-events
A set of React Hooks to handle mouse events. -
use-force-update
React hook for forcing re-render of a functional Component. -
use-hotkeys
HotKeys.js React Hook that listen to keydown and keyup keyboard events, defining and dispatching keyboard shortcuts. -
use-http
:dog: useFetch, React hook for making isomorphic http requests. -
use-immer
A hook to use immer to manipulate state. -
use-media
CSS media queries with React hook. -
use-mouse-action
React Hooks to listen to both mouse down or up and click events with a once called function. -
use-multiselect
Manage multiselect state. -
use-popper
React hook wrapper around Popper.js. -
use-react-modal
-
use-react-router
React Hook for pub-sub behavior using React Router. -
use-reactive-state
useReactiveState()
- a reactive alternative to React'suseState()
. -
use-redux
A hook to bind redux . -
use-simple-undo
Simple implementation of undo/redo functionality. -
use-socketio
React hooks to use with https://socket.io/ . -
use-socket.io-client
React hook for socket.io-client, manipulate socket.io client without any side effect. -
use-ssr
☯️ React hook to determine if you are on the server, browser, or react native. -
use-state-snapshots
A React hook to keep track of state changes for undo/redo functionality. -
use-substate
React hook for subscribing to your single app state (works with your current Redux app). -
use-t
Multi-language using hooks. -
use-undo
React hook to implement Undo and Redo functionality. -
useDarkMode
A custom React Hook to help you implement a "dark mode" component. -
useEmailAutocomplete
:mailbox_with_mail: React hook for email autocomplete inputs. -
usePosition
React hook to get position top left of an element. -
useScreenType
Determining screen size type for Bootstrap 4 grid. -
useScrollSpy
React hook to automatically update navigation based on scroll position. -
useValueAfter
Very simple React hook to easily provide different props to a component (comes in handy for testing edge cases)
以上所述就是小编给大家介绍的《????An awesome list of React hooks libraries and resources》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!
猜你喜欢:本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。