Pre Development
Components
Components that are visually appealing and easy to use. These components let us not re-invent the wheel.
Headless Components
Components that don't force a design on you.
| Link |
Description |
| React Table |
Lightweight and extensible data tables for React |
| React Albus |
Component library for building declarative multi-step flows. |
| React Selected |
React component to build flexible and accessible radio buttons/elements. |
Libraries
| Link |
Description |
| Ably |
Ably is the platform that powers realtime messaging service. |
| Prisma |
ORM with an open source database toolkit for PostgreSQL, MySQL, SQL Server, SQLite and MongoDB |
| React Flip Toolkit |
A lightweight magic-move library for configurable layout transitions |
| Next-Auth (NextJs) |
Authentication for Next.js |
Debugging
| Link |
Description |
| Why Did You Render |
why-did-you-render patches React to notify you about potentially avoidable re-renders. (Works with React Native as well.) |
References
Accessibility
WAI-ARIA provides a specification to communicate visual ideas to screen-readers, allowing developers to make a website that is visually exciting and innovative while still being understandable to visually impaired users. Some libraries that help us achieve that in React are:
| Link |
Description |
| React Aria |
React Aria by Adobe provides accessibility and behavior according to WAI-ARIA Authoring Practices |
| Reach UI |
Reach UI seeks to become the accessible foundation of your React-based design system. |
| Radix UI |
Unstyled, accessible components for building high‑quality design systems and web apps in React. |
| Headless UI |
Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS. |