~reactstatus | Bookmarks (202)

How to Build a Better React Map with Pigeon Maps and Mapbox — A dev consultancy wanted to have a map on their site of where their employees had given talks around the world. This is a complete walkthrough of the project from defining the requirements through to actually making it live (here, as it happens).

Jotai 2.0: Flexible State Management for React — The v2 migration guide offers more detail on what’s new and what changed.

New Courses on the React Learning Path — React Performance: Optimize React applications for maximum perfromance. React & TypeScript: Create robust and reliable React apps at Scale.

shadcn/ui: Components Built with Radix UI and Tailwind CSS — Yet another set of components, but they look pretty good and very Tailwind-ish. It is stressed that they are a work in progess though. GitHub repo.

Refraction, Dispersion, and Other Shader Light Effects — A guide on how to reproduce a chromatic dispersion effect for your React Three Fiber and shader projects. Several interactive code playgrounds show off and let you play with the various effects.

▶  'I Was Wrong About Nested React Components' — “I just thought nesting component definitions in React was pointless, turns out it’s a big problem for React when it comes to maintaining state or doing efficient updates. Don’t do it.”

The Future of Create React App and Why It Exists — Dan wrote pretty much an essay in a comment on the issue thread we linked last week with “some background on the future of Create React App” and concludes with the team’s thoughts on leaning towards turning Create React App into a 'launcher.' As well as being a good response to the original...

Netlify Acquires Gatsby — The company behind the Gatsby React-based framework is joining Netlify with many Gatsby Cloud features expected to be integrated into Netlify’s extensive hosting platform. This now places Netlify more directly against Vercel who are behind Next.js.

react-native-android-widget: Build Android 'Widgets' with React Native — Focus on the design and use familiar concepts from React Native while leaving the interaction with the Android widget to this library. GitHub repo.

DecaUI: It's Another React Component Library — There are so many component suites nowadays, but it’s for a good reason: everyone likes different things. DecaUI is another set of accessible and customizable React components (thirteen in all) focused on providing consistency through using a root theme to serve up properties throughout an app. GitHub repo.

🔥 "Create React App Is Not A Great Recommendation to Be Making.." — Theo, an increasingly well known developer YouTuber, ran into numerous issues with Create React App and decided to officially float the idea of having the React docs recommend Vite instead. It kicked off quite the discussion, and you can get involved too.

▶  Did Next.js 13 Break State Management? — One of our favorite React YouTubers takes a practical look into a problem he encountered when trying to use MUI with Next.js 13, as well as how Zustand can play nicely with Next.js for managing state. (15 minutes.)

Making Your React Native Gestures Feel Natural — Shopify is using React Native for its main shop app and has shared a few pointers to making React Native “gestures and animations feel better and more natural”.

Josh W Comeau Unveils His 'The Joy of React' Course — We love Josh’s blog posts and if you were going to give money to anyone to learn React, he’d definitely be high on the list. Is it cheap? No. But it may well be for you. (We have no connection to Josh but his many posts over the years have engendered enough goodwill to shout...

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

Embedding Our New React UI in a Go App — Flipt serves its web application from a single binary (built in the Go language), embedding the static assets therein. Go 1.16’s native embedding set them on a journey that led to React and it works pretty well - no Next.js needed. An interesting alternative approach.

Drift: A Self-Hostable Gist / Pastebin Service — Built with Next.js 13. You can test out a running version at drift.lol.

React TypeScript Form: Build Typesafe Forms Faster — Handles the boilerplate involved when building forms using Zod (a type-oriented schema validation library) and react-hook-form without sacrificing customizability.

nice-modal-react: A Modal State Manager from eBay — A zero dependency way to manage modals in a natural idiomatically React way. You can play with some demos here.