~reactstatus | Bookmarks (24)

semantic-autocomplete: A Fast Semantic Search Component — An interesting proof of concept where you can let users search by meaning, not just by matching characters. There’s a live demo here. It uses a ~20MB machine learning model (small by ML standards) on the client side to make it work quickly.

use-local-storage-state: Like useState() But for Local Storage — A hook that persists data in localStorage while having an API similar to useState().

use-hot-module-reload: Trigger a Callback After Hot Module Reloading — A hook that triggers a callback after hot-module reloading has been performed (for any module, not just the one it was used in) – works with Webpack and Vite.

react-resize-aware: A Hook That Listens to Resize Events — Detect resize events on elements without relying on intervals, loops, DOM manipulation detection or CSS redraws. v4.0 now supports Vite.

📺 react-tv-space-navigation: Spatial Navigation for TV Apps — “If you want to develop a TV app for AndroidTV + tvOS + web TV devices, then this package will be helpful. The library is based on LRUD, which is a UI-agnostic lib that represents spatial navigation.”

react-json-view-lite: Render JSON as a Tree — A lightweight component for visualizing JSON in a way that retains its basic formatting and JSON-ness but that lets you collapse or expand arrays and objects and see the structure more easily. Storybook demos.

React Geiger: A Way to Hear React Performance Issues — The output is hardly a mellifluous three voice fugue, but Geiger provides an interesting way to make React performance audible by making clicking sounds (akin to a Geiger counter) when things take longer to run than you desire. There’s a live demo but note you may need to refresh or give extra permission for...

React Native SVG 15: SVG Library for React Native — There’s also a compatibility layer to let it work with regular React on the Web too. v15 notably introduces visionOS support.

Mountaineer: 'Batteries-Included' Framework for Python and React — JavaScript is often assumed to be powering the backend of React apps, but that’s far from a requirement. Mountaineer provides a rather Create-React-App-esque experience but using Python for the backend.

Universal App Example using React Native for Vision Pro — A universal example developed using React Native for Vision Pro and iPhone. It’s inspired by Apple’s Hello World example for VisionOS.

react-print-pdf: A UI Kit for PDFs and Print Documents — An abstraction for building and generating PDFs using components in React and JSX. It uses Onedoc or Prince XML behind the scenes for the eventual PDF generation, so your mileage may vary.

React Tag Autocomplete 7.2 — A flexible, accessible tagging component that makes it easy to guide users in the right direction when entering tags. Check out the live demo to see it in action.

react-document-picture-in-picture: A Component for an Experimental Web Picture-in-Picture API — While the Document Picture-in-Picture API does not yet enjoy universal browser support, here’s a chance to give it a go from React, if you’d like to see certain content ‘stay on top’. (There's a live demo.)

React Pro Sidebar 1.1: Customizable Side Navigation Components — A sidebar solution which comes with a solid live demo and Storybook.

react-native-fast-trie: A Fast C++-Powered Trie — A fast, memory-efficient trie data structure implementation for React Native implemented in C++ and made available via JSI (RN's JavaScript interface for native code).

React Interview Questions and Answers — If you’re looking for a job and preparing for interviews, or if you just want to revise your overall knowledge, you might find this long standing resource useful, even if it just gives you some areas to research (or, better, inspires you to contribute some fixes!)

react-use: A Large Collection of Useful Hooks — A bumper packed collection, covering things from tracking battery state and geolocation to setting favicons, debouncing, and playing videos.

React Image Crop: A Responsive Image Cropping Control — Responsive, touch enabled, keyboard accessible, and with no dependencies to boot. There’s a CodeSandbox demo if you want to try it out.

Create Rust App: A Rust + React App in One Command — If you’re all aboard the Rust train, this may be for you.

react-medium-image-zoom: Medium․com-Inspired Image Zooming — If you like the zoom-in effect that Medium has for images, this is for you. Examples. (Hopefully we never ever see a component to implement Medium’s annoying login wall..) 😏

react-resize-detector: Event-Based, Element Resize Detection — Modern browsers have native support for detecting element size changes by way of ResizeObserver. This library makes them even easier to use from React apps. Live demo.

⏱ React Chrono 2: A Flexible Timeline Component — 2023 saw a complete overhaul of this popular library. You can render themeable timelines in vertical, horizontal, or vertical alternating orientations. It includes keyboard navigation support, auto advancement, and, with v2, support for nested timelines.