#​361 — November 8, 2023

Read on the Web

Together with  Sentry logo
React Status

Headless Component: A Pattern for Composing React UIs — Posting on the Martin Fowler blog, an engineer at Atlassian takes us on a (very) practical journey into the concept of headless components and the pattern of having reusable logic and behavior separate from the presentation of UI elements.

Juntao Qiu

React to Ship Source Maps for Production Build Artifacts — Mark Erikson is very excited about this one. Appearing in a daily build or canary near you soon, React will ship with source maps available for production build artifacts, enhancing the potential debugging experience in production. (The actual commit was merged yesterday.)

Facebook / Mark Erikson

📞 Calling All Devs! Sentry Launch Week is Coming — Tune in daily on YouTube for new product announcements and technical demos; then join Discord to get the inside scoop from the engineers that build Sentry. RSVP for Nov 13-Nov 17, at 9 am PT to get reminders/recaps and a chance to win exclusive swag.

Sentry sponsor

React Server Components, Without a Framework? — Could you use Server Components today without a full framework like Next.js in place? This practical investigation is very thorough, with plenty to enjoy and learn from.

Tim Pillard

QUICK BITS:

Why You Want Need React Query — Do you actually need React Query for ‘simple’ fetching of data from a server? Not if that’s purely how you look at it, but to handle the async state management that follows on from that fetching? Yes, it'll make your life a lot easier. See if Dominik convinces you.

Dominik Dorfmeister AKA TkDodo

re-re-reselect — Simplifying React State Management — A thorough explanation of how a team built their own framework to improve the state management in their React app.

Köbis, Churchill and McIntyre (Causal)

📰 Classifieds

🎹 Strich brings fast & reliable 1D/2D barcode scanning to the web. You don't need a native app to scan barcodes. Free demo, 30-day trial.


Level up your career with these free AI focused courses covering prompt engineering, Dall-E, Chat-GPT & LangChain.js. Get an extra 10% off Pro.


💻 Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.

Building a Drawer Component — Ready to move up from simply using other people’s components and start building your own? This case study by an experienced component developer (who created both Vaul and Sonner) could help you get into the right frame of mind.

Emil Kowalski

How to Build a Server-Side React App Using Vite and Express — A demo of server-side rendering and server-side data fetching without using a framework — showing what React-powered frameworks actually do.

Paul Scanlon

🛠 Code and Tools

Google Introduces Components for the Maps JavaScript APIreact-google-maps is the ‘first Google-sponsored library’ for integrating Google Maps JavaScript API components in a React app.

Mike Pegg (Google Cloud)

Material Design Kit v7.0 for React 18 and Bootstrap 5 — Brings together a variety of Bootstrap themes, templates and tools into a single ‘starter kit.’ GitHub repo.

MDBootstrap

Find Your Partner in Code and Work #LikeABosch — At Bosch, we invent technology for life. Join in and get inspired by the perspectives of our community around the globe. Learn more.

Bosch sponsor

react-native-picker-select 9.0: A Picker Component for React Native — It emulates the native select interfaces on both iOS and Android.

LawnStarter

Starter App to Build a Desktop Tray-App with Tauri and React — A starter project for developing desktop app with a tray/menu-bar interface using Tauri (imagine something like Electron but based around Rust), React, Tailwind CSS, and Vite.

Aris Ripandi