Displaying 1 to 20 from 38 results

formik - Build forms in React, without the tears 😭

  •    TypeScript

By colocating all of the above in one place, Formik will keep things organized--making testing, refactoring, and reasoning about your forms a breeze.I (@jaredpalmer) wrote Formik while building a large internal administrative dashboard with @eonwhite. With around ~30 unique forms, it quickly became obvious that we could benefit by standardizing not just our input components but also the way in which data flowed through our forms.

rapscallion - Asynchronous React VirtualDOM renderer for SSR.

  •    Javascript

This function returns a Renderer, an interface for rendering your VirtualDOM element. Methods are enumerated below.This function evaluates the React VirtualDOM Element originally provided to the renderer, and returns a Promise that resolves to the component's evaluated HTML string.

react-flip-move - Effortless animation between DOM changes (eg

  •    Javascript

This module was built to tackle the common but arduous problem of animating a list of items when the list's order changes. CSS transitions only work for CSS properties. If your list is shuffled, the items have rearranged themselves, but without the use of CSS. The DOM nodes don't know that their on-screen location has changed; from their perspective, they've been removed and inserted elsewhere in the document.

rsuite - :package: A suite of React components .

  •    Javascript

RSUITE (React Suite) is a set of react component libraries for enterprise system products. Built by HYPERS front-end team and UX team, mainly serving company's big data products. After three major revisions, a large number of components and rich functionality have been accumulated.




the-platform - Web. Components. πŸ˜‚

  •    TypeScript

Note: React 16.8+ is required for Hooks. Detect and retrieve current device Motion.

tsdx - Zero-config CLI for TypeScript package development

  •    TypeScript

Despite all the recent hype, setting up a new TypeScript (x React) library can be tough. Between Rollup, Jest, tsconfig, Yarn resolutions, ESLint, and getting VSCode to play nicely....there is just a whole lot of stuff to do (and things to screw up). TSDX is a zero-config CLI that helps you develop, test, and publish modern TypeScript packages with ease--so you can focus on your awesome new library and not waste another afternoon on the configuration. Runs the project in development/watch mode. Your project will be rebuilt upon changes. TSDX has a special logger for your convenience. Error messages are pretty printed and formatted for compatibility VS Code's Problems tab.

react-css-components - Define React presentational components with CSS

  •    Javascript

Define React presentational components with CSS (or even SASS or Less if you like). The implementation is based on CSS modules. In fact React CSS Components is just a thin API on top of CSS modules.


react-suspense-starter - Experiment with React Suspense right meow.

  •    Javascript

So you can get ahead of it all... To get started, clone this repository and install the dependencies.

react-magic-hat - 🎩✨Library to implement the Magic Hat technique, blazingly fast πŸš€

  •    Javascript

React implementation of what I call the Magic Hat UI technique [DEMO]. πŸš€ Blazing fast. 60+ FPS hardware-accelerated CSS transforms, using the FLIP technique. Fluid and performant. Thanks to react-flip-move for that.

react-tiny-dom - πŸ™ A minimal implementation of react-dom using react-reconciler

  •    Javascript

react-tiny-dom is a minimal implementation of react-dom as custom renderer using React 16 official Renderer API. The purpose of this project is to show the meaning of each method of the ReconcilerConfig passed to react-reconciler, by using a practical yet familiar environment: the browser DOM.

react-persist - πŸ’Ύ Persist and rehydrate React state to localStorage.

  •    Javascript

Persist and rehydrate React state to localStorage.Just import the <Persist > component and pass it the data you want it to persist. It renders null, so it can go wherever you need it to....

react-retro-hit-counter - πŸ†• Go back in time with this 90s-style hit counter.

  •    Javascript

Remember when the web was this quirky place full of "Under Construction" clipart, guestbooks, and web rings? The time when animated GIFs were used for everything - background images, cursors, nothing was off-limits. The time before we learned that BonziBuddy was actually malware. Sometimes I miss the 90s web. This is a small gesture to help share some of that nostalgia.

formik-effect - Declarative component for managing side-effects in Formik forms. 580 bytes

  •    TypeScript

Declarative Formik component for side-effects. Use with caution. Please. I. beg. you. Formik is an uncontrolled component. However, there are times when you want to trigger a side effect based on a state change. By design, Formik does not expose a prop for you to do this because I'm terrified as to how it would be abused--it encourages people to attempt to "sync" Formik's state in elsewhere (cough like in a Redux store cough cough). Anyways, please don't do that. You never ever ever ever want to store the same state in 2 places in a React application because it is almost impossible to keep them in sync unless you are a goddamn jedi. You may think it's working, and high five a teammate, but you are a just a lifecycle method away from lots and lots of pain and I can guarantee you are not considering all the edge cases. Sooooo....

react-router-suspense-demo - React Suspense x React Router Exploration

  •    Javascript

React Suspense x React Router demo that shows how you could create a routes that would take care of loading states so inner components don't have to. Credit goes to Jack Cross (@crosscompile) for the AsyncRouter implementation.