This Week In React #234: TanStack DB, TanStack Query, React Router, Vite, Redux Toolkit, Parcel | 0.80 RC, Expo, Legal, Re.Pack, Skia, Radon IDE...

Search for a command to run...

No comments yet. Be the first to comment.
Hi everyone! Krzysztof and Tomasz from Software Mansion here π It's been a fairly calm week for the React ecosystem, but not for the React Native world. Meta has made an exciting announcement about the release of React Native 0.80, where they've dec...

Hi everyone! This week is relatively calm in the React ecosystem, but we still have various interesting blog posts and releases. Maybe we'll soon get some exciting news from React Summit that's about on Friday! On the React Native side, all the devs ...

Hi everyone! I thought I was on schedule for today's issue, until I realized that Dan Abramov wrote 4 RSC blog posts this week π. We also get great releases, including Storybook, LiveStore, Base UI, and the Lingo Compiler is a quite exciting innovat...

Hi everyone! Cyril and Matthieu from Theodo Apps here π. This week, the Remix team announced some big news. Microsoft has also made it easier to try out TypeScript Go rewriting. In the React Native world, there were a few minor but interesting relea...

Hi everyone! This week, we're delighted to finally have a preview of React Server Components support in React Router. I've also found some very interesting PRs on the React repo, and give you a glimpse of what could be coming soon! The React Native e...

Hi everyone!
Kacper and Tymek from Software Mansion here π.
With a slightly quieter week, we come mostly with great articles we think you might like, alongside a few interesting releases! We're so excited about the Vite team working on RSC support, a new React Query proposal, in conjunction with the features coming in React Native 0.80, but there are still many new topics here to look at.
Let's dive in!
π‘ Subscribe to the official newsletter to receive an email every week!
This is why you're not shipping
Some red flags PostHog has found in teams failing to ship fast: waiting for 1:1s to solve problems, needing other teams to approve your work, and sales outnumbering engineering π©
Learn how to identify and fix each of these (and more) in the latest edition of their Product for Engineers newsletter πͺ
A brand-new library from the TanStack team has been introduced in collaboration with ElectricSQL, which brings a lot of exciting features. It gives you a blazing fast query engine, fine-grained reactivity for minimal re-renders, robust transaction primitives and normalized data by default!
It is built on TanStack Store and is working with and alongside TanStack Query, which extends its capabilities with collections, live queries and optimistic mutations.
πΈ Build professional design system in less than a day, using Hope AI, new model by Bit.Cloud
π React PR - Integrate React RSC with Vite: An implementation of React Server Components support in Vite. There used to be a community proposal in the past but this time it's coming officially from the Vite team.
π React Query RFC - Unified Imperative Query Methods: As the API of TanStack Query grows, the creators proposed to reduce the number of six functions with similar functionality to two unique methods - query() and infiniteQuery().
π Static as a Server: Dan draws parallels between the Astro and built-time React Server Components for creating static sites without a server.
π React Hook Factory - how to create custom hooks programmatically: A clever pattern to reduce boilerplate when setting up a new React Context.
π No, react context is not causing too many renders: Argues that using React context is fine, and re-render problems are more likely related to large context values and controlled components.
π Dependency Inversion in React: Building Truly Testable Components: Implementing the SOLID principle by passing dependencies as props.
π Using OpenAuth with React Router: Comprehensive 2-part tutorial explaining how to implement authentication using React Router, OpenAuth and deploying on AWS with SST.
π Client-Side React Rocks: On the example of tabular layout, the author argues client-side React features like useContext and createPortal provide better DX than Server Components.
π The Limits of RSC: A Practitioner's Journey: Nir tried to implement infinite scrolling UI using Server Components, but ran into a wall. Spoiler: He used React Query instead.
π How to Build a Custom React Renderer: Using the react-reconciler package to build a video composition software.
π Patterns for state management with actors in React with XState
π¦ React Router 7.6 - new routeDiscovery option: New config option introduced granting more control over the Lazy Route Discovery feature.
π¦ Redux Toolkit 2.8 - Infinite Query Page Params, RN compatibility
π₯ Jack Herrington - Server Functions Don't Exist (It Matters)
π₯ Lee Robinson - Multi-tenant SaaS apps with Next.js and Vercel
ποΈ Syntax.fm 901 - New React & Svelte APIs, RSC Updates, Redwood and Storybook
Set up subscriptions in your B2B or B2C app without writing custom payment code or building your own UI.
Create a pricing page with the <PricingTable /> component
Connect with Stripeβno manual API calls, no manual syncing
Manage plans and entitlements all within the Clerk dashboard
has() helper to control access based on a customerβs plan, features, and permissions
Manage user and subscription data all in one place
Enable Billing, drop in <PricingTable/> on your /pricing page and start monetizing your application.
How Office Is Modernizing Their App Suite's UI using Windows App SDK and React Native
Chiara Mooney from Microsoft described how they use React Native to implement the newest Copilot features in their flagship MS Office suite used by 600 million people.
They are using it with the island architecture, a pattern embraced in the frontend ecosystem by frameworks such as Astro.
Interesting to see how RN is used at the highest enterprise level on platforms which aren't just Android or iOS.
π¦ mrdoob - Honest question, why would anyone use Flutter instead of React Native?: Horizon broadening conversation between React Native and Flutter devs started by the Three.js creator.
π React Universe Conf - π΅π± WrocΕaw - 2-4 September. Star speakers announced! Get a 10% discount with code "TWIR".
π Expo - Faster local dev with build cache providers (Experimental): Use remote build caching to avoid recompiling the same code twice and ship faster.
π Nightmare on Apple Street: Publishing your app to the App Store from the Linux could be a nightmare. Before you start trying it on your own, learn what are the hops and obstacles of pushing an iOS app from a Linux machine.
π¦ React Native 0.80 RC.1: The upcoming version of React Native is now in RC. TypeScript improvements with new Strict API, support of radial gradient, React 19.1.
π¦ React Native Legal - Zero-Config OSS License Screens for Your App: The Callstack team introducing their recent zero-config, cross-platform library, that handles license metadata generation and in-app display for you.
π¦ Re.Pack 5.1 - Preloading Remotes, Runtime Hooks, and Faster Startups: The release mainly focuses on a better Module Federation 2 support.
π¦ Radon IDE 1.6 - React Profiler integration, conditional & expression breakpoints, βExpo SDK 53
π¦ React Native Skia 2.0 - React 19 and React Native 0.78 minimum are required
π¦ Rive React Native 9.3 - Data Binding support, new useRive() hook, simpler .riv file loading
π₯ Simon Grimm - React Native AI Apps can't get easier (Expo & Vercel AI SDK)
ποΈ React Native Radio 331 - New Architecture, New Era with Riccardo Cipolleschi
ποΈ Rocket Ship 68 - Expo SDK 53 Highlights, React Native AI, Worklets & No Apple App Store Commissions
π₯ Matt Pocock - Arrays, objects... now composites?: The exciting JS proposal that replaces Records and Tuples.
π Introducing Rslib: Build library with Rspack: Developed by ByteDance Web Infra Team, Rslib is a library that aims to be an ideal library development tool that is easy to configure, offers comprehensive features, leverages a shared ecosystem with application building, and prioritizes performance.
π shape(): A New Powerful Drawing Syntax in CSS: A new function of clip-path is now supported, which lets you to clip your element using arbitrary and responsive shapes.
See ya! π