{"id":140,"url":"https://github.com/glauberfc/awesome-react-hooks","last_synced_at":"2025-09-27T07:30:57.252Z","repository":{"id":40321136,"uuid":"154741764","full_name":"glauberfc/awesome-react-hooks","owner":"glauberfc","description":"A curated list about React Hooks","archived":false,"fork":false,"pushed_at":"2024-03-16T18:57:43.000Z","size":103,"stargazers_count":1165,"open_issues_count":13,"forks_count":89,"subscribers_count":26,"default_branch":"master","last_synced_at":"2024-05-20T04:08:17.221Z","etag":null,"topics":["awesome","awesome-list","hooks","react","react-hooks"],"latest_commit_sha":null,"homepage":"","language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"cc0-1.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/glauberfc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"contributing.md","funding":null,"license":"LICENSE.md","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2018-10-25T21:46:34.000Z","updated_at":"2024-05-17T13:59:04.000Z","dependencies_parsed_at":"2024-04-14T04:40:08.799Z","dependency_job_id":"45fd7109-efeb-4690-91b0-843627369b91","html_url":"https://github.com/glauberfc/awesome-react-hooks","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/glauberfc%2Fawesome-react-hooks","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/glauberfc%2Fawesome-react-hooks/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/glauberfc%2Fawesome-react-hooks/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/glauberfc%2Fawesome-react-hooks/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/glauberfc","download_url":"https://codeload.github.com/glauberfc/awesome-react-hooks/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234409997,"owners_count":18828115,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["awesome","awesome-list","hooks","react","react-hooks"],"created_at":"2024-01-05T20:12:47.480Z","updated_at":"2025-09-27T07:30:57.198Z","avatar_url":"https://github.com/glauberfc.png","language":null,"readme":"# Awesome React Hooks [![Awesome](https://awesome.re/badge-flat.svg)](https://awesome.re)\n\n[\u003cimg src=\"https://user-images.githubusercontent.com/15311858/47717137-ab421180-dc23-11e8-9ee8-a0de40260113.png\"\u003e](https://reactjs.org/docs/hooks-intro.html)\n\nA curated list about React Hooks.\n\n\u003e _Hooks are a new addition in React 16.8. They let you use state and other React features without writing a class._\n\n## Contents\n\n- [Hooks](#hooks)\n- [Tutorials/Articles/Workshops](#tutorialsarticlesworkshops)\n- [Discussions](#discussions)\n- [Examples](#examples)\n- [Extensions/Libraries](#extensionslibraries)\n\n## Hooks\n\n- [Introducing Hooks](https://reactjs.org/docs/hooks-intro.html)\n- [Hooks at a Glance](https://reactjs.org/docs/hooks-overview.html)\n- [Using the State Hook](https://reactjs.org/docs/hooks-state.html)\n- [Using the Effect Hook](https://reactjs.org/docs/hooks-effect.html)\n- [Rules of Hooks](https://reactjs.org/docs/hooks-rules.html)\n- [Building Your Own Hooks](https://reactjs.org/docs/hooks-custom.html)\n- [Hooks API Reference](https://reactjs.org/docs/hooks-reference.html)\n- [Hooks FAQ](https://reactjs.org/docs/hooks-faq.html)\n\n## Tutorials/Articles/Workshops\n\n- [React Today and Tomorrow and 90% Cleaner React](https://www.youtube.com/watch?v=dpw9EHDh2bM) - Dan Abramov and Sophie Alpert.\n- [Making Sense of React Hooks](https://medium.com/@dan_abramov/making-sense-of-react-hooks-fdbde8803889) - Dan Abramov.\n- [React Hooks and Suspense](https://egghead.io/playlists/react-hooks-and-suspense-650307f2) - Kent C. Dodds.\n- [React Hooks \u0026 testing: Stepping through React code](https://youtu.be/JQeB9miT9Wc) - Kent C. Dodds.\n- [My Thoughts on React Hooks](https://youtu.be/gmF4k6P2va8) - Ben Awad.\n- [Fetching Data from an API with React Hooks useEffect](https://youtu.be/k0WnY0Hqe5c) - Ben Awad.\n- [Are React Hooks Slower than Class Components?](https://youtu.be/tKRWuVOEB2w) - Ben Awad.\n- [Building a Todo List with React Hooks useState](https://youtu.be/cAZ-fOd1RpA) - Ben Awad.\n- [Using React Hooks vs. Class Components](https://youtu.be/vbaIZ3xMj9U) - Ben Awad.\n- [Using Immer with Reducers and React Hooks](https://youtu.be/FmKjwh34Rn8) - Ben Awad.\n- [React Hooks useContext](https://youtu.be/xWXxkFzgnFM) - Ben Awad.\n- [Everything you need to know about React Hooks](https://medium.com/@vcarl/everything-you-need-to-know-about-react-hooks-8f680dfd4349) - Carl Vitullo.\n- [Hooks in react-spring, a tutorial](https://medium.com/@drcmda/hooks-in-react-spring-a-tutorial-c6c436ad7ee4) - Paul Henschel.\n- [React Hooks: Notes Taken](https://medium.com/@tomaskonrady/react-hooks-notes-taken-c42376af3ab0) - Tomáš Konrády.\n- [Getting Started with React Hooks](https://scotch.io/tutorials/getting-started-with-react-hooks) - Chris Sevilleja.\n- [React hooks: not magic, just arrays](https://medium.com/@ryardley/react-hooks-not-magic-just-arrays-cd4f1857236e) - Rudi Yardley.\n- [Why React’s new Hooks API is a game changer](https://itnext.io/why-reacts-hooks-api-is-a-game-changer-8731c2b0a8c) - Rudi Yardley.\n- [Writing Custom React Hooks for GraphQL](https://medium.com/open-graphql/react-hooks-for-graphql-3fa8ebdd6c62) - Nader Dabit.\n- [Manage global state with React Hooks](https://medium.com/@Charles_Stover/manage-global-state-with-react-hooks-6065041b55b4) - Charles Stover.\n- [React Hooks: Managing Web Sockets with useEffect and useState](https://medium.com/@rossbulat/react-hooks-managing-web-sockets-with-useeffect-and-usestate-2dfc30eeceec) - Ross Bulat.\n- [Primer on React Hooks](https://testdriven.io/blog/react-hooks-primer/) - Austin Johnston.\n- [React Hooks - A deeper dive featuring useContext and useReducer](https://testdriven.io/blog/react-hooks-advanced/) - Austin Johnston.\n- [Advanced React Hooks Workshop](https://github.com/kentcdodds/advanced-react-hooks) - Kent C. Dodds.\n\n## Discussions\n\n- [v6 Candidate Preview: Use React Hooks for connect](https://github.com/reduxjs/react-redux/pull/1065) - Mark Erikson.\n- [RFC: React Hooks](https://github.com/reactjs/rfcs/pull/68) - Sebastian Markbåge.\n- [Using Hooks in React Native](https://github.com/facebook/react-native/issues/21967#issuecomment-434113687) - Héctor Ramos.\n\n## Examples\n\n- [Color Match](https://codesandbox.io/s/jjy215l7w3) - Color Match Game.\n- [React Hooks counter](https://codesandbox.io/s/yjn90lzwrx?module=%2Fsrc%2FApp.js) - Counter using useState of React Hooks.\n- [Toggle component](https://codesandbox.io/s/m449vyk65x) - Toggle component made with React Hooks.\n- [Hooks test](https://github.com/jacobp100/hooks-test) - Somewhat complicated use case solved relatively nicely with React Hooks.\n- [React Hanger](https://github.com/kitze/react-hanger) - React Hanger example.\n- [React Navigation Hooks](https://github.com/react-navigation/react-navigation-hooks) - React hooks for convenient react-navigation use.\n- [Haunted](https://github.com/matthewp/haunted) - React's Hooks API implemented for web components.\n- [useHooks](https://usehooks.com/) - Easy to understand React Hook recipes by [Gabe Ragland](https://twitter.com/gabe_ragland).\n- [Collection of React Hooks](https://nikgraf.github.io/react-hooks/) - Collection of React Hooks.\n- [React Spring demo](https://codesandbox.io/s/ppxnl191zx) - Demo of how react-spring could use React Hooks as a new API.\n- [React Hooks](https://codesandbox.io/s/yq5qowzrvz) - React Hooks useState() and useEffect().\n- [Hooks Todo App](https://codesandbox.io/s/9kwyzy0y4) - App made with React Hooks.\n- [react-thanos](https://github.com/codeshifu/react-thanos) - React hooks implementation of Google's Thanos easter egg.\n\n## Extensions/Libraries\n\n- [redux-react-hook](https://github.com/facebookincubator/redux-react-hook) - React Hook for accessing state and dispatch from a Redux store.\n- [react-use](https://github.com/streamich/react-use) - Collection of essential React Hooks.\n- [The Platform](https://github.com/palmerhq/the-platform) - Browser API's turned into React Hooks and Suspense-friendly React elements for common situations.\n- [eslint-plugin-react-hooks](https://www.npmjs.com/package/eslint-plugin-react-hooks) - This plugin enforce rule of hooks to avoid common mistakes.\n- [react-hooks-lib](https://github.com/beizhedenglong/react-hooks-lib) - A set of reusable React Hooks.\n- [use-immer](https://github.com/mweststrate/use-immer) - A hook to use immer as a React hook to manipulate state.\n- [react-hanger](https://github.com/kitze/react-hanger) - A small collection of useful hooks for React 16.7.\n- [react-firebase-hooks](https://github.com/csfrequency/react-firebase-hooks) - A set of reusable React Hooks for Firebase.\n- [react-intersection-visible-hook](https://github.com/AvraamMavridis/react-intersection-visible-hook) - React hook to track the visibility of a functional component based on IntersectionVisible Observer.\n- [use-timer](https://github.com/thibaultboursier/use-timer) - Simple React hook to handle timer.\n- [react-native-hooks](https://github.com/react-native-community/react-native-hooks) - React Native APIs turned into React Hooks for use in stateless React components.\n- [react-with-hooks](https://github.com/yesmeck/react-with-hooks) - Ponyfill for the proposed React Hooks API.\n- [react-hooks-screen-type](https://github.com/pankod/react-hooks-screen-type) - Determining screen size type for Bootstrap 4 grid.\n- [use-http](https://github.com/alex-cory/react-usefetch) - React hooks for making isomorphic HTTP requests.\n- [react-fetch-hook](https://github.com/ilyalesik/react-fetch-hook) - React hook for conveniently use Fetch API.\n- [storeon](https://github.com/storeon/storeon) - hook-based state manager in 173 bytes.\n- [react-hook-form](https://github.com/bluebill1049/react-hook-form) - Performance, flexible and extensible forms with easy to use for validation.\n\n## License\n\nAwesome React hooks is [CC0 licensed](/LICENSE.md).\n","funding_links":[],"categories":["Front-End Development","Technical","Other Lists","Others","Uncategorized","React.js","Live Site:   [searchAwesome](https://search-awesome.vercel.app/)","前端开发","Other Awesome React Lists (and Blogs)","Themed Directories"],"sub_categories":["awesome-*","TeX Lists","Uncategorized","Misc"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fglauberfc%2Fawesome-react-hooks","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fglauberfc%2Fawesome-react-hooks","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fglauberfc%2Fawesome-react-hooks/lists"}