React OpenSource List

More Web Widgets can be found in Web Widgets Links.

Showcase

• 2018-react kanban : A Trello-like application built with React and Redux.

• 2018-devhub : DevHub: TweetDeck for GitHub - Android, iOS, Web & Desktop

• x : Desktop environment in the browser.

• 2021-Podcastr : A platform built for podcast broadcasting. Developed during @Rocketseat NLW#05 free training.

• 2021-Fakeflix : Not the usual clone that you can find on the web.

Scratch

• 2017-Didact : This repository goes together with a series of posts that explains how to build React from scratch step by step.

• 2018-Gooact: React in 160 lines of JavaScript : How to build own React clone in a matter of minutes.

Boilerplate

• 2020-bulletproof-react : 🛡️ ⚛️ A simple, scalable, and powerful architecture for building production ready React applications.

• 2021-Windows 11 in React : This open source project is made in the hope to replicate the Windows 11 desktop experience on web, using standard web technologies like React, CSS (SCSS), and Js.

Internals

• re-implement react fiber : react-fiber is my self-study project help me understand how react work.

• Didact : A DIY guide to build your own React.

Development Tools | 开发工具

Scaffold

• react-styleguidist : Isolated React component development environment with a living style guide.

Tools

• Rekit : Toolkit for building scalable web applications with React, Redux and React-router

• react-armor : Protect your DOM from third-party tampering.

• eslint-plugin-react : React specific linting rules for ESLint.

• jsinspect : Detect copy-pasted and structurally similar code.

Performance Optimization | 性能优化

• why-did-you-update : Puts your console on blast when React is making unnecessary updates.

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

• 2021-million : Million is an extremely fast and lightweight (<4kb) virtual DOM that makes React components up to 70% faster.

Development Libraries

• React Canvas : High performance <canvas> rendering for React components.

• react-spectrum : A collection of libraries and tools that help you build adaptive, accessible, and robust user experiences.

• Blitz : Blitz is a batteries-included framework that’s inspired by Ruby on Rails, is built on Next.js, and features a “Zero-API” data layer abstraction that eliminates the need for REST/GraphQL.

Component Libraries

• 2020-Radix : Radix Primitives is an open-source UI component library for building high-quality, accessible design systems and web apps. Maintained by @workos.

Data Fetch

• 2019-SWR : SWR is a React Hooks library for remote data fetching. The name “SWR” is derived from stale-while-revalidate, a HTTP cache invalidation strategy popularized by RFC 5861. SWR first returns the data from cache (stale), then sends the fetch request (revalidate), and finally comes with the up-to-date data again.

• 2019-React Query : ⚛️ Hooks for fetching, caching and updating asynchronous data in React.

Component Utilities

• recompose : A React utility belt for function components and higher-order components.

• svgr : Transform SVG into React components

• 2017-React Loadable : A higher order component for loading components with promises.

• hocs : A collection of Higher-Order Components for React and React Native.

Hooks

• umijs/hooks : React Hooks Library.

Animation

• react-spring : Helping react-motion and animated to become best friends

• 2017-react-move : Beautifully and deterministically animate anything in React.

• react-flight : The best way to build animation compositions for React. Design and compose a component to start with, a component to end with, and Flight will take it from there.

• React Reveal : Easily add reveal on scroll animations to your React app.

CSS-in-JS

• styled-components :Visual primitives for the component age

Test

• 2017-react-cosmos : Sandbox for developing and testing UI components in isolation