TypeScript react-hooks

Open-source TypeScript projects categorized as react-hooks | Edit details

Top 23 TypeScript react-hook Projects

  • GitHub repo formik

    Build forms in React, without the tears 😭

    Project mention: Creating forms with Formik in React | dev.to | 2021-07-02

    Summing up, all we talked about was, the overview of formik, how it works, how it helps us in dealing with the messy operations involved in while dealing with a form, and how it lets us to focus on what's important, handling all the tedious work itself. Similar to formik there are other libraries as well, would really like to try out the alternate options available, but for now this was all I knew. Hope this article helped you in understanding the basics of formik. This piece of information only explains a very little part of what features and options we can avail but there is a lot more in it. You can read the Formik documentation for more understanding.

  • GitHub repo react-hook-form

    📋 React Hooks for forms validation (Web + React Native)

    Project mention: Form + Rich Text Editor recommendations? | reddit.com/r/nextjs | 2021-07-18

    I'm making (have made, actually, it's mostly done) a trivia app for use with friends. The problem I've having now is with my "create a quiz" page. It used to work fine with https://react-hook-form.com/ for the form, and TinyMCE for my rich text editor (using https://github.com/tinymce/tinymce-react). However, after updating to the latest version of Next and `react-hook-form`, it looks like it's refusing to validate the hidden inputs that get updated when I change the TinyMCE fields. Trying to troubleshoot it, but was wondering if anyone had something they recommend in place of either `react-hook-form` or TinyMCE? Thanks!

  • GitHub repo react-hooks-testing-library

    🐏 Simple and complete React hooks testing utilities that encourage good testing practices.

    Project mention: Testing with React-Testing-Library | reddit.com/r/reactjs | 2021-07-01

    Break the hooks out into their own file, with just the things you need returned from it (data1, data2, data3, loaded?) being returned then use https://github.com/testing-library/react-hooks-testing-library to test the hook in isolation (using jest.mock on axios)

  • GitHub repo constate

    React Context + State

    Project mention: Top 10 React Hooks Library | dev.to | 2021-06-20

    Constate hook provides lifting local state to React Context Level. So you can access/update state variables anywhere in the application with few lines of code. This is useful when you use the same state in multiple components. For example, you have Themes, Colors, Fonts used in multiple components, Users are allowed to change at one place and it should be reflected in the whole application. Package written in TypeScript and very compact.

  • GitHub repo reactfire

    Hooks, Context Providers, and Components that make it easy to interact with Firebase.

    Project mention: Firestore or MongoDB Atlas? | reddit.com/r/webdev | 2021-07-16

    I'd say go for firebase, if you want ease of development i'd say firebase, also check out ReactFire as it allows you to integrate firebase in an easy way with react, and it also gives you a bunch of react hooks. And of course for making native apps, firebase has apks/libraries for that.

  • GitHub repo haunted

    React's Hooks API implemented for web components 👻

    Project mention: Why LitElement isn't as good as React | dev.to | 2021-03-10

    ** WCs don't have to be classes. See matthewp/haunted which uses hooks like React. But that library is not a mixin or wrapper around lit-element; it would replace lit-element. It does use lit-html though.

  • GitHub repo use-http

    🐶 React hook for making isomorphic http requests

    Project mention: Top 10 React Hooks Library | dev.to | 2021-06-20

    use-http is a popular package that is used as a replacement for Fetch API. It's a well maintained library and easy to integrate in a few lines of code. Hooks written in TypeScript and support Server Side Rendering (SSR) and GraphQL. It returns a response, loading, error data and work with different request methods, Get, Post, Put, Patch and Delete.

  • GitHub repo react-firebase-hooks

    React Hooks for Firebase.

    Project mention: Using firebase for Authentication and RTK | reddit.com/r/reduxjs | 2021-04-07

    If you want, you can use useFirebaseAuth which takes care of onAuthStateChanged for you in a clean and simple way. That library also has useful hooks for working with Firestore and RTB.

  • GitHub repo rxjs-hooks

    React hooks for RxJS

    Project mention: Using RxJs on top of another state management solution(React-Query). | reddit.com/r/reactjs | 2021-06-19
  • GitHub repo use-debounce

    A debounce hook for react

    Project mention: Top 10 React Hooks Library | dev.to | 2021-06-20

    useDebounce hooks - it’s name represents - used for debouncing. It is used to postpone execution to a later time like setTimeout in React Native.

  • GitHub repo use-query-params

    React Hook for managing state in URL query parameters with easy serialization.

    Project mention: 10 useful react packages for Frontend | reddit.com/r/reactjs | 2021-07-12

    I like https://github.com/pbeshai/use-query-params

  • GitHub repo react-tracked

    State usage tracking with Proxies. Optimize re-renders for useState/useReducer, React Redux, Zustand and others.

    Project mention: What are Tuples and Records in JavaScript? | reddit.com/r/javascript | 2021-02-15

    The best, and perhaps only approach I have found so far is react-tracked. It does some internal tracking with proxies that I don't quite understand, but it actually works as advertised with a very minimal API.

  • GitHub repo web3-react

    🧰 A simple, maximally extensible, dependency minimized framework for building modern Ethereum dApps

    Project mention: Fetching Blockchain Data without a wallet connected | reddit.com/r/ethdev | 2021-04-07

    Hi! I'm using web3-react with ethers.js to connect users to my application. I have a smart contract function that calculates the current price of an ERC721 token based on the ID of the next token, and I want to fetch and display the result of that function always - even if a user does not have a wallet installed in their browser.

  • GitHub repo use-context-selector

    React useContextSelector hook in userland

    Project mention: Stop Background Views From Rendering on Context update? | reddit.com/r/reactnative | 2021-06-29

    You should try this: https://github.com/dai-shi/use-context-selector

  • GitHub repo react-useportal

    🌀 React hook for Portals

    Project mention: Top 10 React Hooks Library | dev.to | 2021-06-20

    usePortal hooks allow creation of elements outside the DOM hierarchy of the Application. usePortal widely used having dropdowns, notification popups, modals, tooltips. usePortal works with Server Side Rendering (SSR) as it is isomorphic. usePortal written in TypeScript. It allows customization of portal styling and many more options.

  • GitHub repo ignite-bowser

    Bowser is now re-integrated into Ignite CLI! Head to https://github.com/infinitered/ignite to check it out.

    Project mention: Best boilerplate | reddit.com/r/reactnative | 2021-04-05

    Built my latest app using https://github.com/infinitered/ignite-bowser

  • GitHub repo react-fetching-library

    Simple and powerful API client for react 👍 Use hooks or FACCs to fetch data in easy way. No dependencies! Just react under the hood.

  • GitHub repo React PDF viewer

    A React component to view a PDF document

  • GitHub repo use-what-changed

    A React hook and an easy to use babel-pugin to debug various React official hooks

    Project mention: As the creator of "why-did-you-render" I would like to ask you if and how do you use it? | reddit.com/r/reactjs | 2021-03-12

    Nowadays, I tend to opt for the useWhatChanged hook. Ergonomically it's a little easier, and its plug-and-play use makes it very attractive.

  • GitHub repo react-darkreader

    🌓 A React Hook for adding a dark / night mode to your site.

  • GitHub repo rnn-starter

    🤹 Production-ready starter for your next React Native App! Powered by cli-rn, React Native Navigation, RN UI lib, Mobx, Reanimated 2, Notifications, Permissions, Dark Mode, Localization, and much more.

    Project mention: cli-rn — making RN app developing experience as smooth as possible | dev.to | 2021-01-12

    When I came back to it in 2018, I found two great solutions: react-navigation and react-native-navigation. As I come from native app development, I was more interested in react-native-navigation and started contributing to the React Native community as much as I could. So I have started maintaining the starter which is based on react-native-navigation. With time, useful libraries and features were added to the starter based on the needs of the production-ready app.

  • GitHub repo react-use-wizard

    🧙 A React wizard (stepper) builder without the hassle, powered by hooks.

    Project mention: Build React wizards (stepper) without the hassle, powered by hooks. | reddit.com/r/reactjs | 2021-01-03
  • GitHub repo use-color

    🛼🛼🛼 The powerful color hook that all designers deserve. ✨ Parse and stringify that just works & 🦾 Strict type checking at compile time

    Project mention: useColor: The powerful color hook that all designers deserve - ✨ Parse and stringify that just works & 🦾 Strict type checking at compile time | reddit.com/r/reactjs | 2021-07-04

    Nice work, I like it! Made a PR to fix a small capitalization issue in the README https://github.com/junhoyeo/use-color/pull/1

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2021-07-18.

Index

What are some of the best open-source react-hook projects in TypeScript? This list will help you:

Project Stars
1 formik 27,761
2 react-hook-form 22,131
3 react-hooks-testing-library 3,726
4 constate 3,363
5 reactfire 2,644
6 haunted 2,035
7 use-http 1,928
8 react-firebase-hooks 1,926
9 rxjs-hooks 1,840
10 use-debounce 1,519
11 use-query-params 1,412
12 react-tracked 1,356
13 web3-react 1,300
14 use-context-selector 991
15 react-useportal 753
16 ignite-bowser 604
17 react-fetching-library 586
18 React PDF viewer 558
19 use-what-changed 244
20 react-darkreader 199
21 rnn-starter 196
22 react-use-wizard 182
23 use-color 161