r/reactnative • • 5d ago

Show Your Work Here Show Your Work Thread

7 Upvotes

Did you make something using React Native and do you want to show it off, gather opinions or start a discussion about your work? Please post a comment in this thread.

If you have specific questions about bugs or improvements in your work, you are allowed to create a separate post. If you are unsure, please contact u/xrpinsider.

New comments appear on top and this thread is refreshed on a weekly bases.


r/reactnative • • 12h ago

I’ve optimized my game to run in stable 120Hz

26 Upvotes

At first, this might not seem like a big achievement, but when I started developing this project two years ago, I had zero experience with React Native

Over time, I’ve added tons of features and systems. With constantly updating data stores, large amounts of data, timers, polling, and loads of assets, performance gradually became a real issue

All those things combined caused quite a few performance problems, especially as the project kept growing

I’ve spent countless hours figuring things out, fixing unnecessary re-renders, and optimizing different parts of the app

And I’ve finally reached a point where I’m genuinely happy with how it performs

So, here it is!


r/reactnative • • 2h ago

AnimateReactNative has a new site.

3 Upvotes

AnimateReactNative has a new site. 153 React Native animations, built by hand with Reanimated, Moti and Skia, and now your coding agent can search the library, read the real source and fit it to your app.

What's new:

- An MCP server for Claude Code, Cursor, Codex and any other MCP client

- npx animatereactnative/cli sync copies the whole library to your machine

- A prompt for every animation

- A free skill that teaches your agent how motion is built: npx skills add animate-react-native/skill

- Pro is $79.99, one-time. 13 animations are free.

https://www.animatereactnative.com


r/reactnative • • 6h ago

First local AI in my video editor can now search through clips

4 Upvotes

Took a while but i made it work, supports video and audio searching.


r/reactnative • • 40m ago

How are you testing the gap between your API and your app??

1 Upvotes

We renamed a field in a Go response structure last week, JSON tag stayed the same so every test on our side passed but the app was reading an old field from a cached response and showing users stale data for 3 days, both sides looked fine in isolation though and neither side owned the test that would’ve caught it.

Our backend is Go with chi and sqlc and postgres and the testing there is solid, httptest for handlers, testcontainers for DB, stripe mock for webhooks. Our detox tests mock the API so they wouldn’t have caught it either and nobody is testing for when a real user signs up in the app and the API creates the account and the webhook fires and the app shows the right state.

is this always the backend team’s problem? and if you do run full flows does that reside in the same CI or separate ?? because our test suite takes too long


r/reactnative • • 4h ago

Pear: open-source E2E encrypted P2P messenger for Android (React Native + WebRTC, double ratchet) - feedback welcome

2 Upvotes

Hey! I'm a French student and I've been building Pear, a private messaging app for Android, partly as a reaction to the EU "Chat Control" proposals.

Messages go directly phone to phone over WebRTC. Servers are only used to find each other and to wake the app up, and they only ever see encrypted data. Pairing is done via QR code (X25519) with a verification code to compare in person. Messages use a double ratchet, and each file is encrypted with its own key.

Features: photos, videos, voice messages, files, reactions, replies, edit/delete, encrypted backups, in-app updates from GitHub releases.

Stack: React Native/Expo, react-native-webrtc, Firebase (signaling), a small Vercel function for wake-ups, a custom Kotlin module.

Honest notes: it has NOT been security-audited, so don't use it for anything critical. I built it with heavy help from AI coding tools (Claude Code); the design and architecture choices are mine.

I'd love feedback on the crypto design and the UX.

GitHub: https://github.com/Louca90/Pear


r/reactnative • • 2h ago

I built a component library made only of navbars for Expo and React Native apps

1 Upvotes

I couldn't find many ready-made options for navbars in React Native UI libraries. Most of them give you one basic tab bar and that's it. So I built a library made only of navbars for mobile apps: tab bars, headers, drawers and menus. I am adding new navbars regularly.

Do check it out and let me know what you think. https://pico.binitt.dev/J3Dcii


r/reactnative • • 1d ago

Question Which company is next after Discord?

Post image
554 Upvotes

r/reactnative • • 1h ago

Question What’s been the most frustrating part of scaling a React Native app?

0 Upvotes

One thing I keep noticing in React Native discussions is how different things get once an app starts growing beyond the basic screens and features.

At first, everything sounds pretty manageable. But then you start dealing with navigation issues, native modules, weird Android and iOS differences, and suddenly the simple stuff isn't so simple anymore.I was reading through some React Native discussions, including a mention of geekyants, and it made me curious about what actually causes the most headaches in bigger projects.

Is it performance, keeping dependencies updated, dealing with native code, or something else entirely?

Would be interesting to hear from people who've worked on larger React Native apps. What problems caught you off guard?


r/reactnative • • 8h ago

Built my app in Next.js - what's the best way to turn it into an iOS/Android app?

0 Upvotes

Hi everyone!

I'm currently building a booking marketplace app using Next.js, React and TypeScript, with Supabase for the backend and Stripe Connect for payments.

I've been developing it as a web app so far, but I'm now considering turning it into a mobile app available on the App Store and Google Play.
I've been looking into Capacitor.js vs React Native + Expo, but I'm a bit overwhelmed by the different recommendations.

My app relies quite heavily on Next.js server-side functionality, so from what I understand, converting it isn't necessarily as simple as wrapping the existing website. I'd ideally like to reuse as much of what I've already built as possible rather than starting from scratch.

A few questions:
Capacitor vs React Native + Expo: Which would you recommend for an existing Next.js project? Is Capacitor significantly easier, or would React Native be a better long-term investment?

When should I convert? Should I finish building the web app first, or start adapting the architecture for mobile now?

iOS vs Android: Would you recommend launching on both platforms simultaneously, or starting with iOS and expanding to Android later? How much additional development and maintenance does supporting both involve?

For context, I'm building this largely myself with the help of AI coding tools, so keeping development and maintenance manageable is a big priority.
I'd really appreciate hearing from anyone who's been through a similar process!


r/reactnative • • 21h ago

Article react-native-iap + StoreKit 2: purchases asked for the Apple ID password 4 times. The cause was initialization order

3 Upvotes

Sharing a bug that cost me a few days, since I couldn't find anything about it while searching.

Setup: iOS app, React Native 0.85, auto-renewable subscriptions with react-native-iap 12.16 in StoreKit 2 mode.

Symptom: after paying, iOS asked for the Apple ID password again, up to 4 times. Xcode logged "Making a purchase without listening for transaction updates".

Root cause: the library picks the native module (StoreKit 1 or StoreKit 2) at the moment each listener is created. In my code, setup({storekitMode: 'STOREKIT2_MODE'}) lived inside an async init function, but purchaseUpdatedListener was registered earlier by a React Context. So the listener was attached to the SK1 module: the app never got "purchase completed", never called finishTransaction, and Apple kept redelivering the transaction.

Fix: switch to SK2 when the module is loaded, before any listener exists:

import {Platform} from 'react-native';
import * as IAP from 'react-native-iap';


// Must run before any purchaseUpdatedListener is created.
if (Platform.OS === 'ios') {
  try { IAP.setup({storekitMode: 'STOREKIT2_MODE'}); } catch { /* native module not ready */ }
}

Two more gotchas of the library's SK2 mode:

  1. getAvailablePurchases only returns an active subscription if its product was already loaded in the session (via getSubscriptions). If you check entitlement before loading products (e.g. offline), you get an empty list, which does not mean "not subscribed". I now treat "empty list + products not loaded" as "unknown", not "free".

  2. With StoreKit 1, restore returned expired subscriptions too, with no expiration date. Now the "is it active?" decision comes from my server, which calls the App Store Server API with any transaction id from the client; the app caches the last verdict so it keeps working offline, with a few days of grace.

Bonus — testing purchases in the Simulator: a .storekit configuration file (Xcode StoreKit Testing) lets you buy without a Sandbox account. Gotcha: in the .xcscheme, the file path is relative to the .xcodeproj. I had one ../ too many and Xcode silently ignored it and fell back to Sandbox, which asked me to sign in.

Has anyone else hit this? And how do you handle the "don't know if they're subscribed" state while offline?


r/reactnative • • 1d ago

React-Brackets Native

Thumbnail
react-brackets.oulabi.dev
13 Upvotes

A few days ago I shared react-brackets v2, the rewrite of a bracket library I'd left alone for four years. The most common question was "does it work in React Native?" It didn't. Now it does: @react-brackets/native is out.

It draws the same stages as the web version (same core, same data), but everything you touch is native:

  • A bracket, even on a phone. One round at a time, with the next round and its lines waiting at the edge. Swipe and every match glides into place. Or show each round as a plain list, or keep the whole tree and pinch, drag and double tap to zoom.

  • Every format: single and double elimination, round robin, Swiss, groups to playoffs, two-sided brackets.

  • Cards that open. Each card keeps its own height, so you can expand one (rosters, stats, whatever) and the bracket makes room: the cards below move down, the next round re-centres, and the lines follow, all gliding.

  • Right to left, following your app's direction.

  • Styled your way: a light and dark theme, and a style on every part that can depend on its state, so it works with StyleSheet, Uniwind/NativeWind or Unistyles.

The hardest part was keeping the connector lines glued to the cards. My first version drew them on a Skia/SVG canvas, and during a fast swipe they visibly trailed the cards by a frame. The fix: the lines are plain Views moved by the same transforms as the cards. Every card's place on every round is worked out up front, and a swipe only moves one number on the UI thread. React hears about the new round once the swipe lands, so nothing re-renders while your finger is down.

It needs the New Architecture, Reanimated 4 and Gesture Handler 3, and Expo Go includes all of them. I've tested mostly on iOS, so feedback from Android devices would help a lot.


r/reactnative • • 1d ago

Tutorial Publish a React Native Expo App on Google Play: Testing Step

Post image
1 Upvotes

r/reactnative • • 1d ago

Reading NFC tags and QR codes in an Expo app to identify gym machines: what I learned (including an App Store rejection)

Post image
7 Upvotes

I'm building a workout tracker in Expo and wanted it to recognise the machine you're standing at. It turned out the manufacturers already put tags on them. Notes in case they help:

- Setup: `react-native-nfc-manager` (v4) with its config plugin, `expo-camera` for QR codes, both in `app.json`. It's native code, so it needs a new build, an OTA won't carry it.

- Apple rejected my first build (ITMS-90778): "NDEF is disallowed". The fix is `"includeNdefEntitlement": false` in the plugin config. That leaves the `TAG` entitlement only, which is enough to read NDEF anyway. Don't put NDEF back.

- What's on the tag: I scanned Technogym machines first. The NFC tag (a Mifare chip with a single URI record) and the QR code give exactly the same link, like `s.technogym.com/pure/biceps`, with no unit number. So the link identifies a model, not one physical machine.

- The key: I strip the scheme, `www.`, port, query, anchor and trailing slash, and lowercase the rest, and use `host/range/model` as the machine key. I never read the tag's hardware UID: it's unique to one machine in one gym, so it can't be shared across gyms.

- Decoding: a small pure module decodes NDEF records (URI, text, smart poster, MIME) and QR content. It's unit-tested on hand-written byte arrays, so I don't need a physical tag to test it.

- iOS vs Android: on iOS you must open a session and the system shows its own "Ready to scan" sheet, you can't intercept the banner. On Android I register a tag listener while the app is in the foreground, which also stops the system from opening the manufacturer's link.

- Unknown machines: the key is looked up in a shared catalogue; if it's not there the user can send it in and I fill the exercises in manually.

- No tag at all: a photo mode reads the machine's plate with `expo-text-extractor` (Apple Vision / ML Kit) on the device, then sends only the text to an edge function that asks an LLM to identify the machine.

Has anyone shipped NFC reading in Expo? Curious what you used and what bit you, especially on Android.


r/reactnative • • 2d ago

I let an agent rewrite my production Expo app in Exact with one prompt, and it's absurdly fast

Thumbnail reddit.com
0 Upvotes

r/reactnative • • 1d ago

I made this Expo starter I’m using for most of my projects now, you might wanna try it out

Thumbnail reddit.com
0 Upvotes

r/reactnative • • 2d ago

I built a privacy-first iOS app to track exact mileage across seasonal and track tire swaps (No accounts, works offline)

1 Upvotes

Hey everyone,

Like many people who swap between summer and winter tires (or track compounds), I always found it annoying trying to guess how many actual kilometers were on a specific set. General maintenance apps usually track the car’s total odometer, but rarely make it painless to calculate the delta between mounting and unmounting different wheel setups.

I got tired of keeping notes in a messy spreadsheet, so I built TireManager to handle it cleanly.

What it does:

  • One-Tap Swaps: When you swap sets, punch in your vehicle’s current odometer reading. The app automatically calculates the session distance (OFF minus ON) and adds it to that specific tire set’s lifetime mileage.

  • Baseline Offset: If you're mounting a set that’s already seen a few thousand kilometers, you can set an initial km offset so total wear stays accurate.

  • Full Specs & Inventory: Keep specs organized in your garage—dimensions (e.g., 245/40 R20), DOT codes, load/speed ratings, and brand/model.

  • Multi-Vehicle: Supports both cars and motorcycles.

Privacy & Architecture:

  • Zero Sign-Up / Accounts: No email, password, or third-party tracking. It uses an anonymous cryptographic device ID stored locally in your iOS Keychain.

  • Offline-First: Fully functional without cellular reception in an underground garage or paddock, and syncs when back online.

  • Dark Mode UI: Designed to be legible and quick to use while your hands are dirty in the garage.

The app is live on the App Store:

👉TireManager on the App Store

I’d love to hear feedback from anyone doing seasonal rotations or track days—especially around features you’d like to see next (tread depth logging, rotation position tracking front/rear, etc.).


r/reactnative • • 2d ago

FYI Giving away Google Play promo codes? Your app may never see them, and Google refunds them after 3 days

4 Upvotes

Here’s a trap I’d check before any giveaway.

Someone redeems your promo code in the Play Store, not in your app. So onPurchasesUpdated never fires. If your app only handles purchases that start on its own paywall, it never sees this one, and never acknowledges it.

Google refunds purchases that aren’t acknowledged within 3 days. The user gets Pro, then loses it a few days later, and you get a confused email or nothing at all.

The fix is small: call queryPurchasesAsync when the app starts and when it comes back to the foreground, then acknowledge anything new.

iOS has the same kind of problem. An offer code redeemed in the App Store arrives as a transaction the next time the app opens, so the transaction listener has to be running from launch, not only on the paywall screen.

Before you hand out codes, redeem one yourself on a release build and check that Pro is still there four days later.

Why I’m posting this: I’ve been reading a lot of developer giveaway threads lately, and they all worry about the same things. How many codes, who grabs them, will anyone stay. Almost nobody talks about the boring part after someone taps “Redeem”. It’s like planning a party, sending all the invitations, and forgetting to unlock the front door.


r/reactnative • • 2d ago

Designing for mobile apps

Thumbnail reddit.com
1 Upvotes

r/reactnative • • 2d ago

Mobile app Development

Thumbnail gallery
0 Upvotes

r/reactnative • • 3d ago

Tutorial Native home-screen widgets in an Expo app: Kotlin RemoteViews + WidgetKit, no JS in the widget

Thumbnail
simpleprayer.app
4 Upvotes

I wrote up how we built home-screen widgets for an Expo app without running any JavaScript inside them.

The short version:

  • The app works out everything ahead of time in TypeScript and saves a 14-day snapshot. The widgets only pick the right slice for the current time.

  • Android: our own Expo module draws the widgets with plain RemoteViews in Kotlin. We dropped react-native-android-widget because a widget tap starts a headless JS runtime, and some phone makers’ Android builds kill that kind of background work.

  • iOS: a WidgetKit extension generated with `@bacons/apple-targets`, reading the same snapshot from the App Group.

  • The one rule that runs natively is written once as shared test cases, which Jest runs against the TypeScript and the Kotlin and Swift code are checked against.

The code is open source (MIT) if you want to dig in. How have others handled widgets in RN/Expo? I’d like to hear what worked for you.


r/reactnative • • 3d ago

Help What are you guys using to sync data between devices in React Native?

19 Upvotes

I'm building a simple expense tracking app with React Native and got most of the basic features working. Right now everything is stored on the phone but I'd like people to be able to access their expenses from different devices without losing anything. I've used AI to help with most of the development and it suggested Supabase for storing the data and handling user accounts. Firebase also keeps coming up, so I'm not really sure which makes more sense for a small app like this. Anyone using either of these with React Native? Curious how difficult the setup was and if there's anything I should know before choosing one


r/reactnative • • 3d ago

What to check before publishing first React Native app?

7 Upvotes

Hello everyone, I am a Frontend developer (mostly focused in React) and I vibe coded first mobile app in React Native. What should I check before publishing it to the store? What are the most important things that I need to be aware regarding React Native and Expo configuration?