/r/reactnative

Photograph via snooOG

A community for learning and developing native mobile applications using React Native by Facebook.

About:

A community for learning and developing native mobile applications using React Native by Facebook.

Interested in building web apps using React.js? Check out /r/reactjs!


React Native Links:

Getting Started w/React Native

IRC Chatroom:

irc.freenode.net #reactnative

Related Subreddits


Keywords: ios, android, mobile, apps, apple, iphone, ipad

/r/reactnative

141,244 Subscribers

1

HELP PLEASE. I'm going insane with trying to launch my app for the past 5 hours

error Failed to install the app. Command failed with exit code 1: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081

'gradlew.bat' is not recognized as an internal or external command, operable program or batch file.

I've tried downloading Gradle manually. Looked at videos, asked chat gpt, gemini. I'm going in circles...HELP

0 Comments
2024/12/12
18:45 UTC

1

Trying to add enable translations in my app with i18next and react-i18next but its not working.

Hello everyone, third post of requesting help.

I'm trying to enable "internationalization/translations" into my app. However, whenever I try to re-build my app to see the new changes, Expo returns an error of no apps currently connected.

This is my current folder structure.

- root_folder
-- app
--- (drawer)
---- search
----- index.tsx
---- _layout.tsx
--- _layout.tsx
-- locales
--- en
---- translation.json
--- es
---- translation.json
-- types
--- i18next.d.ts
-- i18n.ts
-- app.json
-- package.json

this is my current `types/i18next.d.ts` and my `i18n.ts` files:

// types/i18next.d.ts
import 'i18next';

declare module 'i18next' {
    interface CustomTypeOptions {
        resources: {
            en: typeof import('../locales/en/translation.json'),
            es: typeof import('../locales/es/translation.json')
        }
    }
}

// i18n.ts
import i18n from "i18next";
import { initReactI18next } from "react-i18next";
import * as Localization from "expo-localization";
import LanguageDetector from 'i18next-browser-languagedetector';

// Init i18next
i18n
    .use(LanguageDetector)
    .use(initReactI18next)
    .init({
        // lng: Localization.getLocales(), // Initial language
        lng: 'en',
        backend: {
            loadPath: '@/locales/${{lng}}/.translation.json'
        },
        interpolation: {
            escapaValue: false, // React already escapes strings
        }
    });

export default i18n;

Lastly my `app/_layout` file where I'm using the provider:

import { useFonts } from 'expo-font'
import { Stack } from 'expo-router'
import * as SplashScreen from 'expo-splash-screen'
import { useEffect } from 'react'
import 'react-native-reanimated'
import { I18nextProvider } from 'react-i18next'
import i18n from '@/i18n'
// Prevent the splash screen from auto-hiding before asset loading is complete.
SplashScreen.preventAutoHideAsync()
export default function RootLayout() {
  const [loaded] = useFonts({
    SpaceMono: require('../assets/fonts/SpaceMono-Regular.ttf'),
  })
  useEffect(() => {
    if (loaded) {
      SplashScreen.hideAsync()
    }
  }, [loaded])
  if (!loaded) {
    return null
  }
  return (
    <I18nextProvider i18n={i18n}>
      <Stack>
        <Stack.Screen name="(drawer)" options={{ headerShown: false }} />
        <Stack.Screen name="+not-found" />
      </Stack>
    </I18nextProvider>
  )
}

No translation are working

0 Comments
2024/12/12
18:44 UTC

0

Is there a starter template or boilerplate for converting a WordPress website into an app using the in-built REST API or GraphQL?

My hyper-local niche news website has gotten rather popular and there is a strong demand for it to be available as an app with notifications as most people would like to be abreast of the news as it happens as opposed to using the mobile browser.

This website was built with WordPress which provides the in-built REST API or I can even use GraphQL to get the posts in JSON format.

Now, I am a web designer with limited knowledge of app development but I hear RN is easy to pick up if you know Javascript/CSS which I do. I have even begun building small apps and feel good about it.

So rather than starting from scratch I am hoping if there is a starter template or boilerplate that handles the fetching and display of post from WP so I can focus of building the UI to lessen my load.

So does something like this exist?

1 Comment
2024/12/12
17:50 UTC

5

APK build without EAS

I have an app integrated with firebase for authentication and database, I want to test the features of this app on my phone without any environment on top. Like a production build. But without eas because it's very slow in free tier.

How can I build an apk similar to that of production and directly download it on my android phone?

6 Comments
2024/12/12
17:08 UTC

1

Any good books for interview prep?

I just got rejected for a React Native Senior position after the technical interview. It's happened more than once now. This one was just building a to-do app in front of three other engineers. I've been working in React Native for the past 4 years and should be able to handle this better.

Can anyone recommend books to study to perform better in these interviews? I think I need to better understand what the interviewers are making their decision on and probably fill some gaps in my knowledge.

0 Comments
2024/12/12
16:54 UTC

2

📢 We're Hiring! Part-Time Tamagui Storybook Developer 🚀

Hey react-native fam! 👋

I don't see any rules about not being able to post jobs.

Our fin-tech startup https://figwealth.io/ is looking for a part-time developer to help us enhance our component library and Storybook setup. If you're passionate about creating polished, reusable UI components and love the world of design systems, this could be the perfect gig for you!

Role Overview

  • Position: Part-Time Storybook Developer
  • Industry: Fin-tech Startup
  • Workload: ~10-15 hours per week (flexible)
  • Duration: Ongoing, with potential to grow

What You’ll Be Doing

  • Setting up and refining our Storybook environment for Tamagui components.
  • Building, documenting, and maintaining reusable UI components in a design system.
  • Collaborating with our team to ensure seamless component integration.
  • Writing clean, scalable code with a keen eye for accessibility and performance.

What We’re Looking For

  • Experience with Tamagui, React, and Storybook.
  • Strong knowledge of component-driven development.
  • A great sense of UI/UX best practices.
  • Familiarity with design systems in fast-paced environments (bonus: if you've worked in fin-tech or startups before).
  • A team player with excellent communication skills.

Why Join Us?

  • Work on exciting challenges in the fin-tech space.
  • Join a small, agile team with a big vision.
  • Flexible hours, perfect for a side hustle or additional experience.
  • Competitive compensation.

📩 Interested? DM me with:

  • A brief intro about yourself
  • Your portfolio or GitHub
  • Any relevant experience with Tamagui, Storybook, or design systems

Let's build something amazing together! 🙌

0 Comments
2024/12/12
16:47 UTC

1

App crashing on android after upgrading to expo 52

It's running fine in IOS, but in android I see this in logcat:

Caused by: com.facebook.soloader.SoLoaderDSONotFoundError: couldn't find DSO to load: libhermes_executor.so

existing SO sources:

SoSource 0: ApplicationSoSource[DirectorySoSource[root = /data/app/~~0erT6PD-RmWgIw-G_ztW0Q==/com.benhavis.upinjtyc832ezysr5qkcjpax-o3bUKdSJ7inLfkVDadIGlw==/lib/arm64 flags = 0]]

SoSource 1: DirectApkSoSource[root = [/data/app/~~0erT6PD-RmWgIw-G_ztW0Q==/com.benhavis.upinjtyc832ezysr5qkcjpax-o3bUKdSJ7inLfkVDadIGlw==/base.apk!/lib/arm64-v8a]]

SoSource 2: DirectorySoSource[root = /system/lib64 flags = 3]

SoSource 3: DirectorySoSource[root = /vendor/lib64 flags = 3]

Native lib dir: /data/app/~~0erT6PD-RmWgIw-G_ztW0Q==/com.benhavis.upinjtyc832ezysr5qkcjpax-o3bUKdSJ7inLfkVDadIGlw==/lib/arm64

1 Comment
2024/12/12
16:25 UTC

1

Which database should i use for expo project in 2024

Hi everyone i recently start working on react native, i choose expo because it's easy to newbie but till recently i need to add database into my project. I have tried to use realm but if i use realm i will unable to use expo go to run project. Are there any other database option for me?. Thanks for reading ^^

2 Comments
2024/12/12
14:35 UTC

2

react-native ios build fails for minimum deployment target

I'm trying to install unistyles into a react native project (0.76.1). I'm having an ussue with the dependency react-native-nitro-modules. It's installed but when trying to run an ios simulator I get the following error:

Compiling for iOS 15.1, but module 'CxxStdlib' has a minimum deployment target of iOS 16.0: /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/lib/swift/iphonesimulator/CxxStdlib.swiftmodule/arm64-apple-ios-simulator.swiftmodule

As I understand correctly, I need to change my minimum deployment to 16.0.

In XCode, I changed the "Minimum deployments" (Project > General) to 16.6. I also checked the pods, and in "Build settings > iOS deployment target", I see 15.1, so probably this is the error. I changed it to 16.0. When I run a build again, it still fails with the same error. If I run pod install again, this value falls back to 15.1, so it seems like somewhere 15.1 is still set, but I don't know where?

Edit: I found this article on stack overflow and I've added the following code to my podfile in the post_install section:

    installer.pods_project.targets.each do |target|
      target.build_configurations.each do |config|
        config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '16.0'
      end
    end

This works, but I don't understand why the individual pod files don't take over the min deployment target set in the podfile?

2 Comments
2024/12/12
14:19 UTC

4

Solana Wallet Tracker

I built a solana wallet tracker

Features Track multiple Solana wallets at a glance. Real-time push notifications for incoming and outgoing SOL transactions.

Love - https://github.com/ElSierra/Solana-Notification-React-Native

2 Comments
2024/12/12
13:54 UTC

1

expo-speech-recognition not asking request permission in android emulator

Hello guys! I have a question, so I'm using `expo-speech-recognition` and tested the example from its GitHub repository, and I get this error with the permission. `Permissions not granted {"canAskAgain": false, "expires": "never", "granted": false, "status": "denied"}` How do I fix this? It seems I can't ask permission anymore in my android emulator for this app, and I tried to check the permission in my android emulator settings, but I don't see any related permission that can be undone or something.

 

In the web it works fine and asks for permission, but not with my Android emulator.

2 Comments
2024/12/12
11:53 UTC

0

Does react native CLI not support css files?

3 Comments
2024/12/12
11:45 UTC

0

Paste Button on duble click sometimes shows up as blank

0

One of my app users encountered this error. When the user double clicked on a text field the paste button which is next to autofill sometimes showed up as blank which is very werid.

I want to know if this is an OS issue or an app issue?

App technologies are expo, react-native

User was using iPhone 14 pro max with iOS 18.1

https://preview.redd.it/3ha7y3anke6e1.jpg?width=447&format=pjpg&auto=webp&s=3df9bd256da87a2a090e5a562dbf08315eff2979

0 Comments
2024/12/12
11:27 UTC

0

Why React Native has the term "native" in its name?

React Native doesn't compile to native code, i.e. machine code, so I'm wondering why does it have 'native' in its name?

6 Comments
2024/12/12
11:00 UTC

5

What linux are you using?

I tried some linux distros but almost all of them had issue at some point.

Problem: I use Android Studio emulator, when I choose emulator to use software graphic rendering it takes much CPU, so I choose hardware graphic rendering. It works for 5-10 minutes OK but then screen starts to blink white and then just white screen, but everything is functional except display.

Specs: Name: Honor Magicbook X16 Pro 2023 CPU: AMD Ryzen 7840HS GPU: AMD Radeon 780M (integrated) RAM: 16 GB

I used Windows too, but it is a bit lagging with android emulator. Tried distros: Ubuntu, Debian, Fedora, OpenSUSE, Arch, Pop OS, Kubuntu.

What do you recommend?

6 Comments
2024/12/12
10:47 UTC

1

@react-native-google-signin/google-signin alternatives?

https://preview.redd.it/1cjdg5khxd6e1.png?width=1320&format=png&auto=webp&s=bc885d35f4b8f1549d0c1bff3c9dbc1d666193fd

As we know the legacy Google Signin for Android will be removed in 2025 and we have to upgrade the Google sign-in to the modern api. The author of u/react-native-google-signin/google-signin charges fee for using the paid version of the library to use the modern api. Any free library out there support modern api? or we all have to pay the fee to use that lib? Thanks for help!

1 Comment
2024/12/12
09:23 UTC

3

Any Good AI React Native tool out here ?

Hello :) I've been using v0, bolt and lovable to build web pages and they are really incredible tools in web dev but I don't seem to find a similar tool for React Native dev ?

Do you know any ?

7 Comments
2024/12/12
08:10 UTC

1

how can i select markdown text segment?

Can anyone provide some good ideas? 

```
<TextInput onSelectionChange={xxx}>{markdownText?}<TextInput>
```
0 Comments
2024/12/12
08:01 UTC

4

Looking for Experts in Hybrid Mobile App Development

I’m mentoring a group of high school students who want to build an app for tracking student volunteer hours. They’re on a tight budget and timeline, so I suggested hybrid mobile app development might work. Has anyone here used hybrid frameworks like Flutter or React Native for something similar?

10 Comments
2024/12/12
06:15 UTC

2

Understanding How Axios Handles Network Requests in React Native (Android)

How does Axios handle network requests in React Native for Android? I need details about how the DNS resolver works and the underlying network layer.

1 Comment
2024/12/12
06:15 UTC

0

SDK 51

Hey,

is there a way to downgrade SDK 52 to 51 in a project

8 Comments
2024/12/12
03:26 UTC

5

Suddenly more margin needed

I’ve upgraded to from SDK 51 to 52 and out of the sudden I need much more margin in IOS for my items.

Instead of 10 I need 100. In android its to much margin.

Did anyone have the same problem?

2 Comments
2024/12/11
23:05 UTC

0

Skia Canvas in Flat List

My situation- I want to display images inside flatlist and in those image I am adding an extra view at bottom with some text and small image. When now user clicks on a download button which is at bottom of screen the image that is downloaded should be actual image + extra view I rendered below.

I tried adding Skia Image and wrote text using Skia Text but Image itself is not loading since image has to be loaded from some URL and to load it I need to use useImage hook from skia which I cannot call from inside body.

17 Comments
2024/12/11
20:40 UTC

1

Animated React Native select/dropdown

I'm working on a React Native Expo project that's built as a native app and a PWA.

I'm using this package (react-native-element-dropdown) for my dropdowns, but it doesn't support any animation.

I'm looking for something that has the same functionality since this dropdown works well with what I need, but animates on open and close. I could also separate the native/PWA versions of the component and use a web package for the PWA and native supported package for native.

Any recommendations for good animated dropdown components in React Native?

2 Comments
2024/12/11
17:14 UTC

1

Difference in installing the app

Hi,

Even aftere years of RN I just can't figure it out with this one.

Why does the app install and work great when it's ran from the CLI.

But then when using the Android Studio nothing really work with strange errors.

Are they both not using the same node, java etc? Is one doing more than the other?

What should I trust more? What are you guys using more? The GUI or CLI?

4 Comments
2024/12/11
17:05 UTC

1

QR Code generation libraries

Hi. I was looking to add a library for QR Code generation to my project.

I knew react-native-qrcode-svg but I noticed that in the npm page (https://www.npmjs.com/package/react-native-qrcode-svg), it says that it is no longer being worked on. Are you still using it? Are there other libraries worth trying out?

I've also looked at https://www.npmjs.com/package/react-native-qrcode-styled but it doesn't seem to be very participated.

Thanks in advance!

0 Comments
2024/12/11
16:21 UTC

35

Thinking of moving to React Native from Flutter

I've been working on Flutter apps since I graduated Uni almost 5 years ago. I was lucky to get a Flutter job during COVID, and have stuck to it since then. To be honest I absolutely love it! But, there seems to be a lot more React Native jobs in the UK and Europe in general. I know the run-up to Christmas is usually rough for job searches, but I am seeing like 3-4x RN jobs compare to Flutter ones. And the RN jobs are all companies that I've heard of xD.

Therefore, I'm thinking of learning React Native, to increase my options. I am also hoping to get my first Senior role, as I've been a Mid the last 3.5 years and as my current role was a Greenfield project, I was involved in all the architectural decisions, demoing to stakeholders, etc.

I was just wondering where you guys/gals would recommend I start? I did somed Web/JavaScript modules in Uni, but that was 6-7 years ago. I worked with Typescript for Firebase Functions in a previous job 2 years ago, so it won't be alien to me, I'm just a bit rusty. I've never used React or React native though.

25 Comments
2024/12/11
16:02 UTC

3

Learning react native and expo

I want to learn react native and expo but I'm finding resources to be a bit confusing. It sounds like react native is the front end of the app and expo is how you get it to run on your device. Also a lot of the stuff out there seems outdated because I think they recently went through an update. Does anyone have a good tutorial/videos on learning react native and expo in its current state?

3 Comments
2024/12/11
13:51 UTC

1

Testing iOS auto-renewable subscriptions in Sandbox environment

Hi everyone!

I decided to implement auto-renewable subscriptions in my React Native app, but I've encountered some problems when it comes to configuring it with iOS.

I am pretty confused with the whole flow of development and testing of subscriptions for iOS. I have created my subscription and configured my Sandbox account. I assigned the subscription to the build, but I have not submitted the build as it didn't include the subscription implementation yet. The status of the subscription was still labeled as Ready to Submit, but I've decided to check if I can already fetch it in the Sandbox environment as in some places online I read that it should be already possible. At that point I still couldn't fetch my subscription in spite of being logged in to the created Sandbox account. Nevertheless, I decided afterwards to try to submit my build (even though the subscriptions have not been implemented yet), but as I was expecting I have received the answer from the Apple Reviewing Team that they cannot let it through as it lacks the implementation of the subscriptions. I've waited some days already in order to make sure that the system had time to notice the subscription I have added, but as I'm still unable to fetch it I ran out of ideas.

Here I come with the questions then for some more advanced developers in this area:

  1. At which point should I be able to fetch my subscriptions in the Sandbox environment? Should it be possible to fetch them when they're still labeled as Ready to Submit? Should I actually somehow pass the Apple review first in order to be able to see them in my code?
  2. If I actually have to implement it first before uploading, any advices on how am I supposed to do that? I find it pretty hard to imagine without any prior testing environment, but maybe I misunderstood the whole flow here

I'm sorry for the chaotic matter of this issue, it's my first time working in the area of in-app purchases :) I am almost certain that I have misunderstood the flow somehow as it seems hard to believe that Apple doesn't have it organised well.

Thank you very much in advance! All the best

3 Comments
2024/12/11
12:20 UTC

21

apk size too big

I have really small app with React Native, it is not full app yet, but when I make release apk version it is 125 mb, I don't get why, svgs are just 14.7 MB and this is my package.json:

https://preview.redd.it/uuuywzoy566e1.png?width=814&format=png&auto=webp&s=bb4a474829bb08df93809566c5be51f973a36b05

27 Comments
2024/12/11
07:10 UTC

Back To Top