React Navigation (using Expo) - location of the MainActivity.java file? - android

I am going through the React Navigation documentation.
In the React Navgation - Getting Started instructions, it says that
"To finalise installation of react-native-gesture-handler for Android", I need to edit the MainActivity.java file.
However I don't have that file in my project, or any other similar directory pertaining to it (./android).
I created my project using expo-cli, in particular:
# To create a new React Native project
$ expo init project-name
# And to run the App in Expo
$ expo start
I am wondering if I have to create a build and how is it done, in order for Expo to create the files used by Android and iOS builds, or is there something else that I'm missing?

Expo
As you used Expo to create your app you will not have an android folder as these are abstracted away from you.
If you wish to use a dependency that requires you to edit native code then you need to eject your application. https://docs.expo.io/versions/latest/expokit/eject
From your command line run expo eject and it will build the necessary ios and android folders for you. However there are several ramifications if you eject your app. You should read the above link carefully.
react-navigation
However, as Expo recommend using react-navigation you don't need to install the react-native-gesture-handler as it is already installed in Expo
https://reactnavigation.org/blog/2018/11/17/react-navigation-3.0.html#installation
First, install the library using your favorite package manager:
yarn add react-navigation#^3.0.0
Next, install react-native-gesture-handler. If you’re using Expo you don’t need to do anything here, it’s included in the SDK.
It even mentions it on the installation instructions page https://reactnavigation.org/docs/en/getting-started.html#installation
Next, install react-native-gesture-handler. If you’re using Expo you
don’t need to do anything here, it’s included in the SDK. Otherwise:
react-native-gesture-handler
Similarly checking the documentation for react-native-gesture-handler it says:
Gesture Handler is already part of Expo and there is no extra
configuration required. However, consider that the Expo SDK team may
take some time to include the newest version of the library - so Expo
might not always support all our latest features as soon as they are
out.
https://kmagiera.github.io/react-native-gesture-handler/docs/getting-started.html#with-expo-https-expoio
Creating a build with Expo
There is no point repeating the steps here to create a build with Expo it goes into quite some detail in the Expo documentation which can be found here https://docs.expo.io/versions/latest/distribution/building-standalone-apps

Related

react-native-google-mobile-ads with Expo managed workflow will not work

I have followed all of the most up-to-date guides and suggestions for getting react-native-google-mobile-ads to work with an Expo managed workflow, including these:
How to use react-native-google-mobile-ads with Expo?
How do I use react-native-google-mobile-ads with Expo and Expo Go?
But I keep getting the same error:
ERROR TypeError: null is not an object (evaluating 'RNAppModule.eventsNotifyReady')
It would seem that this error originates in this jest.setup.ts file:
https://github.com/invertase/react-native-google-mobile-ads/blob/main/jest.setup.ts
but I have no idea what the error is or how to overcome it.
This error happens when I initiate interstitial.load() as per the official documentation.
Any help would be greatly appreciated.
Ran into this same problem. Turns out the command to use was hidden in their docs at the end of the build steps without any explanation.
https://docs.page/invertase/react-native-google-mobile-ads#setting-up-google-admob
Using react-native-google-mobile-ads, Expo Go will no longer be able to handle linking all the native dependencies. So you'll have to use EAS to build it. Per the docs, you can use npx eas-cli build --profile development to build for development. Alternatively, to install locally rather than on EAS servers, add the --local flag to that command. Just note that if building locally you may need to set the Android SDK path following the instructions to edit your eas.json at Expo build EAS - local - SDK location not found.
After building for Android (I don't have a Mac so I can't speak for development on iOS), it generates an apk which you need to install on your device. I'm sure there's a way to install this on an emulator too.
Once you've opened that app, it will direct you to start a development server using expo start --dev-client. This will run a dev server similar to the usual Expo Go. It pulls up a QR code which you can scan and it will take you into your app. Hot reload works as expected too. Doing this my test banner ad showed up without any errors.
The same solution is discussed here.

How to rebuild project after changing a node module for React Native

I am modifying a specific node module (react-native-keychain) for android, but I am not sure if changes are affecting yet. What is the procedure to rebuild the project? - Will these just work or am I doing something wrong? (I am using a real device)
npm install
npm start
react-native run-android
Thanks
For reference, this is what I want to achieve:
https://github.com/oblador/react-native-keychain/issues/337#issuecomment-728191068
Also, it is: "react-native": "0.63.2", so linking is not required
A rebuild will usually consist of re-install packages, re-link as necessary, then fire off the build/run script.
However, there are a lot of factors that influence the correct approach.
For example, is your development OS Mac, Windows or Linux? Is your project Expo managed, or is it full React Native.
I would suggest you take the awesomely comprehensive React Native docs as a starting point:
https://reactnative.dev/docs/running-on-device
If that doesn't do it, look in the side panel of that site for additional information -- you might want to start with the section entitled 'The Basics' and take it from there.

Where is React Native Expo android folder?

I am using React native expo and I will install a plugin via github. However, in the documentation, changes are required in the /android/build.gradle folder. But my application does not have such a folder either. Can you help me ?
Github link: https://github.com/zo0r/react-native-push-notification
Expo Takes Care of .android & .ios folders. so it doesn't give you those files; but if you're sure you don't want expo, use:
expo eject
then, you have to install all expo dependencies which you installed using Expo.
but, if You're just asking for notifications, you may use:
expo install expo-notifications and use that you send both server and local notifications.
you may find more info here.

React Native Android to iOS migration

I have an Android app built from scratch using React Native. Can I migrate the same app to iOS? If so, how tough will it be?
The Android app is already built and working fine.
If the app is done in React Native, you could build it using Xcode, of course you need a Mac, https://facebook.github.io/react-native/docs/getting-started#xcode.
You can also try from command line
react-native run-ios
Remember that you still need to install Xcode and the tools needed to build on the simulator or your device.
Also remember that you might have to do some changes in your code, not always the code for android works in iOS, moreover if you are using native modules done by you or from a library.
A project written in react-native should, by default, work on iOS.
Normally tho, every package you have used, some styles still differs from each other from platform, some things are avaiable to do on Android and not on iOS, some things are avaiable on iOS and not on Android.
Some packages needs linking. Some needs additional steps to run on iOS changing some datas/informations using xcode. (like deep linking).
On react-native 0.60 you need to install the pods manually as it's not done by the autolinking, there are a lot things to check and it may not be automatic for the majority of the cases

create-react-native-app doesn't create android/ subdirectory

I noticed that create-react-native-app isn't creating an android/ subdirectory in my project. Is this normal behavior? I'm using Node 8.1.0, NPM 4.6.1. Here's my directory structure:
I need to edit the AndroidManifest.xml file, which is supposed to live in the android/ subdirectory, but apparently it doesn't even exist. Why is this happening? Thanks.
This is a normal behavior.
When you need directories ios/ and android/,
yarn run eject
When you create a react-native app, its comes with Expo.
Expo is a free and open source toolchain built around React Native to help you build native iOS and Android apps using JavaScript and Reac,it lets you build with their app on both ios and android.
When you eject, you create your own files, but lose the power to build on IOS without a mac.
react-native eject should do the work if you want.
react-native init ProjectName
This should create your project with ios and android folders and without depended on Expo.
Also about your question:
The init command for react-native installs all the necessary components it needs and starts up the environment to start developing in react-native. It’s required to start working in React Native, just like git init to initialize a git repo, or npm init to create a local package.
create-react-native-app is something else entirely, it’s based of the original create-react-app started by Dan Abramov (the creator of Redux). In short it’s an encapsulated and curated bundle of developer tools designed for bootstrapping projects and helping beginners learn the react-native without having to deal with all the tedious configuration usually associated with creating a React project (setting up Webpack/babel, configuring hot reloading, testing, linting, etc.).
The init command is vital to react-native, so get used to using it. If you are new to react-native I would highly suggest though you look into create-react-native-app, it’s an excellent steeping stone for learning the heart of react-native before having to deal with configuration. This comming from a guy who learned react-native the long way, I wish it would have existed when I was learning.
Source: https://forum.freecodecamp.org/t/difference-between-create-react-native-app-and-react-native-init-app/103609/2

Categories

Resources