⚡️ What if you could incrementally adopt native views in React websites instead of starting from scratch? 🚀 Expo DOM Components make this possible! Watch: Migrating a shadcn template to @Expo Router ↓

@shadcn @expo low key release of the year. the ability to just write React code in a native app and rendering it as a webview with types is huge. suddenly complex inputs could be possible on native

@shadcn @expo OMG yes. I want to be able to... -> Build something first for the web because it is easier to get feedback and iterate -> Then make it a mobile app when I feel it's ready -> Then progressively enhance as I find market fit.

@shadcn @expo 🪄 your wish is granted

@shadcn @expo Looks awesome! So many questions… How does it handle more complex components like a select on native? Does the css only work with tailwind or can it use traditional css? Seems like an all-in-one alternative to react-strict-dom, NativeWind, and more. Is that the goal?

DOM Components support all CSS features that Expo Router's Metro web supports: sass, scss, css modules, tailwind, postcss, etc. react-strict-dom is a native library, DOM components are a bundling/framework technique for rendering React to the DOM (not truly native). DOM Components cannot render native views as children, but you can float native views over them like the GL example at the end of the video.

@shadcn @expo This is so badass. Also side question: did you use a tool for tracking your mouse / zoom effects? The video is great!

@shadcn @expo Thanks, I used screen studio

@shadcn @expo @Baconbrix just to get the whole context, this sample code is running in expo using react-dom and react-native-web so it is a web app, and you are migrating web app to a mobile app using "use dom" components to render it even with css and all web things... my mind explode

@shadcn @expo It doesn’t need react-native-web, just react-dom. We use the process.env.EXPO_OS var to avoid importing RNW.

@shadcn @expo this is game changer, any docs on this?

@shadcn @expo WIP docs (very early) are here -