#330 — March 15, 2023 |
|
What is Vite and Why Use It Over Create React App? — Create React App has long been considered the de facto way to create new React apps, but Vite has become popular in the last year due to its ease of use and performance (enough so that folks have suggested changing what the React docs recommend.). Luke Twomey |
Of course, an even faster option will be along before long.. ah, yes, Rspack is a new player in this space to check out too! |
👋 Meet the React.js Core Team — The new React documentation site has a neat page showing off the hard working souls on the React development team from long-time members like Sophie Alpert and Dan Abramov, to newer folks like Mengdi Chen. React Documentation |
Developer Day: A Front-Row Seat to What's New with Retool — Join our product and engineering leaders for a first look at what's new with Retool. We'll be diving deep into new GPT-powered features, Python support, and a brand-new way to rapidly deploy databases. Retool sponsor |
▶ Some Spirited Discussion on React Server Components — Kent C Dodds got together with Meta’s Dan Abramov and Joe Savona and took advantage of the chance to ask numerous questions about Server Components with two leading members of the React Core Team. If you prefer, you can read the written summary. Kent C. Dodds |
IN BRIEF:
|
How To Create Dynamic Donut Charts with TailwindCSS and React — An approach to creating a donut chart using CSS’s Paul Scanlon |
How to Drag and Drop in React — Drag and drop is a basic UI expectation in many scenarios. Robin, always a well-regarded instructor, walks though the creation of a drag and drop capable component step-by-step. Robin Wieruch |
The tutorial above leans on the now stalled (but still maintained) react-beautiful-dnd – the more actively developed dnd kit is worth exploring if this concerns you. |
Five Mistakes I Made When Starting My First React Project — Richard shares his early React mistakes with the hope you can learn from his misfortunes. He tackles topics like using Richard Oliver Bray |
React Authentication, Simplified Userfront sponsor |
Beautiful and Mind-Bending Effects with WebGL Render Targets — Learn how to use WebGL Render Targets to create post-processing effects, optical illusions, and transition effects in your React Three projects. Maxime Heckel |
Create an Image Tagger App with React and AI in Just a Few Simple Steps — No OpenAI or ChatGPT involved here. It uses Amazon’s long standing Rekognition service. Daniel Errante |
▶ Unlock the Power of AI with Defer and Next.js 13 — Defer is a (commercial) Node.js background job execution platform. Jack Herrington |
▶ Rebuilding the Jotai State Manager in 20 Minutes — Ultimately Jotai is simple enough that its core can fit into a tweet (sort of).
|
Lazy Loading Routes in React Router 6.4+
|
How to Create and Use Path Aliases in TypeScript Imports with Vite
|
🛠 Code and Tools |
Flexboard: A React Component Library for Resizable Sidebars — Try the live example. The code allows you to set min/max sizes for the resizable parts of the layout. Dorbus |
Tremor 2.0: The React Library to Build Dashboards Fast — Provides an array of modular components to build data-driven dashboards. v2.0 is the “first step towards a production-ready version of Tremor” and sees a full switch to Tailwind CSS. Homepage. Tremor Labs |
Try Stream’s Free Trial of SDKs for In-App Chat Stream sponsor |
Iconito: SVG Icon Management for React — Enables the storage of SVG icons in a single definition file as symbols so they can be used with references. Nairi Narinyan |
useRerender — Hook that detects component mounts, unmounts & re-renders. George Bardi |
React Code Input — Creates a lightweight text area component which will automatically syntax highlight code, as shown here. Simon Holmes |
|
QUICK RELEASES:
|