Aiden series of posts just confirms 1 thing: JUST ship! Performance and RSC are big mental constructs made by the industry to charge you money. If Github, Uber Eats and Pinterest have these painful re renders in production it means it doesn't matter 'that much'.

🤯react-native-sticky-parallax-header: a simple and powerful lib for creating fully customizable headers. This library supports iOS, Android, and web, offering three predefined components Tabbed Header, Avatar Header and Details Header with the flexibility to design your own headers too. Powered by react-native-reanimated.

React Native IDE is out and is only one vscode extension away. Bundle analyzer, toggle dark/light mode, screen recordings, inspector, breakpoints, log access, expo-router integration w/ url bar & history, 'preview action' runs components in isolation, click on views for hierarchy

holy smokes! It's alive! streaming on React Native out of the box using Expo 52 and the new expo/fetch library. This is a piece of the Expo Router RSC story but now RN is becoming a great alternative for AI apps that need streaming. This is gigantic. Amazing work by @expo & @kudochien 👏👏

🚨RELEASING Expo AI Chatbot: Fastest way to create React Native AI apps that work with Next.js AI chatbot get codebase → expoaichatbot.com Features: • Auth • Tool calling • Img attachments • History drawer • Markdown support • @aisdk integration

Siri is the most aweful product that never changed in years. Come on.

It's happening. The unification of React and React Native through the new react-strict-dom library. React Native currently includes many APIs that are based on Web APIs but do not conform to the standards of those Web APIs. This fixes it. 🧵👇

react native new site showcasing that multi-platform is the new de facto form and approach for the ecosystem. Universal is just getting started. Buckle up!

react-native-webrtc: Powerful WebRTC module for React Native It enables seamless audio/video communication, data channels, and screen capture across platforms (Android, iOS, Web, and more). It also Expo ready since it comes with a Expo config plugin.

🚀 React Native Sortables – smooth, intuitive drag-and-drop ✅ Grid & Flex layouts, custom spacing ✅ Auto-scroll, animations, haptics ✅ Insert/swap reordering, dynamic items ✅ Simple API, TypeScript, Expo, New & Old Arch Follow ROFI → @bidah

React Native + AI combo will push the mobile app development space to new heights. Mark my words.

React and React Native libraries that you can share between each other: ✅ zod - validation ✅react-hook-form - forms ✅ react-table - tables ✅ tRPC + react-query - data ✅shadcn - UI (matching API w/ RN Reusables) ✅ motion - animations (Matching API w/ Moti) ✅ date-fns - date utils ✅ai - AI Toolkit ❌nuqs - search params (useLocalSearchParams API from Expo Router) ❌recharts - charts (use Victory lib) ✅zustand - state mgmt This is great because it means @nextjs and @expo stack combo has so much in common. Let's not forget that you also have parity on bowth with route base navigation. The lines between them stack wise are each day more blurry.

Announcing Real-time Voice feature on @expo AI Chatbot. Powered by @livekit Available today to all Pro and Team users on expoaichatbot(.)com

Playing with Expo DOM. Small baby steps but I ✅ Added the @shadcn header into the @expo router native header ✅ Setup a Stack navigator inside the Tabs navigator so that we get proper stack navigation on any link inside the home screen ⏳ More to come! (drawer, bottom sheet)

🛍️🤑react-native-iap: a robust library for in-app purchases allowing seamless integration of subscription and one-time purchases. Key features include receipt validation, support for Amazon IAP, and handling promoted products. You can also use it with Expo using config plugins which is a big WIN. The library is designed for easy customization and provides lifecycle management for purchases too.

Animations in Nativewind v4 are a breeze. On this example we added `transition duration-500` to move from opacity-0 to opacity-40 for the background you see behind the Ticket component. Next we applied a slide-over effect using just `translate-y-[520]` to hide the element from view and then reset it to `transition-y-[0]` to put it back in place to its original position.

Starting today I am building a fullstack @expo universal app in public. All in on expo-router. From idea to app store/play store/the web. I feel in need of the challenge. Time to put all the hats on 🤠. Product design, DB, API, UI, UX. Indie hacking... here we go!

🎶react-native-track-player: Lightweight library for audio playback to create music apps. Includes media controls for Bluetooth devices and usage on lock screen. Has an API for adaptive bitrate streaming, caching, background playback, and full customization. Plus casting w/ Google Cast.

react-native-image-zoom: customizable image zoom component. ✅ Smooth zooming & panning ✅ Double tap & single tap support ✅ Customizable zoom settings ✅ TypeScript support ✅ Interactive callbacks for enhanced control

Introducing react-native-vercel-ai Run @vercel AI library on @expo and better yet on web too when building expo universal native apps. → Repo with all details @ dub.sh/rn-ai

Upgrading React Native: One of the most painful things becomes one of the easiest with @expo. Add config plugins into the mix and enjoy life again.

react-native-select-dropdown: highly customized dropdown | select | picker | menu. Extended API with 25 prop options to choose from for fine grained customization. follow ROFI → @bidah

Very happy to share the news that I am joining @tamagui_js 🎉. Such a great project and team. Can't be more excited to work on this universal stack all day every day.

react-native-markdown-display: A fully compatible CommonMark renderer for React Native, offering a native component approach. It enhances react-native-markdown-renderer with bug fixes and customization options for styling, links, and markdown preprocessing, supporting various elements plus custom ones.

Countdown to the release of Universal Nativewind v4 starter. Powered by @expo and expo-router. This is just a quick win to start working with Nativewind v4 on a clean sheet. It has helped me so I hope it helps you. Releasing in the next hours.

This is happening. I am building an Expo chatbot: streaming messages + generative UI (w/ loading UI skeletons too)🔥. Powered by Vercel AI 🙀. I have a POC with this sleek design already in place. But there is still lot more work to do. I will keep you posted.

Expo AI Chatbot feature: Chat with images ◆ LLM Multi modal setup using @aisdk ◆ @expo ImagePicker ◆ Zeego native context menu ◆ Expo Image for image preview cards and upload thumbnails preview ◆ Next.js AI Chatbot docs API route integration Link to codebase below 👇

react-native-godot coming soon 🔥

Vercel is behind in the mobile game; they know it. @expo Router is now getting closer to having RSC (to be production-ready) and SSR (soon). When that happens, they will be on par with Vercel (EAS Hosting) and Next.js (Expo router for web). I think Expo has been getting little by little closer to the web, and @vercel hasn't even talked about mobile in years, but suddenly they do (they had a realization). That's good and very welcoming in any case. Let the games begin!

🚨Releasing Expo AI Chatbot v1.0 Up to date with @expo 53, @aisdk 4.3 and the Chat SDK plus an extra new feature: web search. Available now on the free lite and pro versions. Link to codebase below 🔗👇

150 GitHub ⭐s for react-native-vercel-ai 🥳. I just took a look at new vercel AI package. Generative UI is a mismatch for now until expo-router lands RSC. This libs goes beyond chatbots. Squeeze @vercel AI into any workflow and get back your result right in your @expo app with the same vercel AI API. 🧙✨

How to migrate web apps from Next.js to Universal apps w/ @expo Router: A quick guide This quick guide pinpoints just the core compatibility steps you need and that are already there for you to move to universal from web. Let's dive in! Refactor UI from Tailwind to Nativewind There are many styling libraries and setups out there, but the transition is smooth, and you get to reuse almost all Tailwind styles when translating styles from @tailwindcss to Nativewind. It's fast because of the same stylings, and web developers are familiar with it, so the upgrades to Nativewind differences are minor. I highly recommend nativewind.dev because it is the de facto UI compatibility layer for migrating from Tailwind to universal platforms (web, iOS, Android). There is an important amount of styling you have already won that does not need changes and it's in place ready to use on #reactnative components. Refactor form Next.js pages router to Expo router Next.js uses file-based routing, just like Expo Router. If you use something like solito.dev, the solito router handles platform routing differences for you. However, if you choose Expo Router with Expo for web using metro bundler, the routing migration is doable. You have the useRouter and Link components, so it's about finding the differences in the API and applying them. Refactor from Next.js API routes to Expo Router API routes. Expo Router is WinterCG compliant, so that means all Next.js API routes can be ported with ease. @t3dotgg showcases this on this vid timestamp. piped.video/2P0q1EdH_oQ?si=gd8v… Are we done yet? Not really. Porting an app needs some extras steps, but this is the core of it. I did a port last year from Next.js to Expo so you can take a look at the source code for inspiration (dub.sh/universalmedusa). That's it. Happy universal (tele)porting!

My simple stack to build Universal React Native AI apps (95% code reuse across iOS, Android and web & no monorepo): [Bookmark for later] Native and web app: @expo router LLM: @openAI, @GroqInc, @DeepgramAI and @vercel AI Hosting: @Netlify and @expo EAS API: @trpcio with @expo API routes Database: @supabase Auth: @supabase Storage: @supabase Realtime: @supabase Email: @resend Background jobs: @triggerdotdev UI : @tamagui_js or nativewind

I hijacked `create-expo-app --template tabs@beta` and replaced StyleSheet with Nativewind v4 styles. So, if you want to run @expo SDK 50 with expo-router v3 and nativewind v4 this is the starter for you. github.com/bidah/expo-sdk-50…

universal React Native app developer watching his app run on all platforms

Universal Indie Hacker Journal #4: Added some animations to the homepage scrolling. I said before I would invoke @reactiive_ reanimated magic tricks. So here you go.

Replicating @shadcn UI button using Nativewind v4 Preview of custom theme, variables & variants I made a quick vid & @expo repo showcasing some upcoming new features of Nativewind v4. I picked up the Chadcn UI theme configuration and translated it to Nativewind. With that, it takes the basic building blocks of the Button components to enable the variants feature into it. link to repo in 🧵👇

React Native Server Defined Rendering is here! Try it today with @risetools_. It's built on top of @expo and @tamagui_js. No need to wait for RSC to land on React Native. Includes forms, icons, jsx, js server, linking, haptics, server API and more.

AI SDK works on Expo AI Chatbot

Universal React Native Reusables. Shadcn UI for #reactnative Same styling as the web counterpart using Nativewind v4 under the hood. Good news is that it is now being built to work on the web too as universal components. RNR started as native mobile only but @mrzachnugent is moving fast building a universal branch of the components that work on the web as well. → link to current repo with copy/paste universal components: github.com/mrzachnugent/reac…

Pushing the native feel in React Native using TipKit is the way to go. Even the smallest of details like this interaction count. Let's make React Native the most native we can. I love that 'expo modules is all you need' for this one. @rit3zh is killing it.

Introducing Universal Medusa ⚛️ Multi platform e-commerce development Get a starter codebase with a complete e-commerce app that runs on both mobile and web. Built w/ @expo, @nextjs & @medusajs Try it out now w/ npx create-universal-medusa-app Docs @ dub.sh/uma cc @_buildspace

🖼️ react-native-reanimated-carousel: a performant carousel for React Native powered by Reanimated v3. It has universal platform support (iOS, Android & Web) Features include smooth gesture interactions and snap animations, RTL layout, customizable animations, and accessibility.

testing react-native-filament rotation and animations with @expo setup cc @margelo_io

Nativewind v4 variants demo video coming soon @mark__lawlor is killing it in the underground world of the wind building v4, so I thought I'd lend a hand in showcasing a little bit about the upcoming v4. This time, we're showcasing variants using cva lib. We will see a Button component that has the same styles, setup, and variants from shadcn-ui. Stay tuned.

Working on @reactnative/@expo library to handle Paypal payments 💳 Nothing in the ecosystem up to date to handle it correctly with just JS besides one native integration I found so building my own solution. This will used as a piece of one of the Universal payment providers for the beta of Universal Medusa. In the middle of the implementation currently BUT with a working POC 🥳. Will open source it and LYK when ready.

I am building a VERY interesting 🧵if you are a React Native developer building cross platform only. This is a good one. Small sneak peek for now.

Universal Indie Hacker Journal #8: This is the same app/codebase running on iOS and the web with @expo router through Metro bundler. Can't believe it's behaving so well on mobile web while mostly only developing the iOS app. Navigation and animations working without a sweat. Almost all the pieces fitting together. Not everything is perfect. I need to resolve a couple of things/bugs. It's worth it. 3 apps (iOS, Android, & desktop/mobile web) for the price of 1 🤑🤝

React Native / Expo AI Chatbot will work out of the box with the Next.js version of Vercel AI Chatbot. Join waitlist → capsulethis.com/expo-chatbot

Look at that beauty. Universal app with a simple stack. Just a @expo router app to rule them all. 🔹Same query logic with @trpcio 🔹Same file route setup with expo router 🔹Same component styling 🔹Same libraries (e.g expo image) 🔹Same... everything... are you getting it?

Funny. I built uni-stack.dev a couple of months ago to celebrate @expo router v3 release and two weeks ago I ran `npx create-uni-app` to use it myself for the first time on a production app. So meta.

You can use the ComposeProvider pattern to not have to get into that mess.

just.. one... more

Because of @expo DOM a symbiosis will happen between @tailwindcss and nativewind. The effort to migrate from web to native will be smaller and native components will become an extended better version only when needed. WILD.

️⚛💻📱Releasing UNISTACK: typesafe setup to build fullstack expo universal native apps @expo router, @trpcio, @prisma and 3 UI libs to choose from: @tamagui_js, @gluestack or nativewind.dev → Try it w/ `npx create-uni-app` or visit uni-stack.dev

Universal devs, we have work to do. Try this baby out. @expo as always bringing in the magic of these tools. Time to create something amazing to push universal development forward.

Just discovered about Womob. Is a React Native project that turns Wordpress sites into native apps. It's also OSS. Codebase looks very interesting. 🔗👇

Building a iOS, Android and web app separately vs all at once using React Native and @expo router.

Don't get confused by the name. Expo-router v3 is more than a router. It's the first universal, full-stack React framework thanks to API Routes and a first class citizen for web in that matter w/ 2x faster static builds and 30% smaller bundle size compared to v2 🎉🎉🎉

react-native-snap-carousel: a versatile library for creating carousels. It supports multiple layouts (default, stack, tinder) which means no need to mess with animations by yourself. You get also parallax images, customizable pagination component and more.

Introducing Mobile Medusa 📱 React Native Medusa.js Starter Template Combine your @medusajs e-commerce backend and/or web storefront with a @expo mobile app that matches Medusa @nextjs starter functionality, look and feel. Go grab it @ dub.sh/mobilemedusa

react-native-swipe-list-view: Vertical ListView with rows that swipe open and closed. Best part is it has some native built in UX like dismissing opened row options when scrolling.

react-native-instagram-stories: Integrate Instagram-like stories in your React Native app ✨ Inspired by Instagram, crafted to capture its essence. 📱 Mobile-friendly with a smooth experience. 💾 Async Storage for progress saving. 🛠️ Developer-friendly & well-documented. 🚀 High performance with rich features: video, images, text & more!

React Native multi-platform dev tip: How to stay in the flow while dealing with 3 platforms at the same time. Double checking 3 platforms when developing a feature and when things break for different reasons on each platform can sometimes be exhausting and can easily get you off your development flow. You have to be worried of making the feature PLUS making it work everywhere. How to manage this? Make sure you are running the three projects but develop and focus only on one. There's a catch. Leave the other two in the background where you can have an eye on them. Why? If something is off in the design you fix it at the end of the feature development and if something breaks you will know about it right away else you will come back and see something breaking and will have to waste time trying to find out when it happened. Move on, keep on the flow, finish the feature. Fix it later but knowing exactly when it happened makes a world of difference. Note: Sometimes I do jump in right away to see what happened. If it is a quick fix I will do it but if it is slowing me down I will leave for later. That said. Life is good. Most of the times I take a look and 'everything just works™️' on every platform 🫶.

gluestack-ui v2 is out and it looks amazing. It's betting on NativeWind this time around and doubling down on universal components too. 32 base components to choose from🔥. Congrats @geekyants → try it out @ gluestack.io

Just added a new section on the Expo AI Chatbot website highlighting the @aisdk integration. It is central to the project and and a breeze to use. Probably the best way to build around AI on the JS/TS ecosystem. → visit expoaichatbot.com

⚛️💨 Releasing Universal Nativewind v4 Starter This starter kit gets you into the 'universal' flow right away. Powered by @expo router you get the simplest yet most powerful setup to build React Native universal apps with @tailwindcss styling. → Repo @ dub.sh/universal-nativewind

React Native people are sleeping on Stacks library. FYI we have a layout problem. Stacks fix’s it and is a universal library too! On my experience it solved all layout issues I had… that RN has. So good. This new version jump to Typescript is huge. Congrats Marcin 🥳

DYK that you can grab for free the OSS Bento components for your universal app development with @tamagui? For now it's only available for the first component of each section. That's 20+ components! → Go and give it a try today dub.sh/UPGOLVP

Official Nativewind v4 starter right in the create-expo-app npx script 🎉

reminder: you don't need a monorepo setup on your @expo app or a separate git repo to host your server code. solution? Put it right inside your project root. DONE! If @expensify which is traded on the stock market has its electron app inside its react native app so can you

Universal Indie Hacker Journal #25: Adding Native Context Menu. In the spirit of @mozzius 'native feel' learnings, having a home feed without it is a no-no. I used the Zeego library by @fernandorojo. The thing is, I am using it just for iOS, so why not use the iOS context menu library by @GoDominic instead? Because I may add Android in the future. Choosing universal libraries makes me future-proof to extend to new platforms with a smooth transition and as little work as possible.

Expo AI chatbot UX feature unlocked 🔓: Two micro interactions when sending messages 1. Keyboard is dismissed 2. User message is placed on top of the visible screen. This is the same experience available on mobile native chat apps like chatGPT. Join the Expo AI chatbot waitlist →capsulethis.com/expo-chatbot

I built Expo AI Chatbot website with @lovable. It helped me focus and spend most of my time on the chatbot codebase. It was a great experience, specially the Github integration 😙🤌 Go and give it a vote on the LAUNCHED website if you can 🙏 launched.lovable.app/expo-ai…

This looks amazing. I hope Evan likes my version of a Expo Chatbot. It has a different feature set, API setup, integrations, and so on... This week looks it will be packed with React Native AI goodies. Release with fully compatibility of Next.js AI Chatbot THIS WEEK. Last chance to get into the waitlist → capsulethis.com/expo-chatbot

100 GitHub ⭐s for react-native-vercel-ai 🥳. That means I need to get back to the codebase and add some enhancements to celebrate the milestone!

react-native-advanced-input-mask: flexible input masking functionality. It allows you to format input fields dynamically as users type, ensuring that data is entered in a consistent and valid format. ✨ Ensures smooth, flicker-free text formatting in a real time. 🧬 Supports multiple mask types and formats. ⚡ Instantly applies the correct format as users type, without delays. 🚀 Cross-platform support for iOS, Android and web. 🛠️ Easy integration with existing React Native components. Follow ROFI for more RN content → @bidah

Expo AI Chatbot now supports Speech To Text • Enhanced UI for the Chatbox component to handle speech to text. • @expo-av integration for recordings and permission handling • Next.js AI chatbot API route setup using OpenAI Whipser Link to codebase 👇

Tamagui themes is out! and open to everyone to use. Theming has been one of the flagship features of Tamagui but you did needed to jump into the `createThemeBuilder` API to squeeze all its power. Not anymore. Now you have this powerful UI to get your theme's look and feel in a matter of minutes 🔥

Build universal apps for TV, mobile & web w/ React Native `react-tv-space-navigation` is a new library that solves this problem by handling spatial navigation using a declaration-based navigation approach. Details about: presentation, technical post and example app code on🧵👇

React Native Skia already has web support, expo-router support and is integrated to reanimated v3. Now with the release of v1 and canvaskit-js we get a performance boost. Web bundle will include the whole React Native Skia package on a tiny 20 kilobytes polyfill 🔥🔥🔥

Really happy with the launch of uni-stack.dev 😃. For me full stack + @expo + native + web === FUN. → Try it out today w/ `npx create-uni-app`

react native bottom sheet now works on web too 🎉. So good to see more libraries becoming universal. Besides that you get: - dynamic sizing. On current version you had to trigger snap points when content changed. Not anymore. - Very generously of Mo release Flashlist integration to everyone. Previously it was a sponsors only option.

@expo full-stack template at 80% completion 🕺🎉. Here's a small teaser image w/ v0.0.1 feature set. Includes expo-router @typescript @prisma @trpcio nativewind.dev @gluestack @tamagui_js

Soon real-time voice on expoaichatbot.com. Features include: Voice UI, Intelligent Interruption, Turn-Taking Cue Detection, Custom LLM Setup, Crystal-Clear Audio, Native WebRTC Implementation, Unified Conversation Context, Next.js Connection API & Real-Time API Providers

⚛️💻📱GET THE UNI STACK PRE RELEASE Soon to release the starter kit to build fully typesafe fullstack expo universal native apps → followers that retweet / like or reply to be the first to get the starter kit. Sending personal DM with it to all of you first.

New micro series of posts from now on called: universal indie hacker journal. Today we've got a @expo router screen w/ API routes behind the scenes after a @supabase auth login returning user information on an authorized route group using a tRPC query procedure with protected context working both on mobile app and web. It's not that much but it's honest work. Onwards!

it sucks. I have these instructions added to my .cursorrules and it works pretty well to avoid that: # Important: always remember to: - Do not remove commented out code. - Be careful removing code that is not used or that could be part of another functionality.

Native 3D rendering with animations on React Native with newly released react-native-filament. This is the biggest release of the year on the ecosystem hands down. this... is... HUGE. You have to push into trying it out. This opens up so many possibilities of app development 🤯

🧪⚛️🤖Experimental chatbot streaming on @expo managed project The Fetch API in React Native does not have streaming support. This means that RN falls behind when building AI chatbot apps. This demo showcases a Next.js API endpoint using the Vercel AI library, with a webview set up using the `react-native-react-bridge` library. 1. The AI library runs in the webview and passes the chat messages to the native view. 2. From native view we can send new messages to webview. Is this approach too hacky? Does it get the job done? LGTM? What are your thoughts? Smash the ❤️ button if this sounds interesting enough for me to release this repo.

Building a web, android and IOS app separately vs all at once with @expo router.

Sometimes React Native is not about multi-platform nor cross-platform. It's one platform, and with that you still get more than using SwiftUI. Candle app looks amazing just on IOS but if it succeeds and wants to grow beyond IOS (probably by extending to new platforms) by having as a base React Native they have already a lot of ground covered in terms of logic and UI.

WHAT A SETUP🔥 Create @expo apps w/ intuitive screen interactions w/o worrying about data access, state, and performance (local first x @tinybasejs ) while having all synced to your @supabase PG DB through @powersync_ 🔗 bndkt.com/blog/2024/the-easi…

big update: first screenshot of @expo codegen in the browser 🔥🚨 We have so many modules working together to get this going and so many more in the making. Building this feels refreshing. I want to get as fast as possible to the point where other solutions currently are (not that far TBH). From there I want to push universal app development with React Native to hopefully a new, fun, never seen place. That's the dream at least. Next on the backlog: Git branches AKA 'restore' feature.

universal full stack @expo router development setup with Radon IDE (previously react native IDE) 1- spin up the web and server in a new window. with `expo start -w` 2- now `open IDE panel` to run you iOS / Android app. 3- profit 🎉

Universal Indie Hacker Journal #24: Animating home screen layout It's using @swmansion Reanimated `entering` prop in combination with `FadeIn.delay` that uses the index of each card item to apply a deferred animation. This combines with Blurhash implementation from last journal #23 to make a good first impression while opening the app.

Whenever @fernandorojo gives you feedback you stop everything you are doing and make the change ok? What I did was add an absolute positioned @expo-gradient component behind the @expo-blur component and set it from gray to transparent.

⚛️📱💻 Universal State of Mind #2 issue is out! ⋅ React Strict DOM is here ⋅ [UI] Tamagui is RSD today ⋅ [starter] Ignite v9.6.1 fixes metro web HMR ⋅ [library] Zeego update with new Expo template ⋅ [library] expo-drag-drop-content-view now with web compatibility ✉️🔗👇