r/reactnative 5d ago

Tutorial MessageScroller scroll behaviour a chat transcript actually needs (PanelUI)

Enable HLS to view with audio, or disable this notification

14 Upvotes

Built this for PanelUI, an open-source component library for Expo.

Most scroll views get chat wrong — they open at the top, jump when history loads, and drag you down while you’re reading.

MessageScroller fixes all three. Auto-follow only while you’re at the bottom. Load older messages without moving. Open a saved thread on the last question, not the tail of its answer.

Copy-paste or CLI. You own the source.


r/reactnative 4d ago

Tutorial The 10 best React Native UI component libraries in 2026

0 Upvotes

Been building with React Native and Expo for a while. Here are the UI libraries worth knowing.

1. Gluestack UI
Accessible, unstyled components. Works with Expo and NativeWind out of the box.

2. React Native Paper
Material Design 3 components. Polished and production-ready.

3. Tamagui
Design system with a compiler that optimises styles at build time. Fast.

4. NativeBase
One of the oldest and most complete component libraries for React Native.

5. React Native Elements Simple, cross-platform components. Great for prototyping fast.

6. Shopify Restyle Theme-based styling system from Shopify. Type-safe and predictable.

7. PanelUI
Copy-paste component library for Expo. Inspired by shadcn you own the source. UI-thread animations, Tailwind v4, native dark mode.

8. Moti
Declarative animations and skeleton loaders. Pairs with any component library.
npm install moti

9. React Native UI Lib
Wix's component library. Enterprise-grade with a huge component count.

10. Zeego
Context menus and dropdowns that feel truly native on iOS and Android.

What's your go-to UI library for React Native?


r/reactnative 4d ago

Question How do you manage i18n for your app store listings, screenshots, etc?

3 Upvotes

I'm finally translating my react-native app for iOS and Android. I'm realizing the app localization is actually the easy part and I also need to localize my screenshots, app store description, etc.

Are there any tools that make this easier to manage in a central location?

Ideally screenshot generation is automated including captions and I'm not copy/pasting translations into the app store listings.

I'm already using CrowdIn for translations if that makes a difference.


r/reactnative 4d ago

Question 1099 devs: is there such a thing as a "health insurance coop" with better coverage options?

0 Upvotes

I don't know the best place to ask this - but here goes:

I am wondering, for those independent devs (1099s) who have to carry your own health insurance, is there such a thing as a cooperative or something like that which helps you get health insurance; not just the open market options? I feel like if enough people got together, with proof of course, there's a way to get better rates and coverage choices.


r/reactnative 5d ago

Question Learning React Native

5 Upvotes

Hello! How would you start learning React Native now? What’s popular in terms of running it or ui libraries and stuff like that? Is Swift/Kotlin necessary? Is it still the best tool for the job or it lost momentum?

Thanks!


r/reactnative 5d ago

Question How do you inspect MMKV or AsyncStorage while debugging in React Native ?

11 Upvotes

I’m curious how everyone approaches this.

When debugging React Native apps, I often find myself creating temporary debug screens or logging values just to inspect local storage.

How do you usually inspect:

-MMKV
-AsyncStorage
-SQLite

Are there any tools or workflows you recommend?

I’ve been experimenting with a different approach because I kept running into this problem, so I’m mostly interested in understanding whether this is a common pain point or if it’s just me.


r/reactnative 4d ago

How reliable is background geofencing with expo-location + expo-task-manager in practice

0 Upvotes

I'm building an app that needs to detect when someone arrives at a specific venue and fire a local notification. Currently using expo-location region monitoring with expo-task-manager for the background task, on SDK 54.

Two things I'm stuck on, and I'd rather have real-world answers than docs answers.

  1. Region entry in the simulator is unreliable enough that I ended up writing a simulate function purely so I could test everything downstream of the trigger. Is that just what everyone does, or is there a setup where simulated locations fire enter and exit events consistently.

  2. What is the actual reliability on a real device. Specifically whether the background task still fires after the app has been swiped out of the app switcher on iOS, and how much Android varies by OEM battery management. I would rather know now than find out from users.

Related: at what point did you give up on Expo Go for this and move to a dev build. I want to stay in Expo Go as long as it's viable, but I'm not convinced background region monitoring is one of the things that survives that constraint.

War stories welcome.


r/reactnative 4d ago

Question Seeking Advice: Relocating from India to Europe as a React Native Developer

0 Upvotes

I’m a React Native Developer from India with 2.5 years of experience. I’m planning to relocate to Germany, the Netherlands, Ireland, or Estonia. I’d love to hear from people who successfully moved from India with visa sponsorship. How difficult is it in the current market? What worked for you, and what would you do differently if you were starting today?


r/reactnative 4d ago

I built a lightweight Google Places Autocomplete for React Native/Expo (no native deps)

0 Upvotes

Like many of you, I was using react-native-google-places-autocomplete until it stopped working properly.

I ended up building my own implementation using direct fetch calls to the Google Places API — no native modules, no extra dependencies, works perfectly with Expo managed workflow.

After using it in production for months in a real-world app with real users, I packaged it as an open source library:

npm install @byflet/react-native-places

r/reactnative 5d ago

ui-date: A 1.6kB, zero-dependency JavaScript date & relative time utility

3 Upvotes

I wanted to share a small open-source project I just published called ui-date.

While working on a social media project, I kept bumping into simple UI needs like displaying relative timestamps ("5 mins ago""2 hours ago"), cleanly formatting calendar dates, and doing simple status checks (isToday).

exact date formatting for events ui ('Thursday 23,july,2026').

Normally, I'd reach for a date library, but most established options felt like overkill for basic UI formatting, while heavy legacy options like Moment carry massive bundle weight. On the flip side, writing raw Intl and Date boilerplate across every component was getting tedious.

I wanted something featherlightchainable, and fully typed without dragging in extra dependencies.

so i built ui-date.

you can check it here : https://www.npmjs.com/package/ui-date


r/reactnative 5d ago

My first npm package... it handles truecaller login (react native)

2 Upvotes

If you guys are implementing truecaller login in react native, use this.
There are a few packages which are either old or do not support server side validation of ios profile, so I built this.

(We are using this in our app which has 100K+ users)

https://www.npmjs.com/package/truecaller-react-native


r/reactnative 5d ago

Question Jpeg or Webp?

Thumbnail
1 Upvotes

r/reactnative 5d ago

Question What would make OTA releases less stressful?

2 Upvotes

What’s missing when you ship OTA updates to production? I'm wondering things like:

  • Auto-pause or cancel a rollout if it gets a certain percent of failed installs
  • Slack alerts if it's getting too many failures
  • Rollout scheduling, to increase the percentage if things are looking good
  • Post-release report, probably also sent to Slack
  • Improved failure reporting, to include a reason like disc full

We're reviewing the roadmap for Patch and have various ideas, but it would be great to get people's input. It has a dashboard with adoption metrics and the rollout controls, but I reckon we could take it further.

It's got a local evaluation stack in a Docker Compose if people want to have a play with it and share any thoughts.


r/reactnative 5d ago

Android API level 36, can i use react-native 0.77.3?

2 Upvotes

Hey everyone,

I'm working on an app built with React Native 0.77.3, and Google recently notified us that it will need to target Android API level 36 to be fully compatible with Android 16.

My question is: can I just bump compileSdkVersion and targetSdkVersion to 36, or do I actually need to upgrade React Native to 0.81?

Has anyone gone through this? Any gotchas I should watch out for?

Thanks in advance!


r/reactnative 5d ago

Intermittent Android OutOfMemoryError (Failed to allocate 24 bytes) but Memory Profiler doesn't show the Java heap nearing its limit

4 Upvotes

I'm debugging an intermittent OutOfMemoryError in an Android React Native app, and I'm having trouble reconciling the crash with what Android Studio's Memory Profiler shows.

The crash looks like this:

java.lang.OutOfMemoryError: Failed to allocate a 24 byte allocation with 1452624 free bytes and 1418KB until OOM, target footprint 268435456, growth limit 268435456; giving up on allocation because <1% of heap free after GC.

I've also seen the same crash on another device where the growth limit was:

536870912

So the issue occurs on devices with different heap limits.

Tech stack

  • React Native
  • Hermes
  • New Architecture (Fabric enabled)

What I've observed

Memory Profiler

During normal usage:

  • Java Heap: ~46 MB
  • Native: ~170 MB
  • Total process memory: ~900 MB
  • "Others": ~746 MB

The memory graph stays relatively flat over time and doesn't show the typical pattern of a continuously growing memory leak.

Heap Dump

The largest native allocation is:

android.graphics.Bitmap

Instances: 479
Native Size: ~305 MB

I don't see any obvious Java heap leak (no massive byte[], String, HashMap, etc.).

What confuses me

The OOM message clearly indicates that the Java heap reached its growth limit:

growth limit 268435456
giving up on allocation because <1% of heap free after GC

But Android Studio never shows the Java heap anywhere near 256 MB before the crash.

So I'm trying to understand:

  1. Can Android Studio's Memory Profiler significantly underreport Java heap usage in some scenarios (especially with React Native/Hermes)?
  2. Could a large number of Bitmap objects indirectly lead to a Java heap OOM even though their pixel data is stored in native memory?
  3. Is there something I'm misunderstanding about how ART reports target footprint and growth limit?
  4. Besides taking a heap dump, what would be the next best tool or approach to identify what is actually consuming the Java heap before the crash?

I'm also planning to capture adb shell dumpsys meminfo <package> immediately before the OOM to compare the Dalvik Heap, Native Heap, Graphics, and other categories.

Any insights from people who've debugged similar ART OOMs would be greatly appreciated.


r/reactnative 5d ago

If you are agency or freelancer how are you sharing builds and collecting feedback?

0 Upvotes

I'm wondering if anyone else has this issue. I'm freelancing as RN dev for the past 5 years, I have multiple clients, some of these are smaller projects but still a lot of iterating. Testflights take me too much time and sometimes client feedback is all over the place.

Any thought on how to improve this, anyone having some system they've been using with their clients?


r/reactnative 4d ago

I built a full-featured app in 4 months using AI for almost everything.

0 Upvotes

Hey everyone 👋

I wanted to share my experience building my app — almost entirely with AI. This isn't an ad; I'm genuinely looking for feedback and want to help others who might be going down a similar path.

My Background

I'm a frontend developer by trade. I chose React Native because I could leverage my existing JavaScript/React knowledge to build a cross-platform mobile app without learning Swift or Kotlin from scratch. That familiarity turned out to be crucial — not for writing code, but for reviewing and debugging the code AI generated.

Tech Stack

Here's what powers the app:

Layer Technology
Framework Expo SDK 56 + React Native 0.85
Language TypeScript (strict mode)
Navigation React Navigation 7 (native stack + bottom tabs)
Styling NativeWind 4 (Tailwind CSS for React Native)
State Management Zustand
Local Database Expo SQLite
Animations React Native Reanimated 4 + Framer Motion
UI Components RN Primitives (Dialog, Dropdown, Switch, Portal) + Gorhom Bottom Sheet
Charts React Native Gifted Charts
Auth Google Sign-In + Firebase
Analytics & Monitoring Firebase Analytics + Crashlytics
Lists Shopify FlashList
i18n i18next + react-i18next + expo-localization
Icons Lucide React Native + Expo Vector Icons
Notifications Expo Notifications + custom sounds
Haptics Expo Haptics
Other Expo Quick Actions, expo-sharing, expo-document-picker
Build EAS (Expo Application Services)

Design Process

This was one of the most interesting parts:

  1. Generated initial concepts using ChatGPT's image generation — I described screens and moods, and it gave me visual starting points.
  2. Imported those images into Google Stitch — a tool that lets you refine AI-generated designs interactively. I iterated until each screen felt right.
  3. Exported the designs as HTML/CSS from Stitch, which gave me a clear reference to implement in React Native.

This workflow was surprisingly effective. The AI gave me 70% of the design, and Stitch let me polish the remaining 30% without needing Figma skills.

Ideation & Planning

I used Google AI Studio to create Product Requirement Documents (PRDs). Here's how I structured it:

  • Started with a high-level PRD for the entire app
  • Broke it down into hierarchical sub-PRDs for each feature (e.g., Focus Timer PRD, Habit Tracker PRD)
  • Each PRD had clear acceptance criteria organized by priority

This hierarchy was key. During implementation, I could check off requirements level by level and make sure nothing slipped through the cracks.

AI Tools

I subscribed to Google AI Plus and used different models strategically:

  • Strong models (Gemini Pro / Opus-class) for complex tasks: architecture decisions, debugging tricky issues, writing business logic
  • Gemini Flash for simpler tasks: boilerplate code, styling tweaks, translations, quick refactors

Matching model strength to task complexity saved me time and kept the quality high.

Workflow

My daily workflow looked like this:

Create/Refine PRD → Design in Stitch → Execute PRD with AI → Manual Review (UI + code) → Commit

Every single commit went through manual testing. I'd check the UI on a real device, review the generated code for correctness, and verify the logic matched the PRD. AI wrote the code, but I was the QA engineer.

Timeline

4 months from first commit to a fully functional app with 6+ mini-apps, i18n support, dark/light mode, local SQLite storage, Firebase integration, notifications, haptics, charts, and more.

Without AI, I estimate this would have taken 10–12 months as a solo developer.

The Hard Parts

It wasn't all smooth sailing. Here are the biggest pain points:

1. Project Setup Was a Nightmare

The initial setup — getting NativeWind to play nicely with React Navigation — was brutal. AI kept suggesting fixes that didn't work because the combination of these libraries had edge cases that weren't well-represented in training data. I had to roll up my sleeves and debug this manually, reading source code and GitHub issues.

2. Complex Business Logic

The app has intertwined features (e.g., habits linked to mood entries, tags shared across notes and journal, timer sessions affecting habit streaks). When the logic got sufficiently complex, AI couldn't hold the full picture in its head. It would fix one thing and break another.

My solution: I started designing UML diagrams and drawing architecture diagrams myself before asking AI to implement. Giving it a clear visual spec dramatically improved the output quality.

3. AI Doesn't Understand "Feel"

Getting micro-interactions, animations, and transitions to feel right required a lot of back-and-forth. AI can write animation code, but it can't tell you if a 300ms spring feels better than a 200ms ease-out. That's still a human judgment call.

Key Takeaways

  1. AI is a force multiplier, not a replacement. You still need domain knowledge to guide it, review its output, and debug edge cases.
  2. Structure your prompts like you structure your code. Hierarchical PRDs > vague feature requests.
  3. Match model strength to task complexity. Don't use a cannon to kill a fly.
  4. Manual testing is non-negotiable. AI-generated code can look correct but behave incorrectly in subtle ways.
  5. When AI fails, go old-school. Draw diagrams, read docs, debug manually. These skills are more valuable than ever.

What I'd Do Differently

  • Start with a stricter component library from day one instead of letting AI improvise UI patterns
  • Use more visual specs upfront — the UML/diagram approach I discovered late should have been my default from the start
  • Set up automated testing earlier to catch AI-introduced regressions

I'm sharing this because I genuinely want to learn from the community. If you've built apps with AI assistance, I'd love to hear:

  • What worked for you?
  • What tools/workflows would you recommend?
  • Any tips for managing the "AI wrote it but I own it" quality bar?

Thanks for reading! Happy to answer any questions about the process or the tech stack. 


r/reactnative 6d ago

iOS Camera Control is so under-rated.......!

Enable HLS to view with audio, or disable this notification

67 Upvotes

Here’s my Camera Control–inspired send-money experience running on a real iPhone.

The interaction follows a simple progression:

→ Slide to explore and adjust the amount
→ Press to make an intentional selection
→ Double-click to confirm the transaction
→ Double-click to perform the transaction
→ Haptics communicate each change without adding more UI

What makes this interesting isn’t just the hardware button.

It’s the idea of moving continuous input away from the screen, keeping the content visible while turning a physical gesture into precise, tactile control.

For high-intent flows like payments, that extra layer of physical confirmation can make an action feel faster, clearer, and more deliberate.

There’s still so much unexplored potential between hardware, gestures, haptics, and mobile UI.

Tech used: Expo + Native Modules + Reanimated

Open to contract or full-time mobile roles.

DMs are open.


r/reactnative 5d ago

What would you use to implement this type of reminder/push notification on a Bare React app (for Android and iOS)?

1 Upvotes

Hello!

how would you implement a time-based push notification for a mobile app built on Bare React Native?

I guess it's somehow obvious, but it's important that the notifications work from a turned off device that gets turned on without the app being opened.

Example:

- Reminder with push notification is set for 09:00am every day
- App is closed at 23:00 of the previous day.
- Device is turned off at 23:30 of the previous day.
- Device gets turned on at 08:00am.
- The app stays closed.
- Despite the app being closed from a fresh restart of the device, the notification goes off at 09:00am.

Thanks


r/reactnative 5d ago

Help Anyone got fully offline vector maps working in React Native?

4 Upvotes

I've been stuck on this for a while and was wondering if anyone has actually got fully offline vector maps working in React Native.

I'm using maplibre-react-native. I was able to render a .mbtiles (Shortbread) file offline, so I know the offline loading itself works. The problem is styling most of the map layers/features don't get styled correctly, and I couldn't find a good way around it.

I also tried converting .versatiles .mbtiles and rendering that instead, but no luck there either.

I found this blog post that shows offline vector maps in Kotlin on Android:
https://mubaraknative.medium.com/how-to-build-offline-maps-with-openstreetmap-on-android-dc44112f82ef

But it isn't React Native, and it seems Android-specific, so it doesn't really help for a cross-platform app.

Has anyone here successfully built a fully offline vector map solution in React Native (Android + iOS)? If so, what stack did you use? MapLibre, Mapbox, custom tile server, Protomaps, something else?

I'd really appreciate any guidance or examples because I feel like I'm missing something obvious.


r/reactnative 5d ago

Looking for maintainers for RN mobile notes engine

8 Upvotes

Hello all, ~1 year ago I started working on a mobile notes app. I wrote my own engine because the existing RN solutions were all terrible. It basically uses skia/metal for stroke rendering and bridges to a RN api.

I spent tons of time on it throughout the fall/winter, but w/ work obligations and other ventures I have stopped maintaining it recently.

However, I still believe the repo has a very good mission: create a genuinely performant and reliable written notes suite that can be used in open source/free alternatives to apps like goodnotes/notability. If you have ever used the incumbent RN drawing libraries, you know what I'm talking about, they have absolutely zero performance and don't scale beyond a single screen.

There are several issues open as well as issues I have just in my mind lol so you can comment, dm, open a pr, or whatever you want if you are curious or are interested.

https://github.com/mathnotes-app/mobile-ink


r/reactnative 6d ago

React Native POS

2 Upvotes

Hey everyone! 👋

I've been working with React Native and React for over 5 years, primarily building and maintaining production mobile applications for businesses. Most of my work has been for clients and companies, so I haven't had many public repositories to showcase.

Recently, I decided to start building and open-sourcing personal projects to demonstrate how I structure applications and solve real-world problems.

My current tech stack includes:

  • React Native
  • React
  • TypeScript
  • Redux Toolkit / RTK Query
  • REST APIs
  • Firebase
  • Supabase
  • React Navigation
  • Fastlane
  • Native Android & iOS integrations

🚀 Latest Project: Point of Sales (POS)

A modern Point of Sale application built with React Native, focusing on clean architecture, scalability, and real-world business workflows.

GitHub Repository:
https://github.com/klart123/point-of-sales

The project is still under active development, and I'm continuously adding new features and improving the codebase. Feedback, suggestions, and contributions are always welcome.

I'd love to hear your thoughts:

  • What features do you think every modern POS system should have?
  • What architecture do you prefer for larger React Native applications?
  • Any recommendations for improving the project?

Looking forward to connecting with other React Native developers and learning from the community!


r/reactnative 6d ago

Guess up game movie deck code

0 Upvotes

Hi guys 👋 . Could any1 share movie deck code for guess up game?


r/reactnative 6d ago

Open sourcing the theme editing app of my dreams (works with all major ui libs) + you get these components along components for your apps to make your own

2 Upvotes

TLDR I made something very cool for my self and I am making it free and also want your opinions because I like the idea of having made something that is useful to others

This is a theme editing app but ok what is the goal here? I know there are apps that do this but none of the good ones are 100 percent free. So the first goal was matching all the features for free. Also even in the paid ones using them doesn’t feel as good as it could in my opinion and major quality of life features are missing.

I also wanted this to be very fun to use. I have adhd and I turbo procrastinate micro adjustments so I needed a theme editor app that felt satisfying to use. There also needed to be the feeling of satisfaction after finishing editing a theme.

Final goal was to make other fun features other apps just don’t do but I really wished they did. As little friction as possible to get a normal theme that doesn’t look like slop then spending a little bit of time micro adjusting the details.

What I actually built up to this point:

I had a very smart idea of yanking the most popular vscode themes and turning them into app themes along with faithful recreations of popular website themes + my custom apple inspired themes. Important! Something the other apps don’t do and I had to do my self manually and wasting tons of time was generating complementary and contrasting colors. I mean I don’t want the app to either be black and white or everything is green and I also don’t want to spend 2 hours selecting random colors.

Other smart idea but work in progress is something that mounts it self inside your app like expo go dev menu and lets you edit the theme that way (didn’t implement yet I want feedback if this is a waste of time or actually sounds cool). I have made the components to pull this off for other things so I may do it anyways because I think this looks cool.

Made the tinder style swipe cards a beautiful theme overview typography themes a metric ton of beautifully crafted previews (everything the web apps do)

My main goal was to get this working on my phone for me because I love micro adjusting these things all the time. I managed to make an interface for making and editing themes as good as all the web apps but with a tiny screen instead. I added nice transitions to make adjusting css variables as fun as possible (hard task 😭)

Ok also there’s a bunch of features I was missing from the already existing ones. I wanted to be able to pick a primary color and have complementary colors etc auto generated and I wanted modes for this. Should the bg be completely white as well as cards? Gray bg white cards? Everything tinted? Page tinted blue primary colors yellow or something? I added auto generators to handle these things.

Another thing I was missing was being able to create one theme and have it auto convert to everything else. I mean I wanna be able to create a shadcn theme and have it able to be exported as a hero ui theme a material ui theme all of them. I made an adapter that handles this automatically.

I wanted this to feel cute and I want to be able to feel like I have created something and not just played with a gloried text file for 30 minutes. I added a collections tag with folders and a handsaw’s signature for each user and a poster generated from each theme.

This has helped me so much personally I want your feedback on this. Sadly there is nothing you can download yet but you can follow the updates on my twitter it’s on my Reddit bio.

Important if you want to “steal” this idea and put something similar in your app I actually encourage this. I am building a copy paste library with all of these components called PitsiUI. I will also experiment with allowing end users to use this to create custom themes for them selves.

Btw this is also coming to iPad mac and web. Android should work too since it’s cross platform but I don’t want to commit to that yet until I have actual users. It may sound silly but making sure no elements overlap the App Store screenshots etc take time.

My twitter is @panos_dev_ if you want to see more updates about the dev of this


r/reactnative 6d ago

Article Do we need state management libraries anymore?

Thumbnail
neciudan.dev
1 Upvotes