Hi everyone!
It looks like not everyone is on holiday: there's still plenty of news this week, both on the React and React-Native fronts.
I've got a question for you (you can email me back): would you prefer me to put direct links, or links to tweets?
- direct: 1-click access to the resource
- tweet: read related conversations
💡 Subscribe to the official newsletter to receive an email every week!
💸 Sponsor
Enterprise Grade APIs for Feeds, Chat, & Video!
Stream is the maker of enterprise-grade APIs and SDKs that help product and engineering teams solve two common problems at scale: in-app chat and social activity feeds.
With Stream, developers can integrate any type of messaging or feed experience into their app in a fraction of the time it would take to build these features from scratch. Stream Chat makes it easy for developers to integrate rich, real-time messaging into their applications.
Stream provides robust client-side SDKs for popular frameworks such as React, React-Native, Expo, Flutter, Android, Angular, Compose, Unreal, and iOS.
Unlock enterprise-grade features, functions, and UI components completely free for your startup or side project with the Maker Account.
Try the new React Video tutorial!
⚛️ React
A new version of Astro has just been released with a long-awaited experimental feature: View Transitions. This makes it easy to create fluid, animated transitions between HTML pages, without having to resort to client-side routing: there's no need for a <Link> component as with Next.js or Remix. For a React developer, this makes the framework more appealing and competitive in terms of UX compared with the classic SPA mode we're used to, while keeping a model simpler. Careful: these transitions won't preserve your React state across navigation, which could be a problem. Note support View Transitions remains weak, but is making rapid progress and can be considered as a progressive enhancement, plus Astro offers a fallback mode.
- 👤 Dan Abramov leaves his job at Meta, but remains in the React core team
- 👤 Meta is hiring a React DX Engineering Manager (London)
- 🧑🎓 New Jotai tutorial
- 💬 Material UI RFC - Zero-runtime CSS-in-JS: MUI plans to develop a zero-runtime CSS-in-JS solution inspired by Linaria/Compiled, compatible with RSCs. Also explains why it cannot rely on any existing solution.
- 💡 Server Components allow to pass promises over the network
- 💡 forwardRef type fix that works with generics
- 📜 React Query and React Context: Dominik explains how putting React-Query data into a React context can be useful in making your data dependencies more explicit. The future
useSuspenseQueryhook could also be a good alternative. - 📜 Next 13 cookies() and headers() explained: explains how Next.js uses
AsyncLocalStorage(and later AsyncContext?) to expose itscookies()andheaders()functions to RSCs. - 📜 Kuma UI vs Panda CSS – My first impressions: quick comparison of the 2 new CSS-in-JS libraries. The author settled on Kuma UI.
- 📜 Recipe kits, a great alternative to installable libraries: discusses the emergence and interest of UI kits that are not distributed via npm: Shadcn UI, Tailwind UI (and soon Tailwind Catalyst).
- 📜 Tailwind Connect 2023 Recap: written summary of the conference, which also presented Catalyst, the React UI Kit currently under development.
- 📜 Introducing React-Tweet: Vercel offers an RSC-compatible package for efficiently displaying tweets in web pages.
- 📜 React Server Components Tips: 5 good tips and mental models for understanding and using CSRs.
- 📜 Origins of JSX and Why It Exists
- 📜 Lazy Loading in React and Next.js Apps
- 📦 Storybook 7.1 - in-app onboarding, zero-config styling support, TypeScript snippets...
- 📦 TanStack Query v5 beta - mostly stable, migration guide and code mods available
- 📦 Remix 1.19 - Improved dev server networking option, ESBuild metafiles, better Node polyfills...
- 📦 Redwood v6.0.0 RC
- 📦 Vaul - Unstyled drawer component for React
- 📦 Framer-Motion 10.13 - Scroll API
- 📦 Downshift v8
- 🎥 Jack Herrington - Why Panda: CSS for RSCs is Changing the Game
- 🎥 Addy Osmani - The Cost Of JavaScript - 2023
- 🎥 Jamon Holmgren - The Suspense is killing me
- 🎥 Lee Robinson - Responding to Reddit on the Next.js App Router
💸 Sponsor
Porkbun.com - The Best Domain Name Registrar
Porkbun offers hundreds of domain extensions for React and React-Native developers from .dev and .app to .cloud, .xyz, and .ai — all at the lowest prices around! Every domain name at Porkbun comes with tons of free features like:
- SSL Certificates
- WHOIS Privacy
- DNS
- URL Forwarding
- Web and Email Hosting Trials
Check out our AI Generated Search tool that’s changing the way people look for domain names. All this is backed by incredible support 365 days a year plus thousands of real five-star reviews on Trustpilot.
Click the link and get $1 off your next domain name registration at Porkbun.com!
📱 React-Native
New version of the project that unifies React-Native and Next.js under shared abstractions. With v4, it is now possible to use Next.js App Router. New APIs have been introduced for this purpose. Note that React-Native does not yet support React-Server Components: it is still a bit early to be able to use them in a cross-platform way.
- 🎉 Expo Launch Party: an Expo launch week scheduled for the week of 8 August?
- 👥 Debugging React Native Apps End-to-End: AMA with Experts from Meta and Sentry - 26 July
- 📜 Redefining Navigation in React Native: the Potential of expo-router: good analysis of the trade-offs between Expo Router (v1) and React-Navigation.
- 📜 Setting Up Storybook Web and Native with Expo Router v2, SDK 49, and TypeScript
- 📜 EAS Build Will Require Using M1/M2 Builders This Fall
- 📦 Yoga v2.0.0-beta.2: v2 of the React-Native layout engine is in beta. The aim is to comply with the W3C spec, which is great news for writing cross-platform React code! Note that Yoga is not just for mobile developers: it is also used by many other projects such as Satori, React-Native-Skia, React-Three-Flex and the React Ink CLI renderer.
- 📦 Reanimated 3.4.0: a great release with Shared Element Transitions, improvements to Worklets, React-Native 0.72 support and new APIs like
useReducedMotion. - 📦 React-Native-Lottie v6 - New Architecture support
- 📦 Tamagui Takeout: template that self-updates to ship cross-platform apps. Paid product aiming to fund the open-source project.
- 🎥 Jamon Holmgren - Hacking Xcode with Colo Loco!
- 🎙️ The React Native Show Podcast #24 - React Native at scale with Jacob Suñol (Abbott)
- 🎙️ React Native Radio 272 - Real Life React Native: Nick Alekhine at NTWRK
🧑💻 Jobs
🧑💼 Passionfroot - Senior Full-stack Engineer (Remix) - €160k+, Berlin/remote
Passionfroot's mission is to empower the independent businesses of tomorrow via YouTube, Podcasts, Social Media, and Newsletters. Join us in building a tool that will empower creators globally to build scalable, sustainable businesses.
🧑💼 Callstack - Senior React Native Developer - Fully Remote, PLN 21-32k net on B2B, monthly
Do you want to work on the world's most used apps? Would you like to co-create the React Native technology? Join the Callstack team of React & React Native leaders. Check our website for more details. We are looking forward to seeing your application - show us what you've got!
🧑💼 G2i - 100% Remote React Native Jobs
We have several roles open for developers focused on React Native! Pay is ~160k plus 10% bonus. You must have production experience with RN and be based in the US. DM @gabe_g2i to learn more and don't forget to mention This Week in React.
🔀 Other
- Bun 0.7 - Improved Node.js compat, Vite support, Worker, AsyncLocalStorage...
- Rspack 0.2.9
- Microsoft TypeChat - Helps get TypeScript type-safe reponses from AI / LLM
- TypeScript and the dawn of gradual types
- pkg-size - Find the true size of an npm package (thanks to WebContainers)
- Node.js Best Practices List - 2023 update
- How Turborepo is porting from Go to Rust
- Introducing Valibot, a < 1kb Zod Alternative
- 5 Inconvenient Truths about TypeScript
🤭 Fun
See ya! 👋
Top comments (0)