Mark Lawlor retweeted
🎉Stable Release: NativeWind v4.1 Support is Here! 🚀
✅ 90% smaller CSS 📂
✅ 600+ lines & wrappers removed ✂️
✅ Data attributes without HOCs 🔧
✅ Expo RSC compatible ⚒️
Ok, time to get started...👷🚧👷
Great example of expo-router/ui 😍
Default<Tabs /> are great, but don't fit all use cases. The new "headless" tabs gives you the power design tabs that work best for your app
Had a lot of fun tonight experimenting with the new expo-router/ui in @expo SDK52 to build a custom tab navigator.
Really elegant, powerful stuff, and so straightforward to use 😎
If you haven't already, gotta give it a look!
Mark Lawlor retweeted
A few updates
1⃣ I have joined NativeWind as a maintainer
2⃣ @mark__lawlor and I have a "stable" version of NativeWind v4 that we're testing with a small audience, comment/DM if you're interested in early access
3⃣ We'll release this new version by mid-late July
Overview
Fix the unstable development server
NativeWind had some issues with applying styles and handling animations due to dependencies on external tools (Tailwind CLI and Reanimated). The implementation of these tools had some bugs and timing issues with FastRefresh, causing styles not to apply immediately and animations to be unstable.
The solution for the Tailwind CLI issues was to add virtual module support to Metro and the solution for the Reanimated was to update the minimum version required and to remove some hacky code.
Context
NativeWind relies on Tailwind CLI to generate styles. It takes the output from Tailwind CLI and injects it into your app. However, due to some timing issues with FastRefresh (the thing that reloads your app quickly during development), the styles might not apply until you manually reload your app.
We'll flesh out documentation for this👍This isn't a new issue, its the same specificity issue that Next.js users may encounter.
Tailwind-to-stylex is a great alternative to twnrc. If you only use a subset of Tailwind CSS, this could be a great fit
Using Tailwind would break some of the styles in RN.
Tailwind-to-stylex can help!
npmjs.com/package/tailwind-t…
NativeWind looks🔥with "react-strict-dom"
🚀 This is universal React with the new "react-strict-dom" by @Meta (experimental):
◆ Light-weight, web-first API
◆ Truly native components on each platform
◆ No div-soup on web
◆ Fully accessible/indexable primitives
◆ Can be used with Tailwind CSS
Bikeshedding on the name: <native.div /> would have been nice, or even just <react.div />.
I do think 'html' is going to turn away unaware developers
This Post is from an account that no longer exists. Learn more
There's a subtle difference between this example and the NativeWind className one. If there is a 3rd party library you like but you wish it was animated - just pass it the animated className. This inversion of control allows NativeWind's styling to be very flexible
Do people like this API? Ignore the `useStyles()` hook you could just use the className obj directly.
This is possible now, the helper just isn't exported.
Replying to @whichqudus
I like using Tailwind and I've even used it on my blog. It really speeds up the development process. But, I've never used NativeWind.
Looking at the docs, it seems like it combines Restyle and Styled Components. With a Babel plugin, it looks cleaner.
However, I'm not a fan of wrapping everything in "styled". I would rather use autocomplete and create compatible styles during runtime. Something more "React Native way":
We don't yet support arbitrary groups, but a limited version using a className or attribute selector is on the roadmap.
Just finished a huge NativeWind v4 refactor to remove the last React 'hacks'. This has taken much longer than I expected.
Fingers crossed the testing goes well and I can get a release our shortly.
Great video demonstrating API routes. API routes are not just about giving your app a back-end, they give SaaS companies a uniform interface for their React SDKs. And chat immediately mention tRPC😀API routes give more freedom to RN devs to pick the best tool for their needs
Mobile devs fear servers. That needs to change. Thankful that @expo is finally challenging them to do that. Obviously I had to do a vid about it
Mark Lawlor retweeted
🚀 Expo Router v3 is here—Full-stack React for iOS, Android, and web!
◆ API Routes (beta)
◆ Bundle splitting
◆ 30% smaller, 2x faster web exports
◆ Router testing library
◆ New <Link /> props
◆ Tailwind and Sentry support
How are people debugging React Server Components? Are you using two inspectors, or is there someway to unify the debugging experience?



























