is expo the windows version of CocoaPods? - react-native

Okay so what brings this up is the different installation procedures you have to do when installing dependencies in react native. Where I am confused most is making sure the installation is successful and all the file modification/linking went well.
I constantly see some dependencies telling me to do things in xcode while others require something of expo or a npx install. I guess this is a little late to be asking considering I have already installed so many things into my project but if I am using expo on a windows machine, can I ignore anything that I see using npx? I understand modifications requirede in expo need to be done but for an example like this
Is the npm install command enough? To run on IOS that is.

I‘m not sure I understood the question but I think what you are asking is if expo install replaces all npx install commands.
In that case, yes and no. Expo manages a lot in the installation process of dependencies, even some that require some native code. But just not all of them. Not all native modules can be installed by Expo (Even though there‘s a ton of them already)
But if you somehow need to install a native module, that is not yet covered by Expo, you can look into EAS, which allows native installations in an expo project.
Here‘s a link to their documentation: https://docs.expo.dev/build/introduction/

Related

Can I use expo packages or libraries in bare work flow, I used some permissions and

Can I use expo packages or libraries in bare work flow, I used some permissions and apploading these type of blah blah packages in my expo project and ejected to bare work flow, after running react-native run-android getting error expo require expo sdk to run
what SDK version were you on when you ejected? if you are not using the latest sdk version (37 at the time of writing), i would recommend reverting the eject and running expo upgrade then ejecting again. the process is a lot smoother in 37 and will continue to get better over time.
you can absolutely use nearly every library in bare react native apps! but you can't use everything that's available from the expo package itself, we're almost done removing everything from there but they may be some leftovers. check your project to see what you're importing from "expo" and replace those with alternatives. imports from "expo-*" will work great.

Application is freeze when "this.props.navigation.navigate"

I am using expo 34 and I am tried with 32,33 and 31.
It works when I run it with Expo client on Ios Simulator but
In the "this.props.navigation.navigate" commands, the program freezes and the cpu rises.
I'm not getting a mistake either.
I have the same problem with Android tests.
Expo client version 2.12.1
I tried it separately on Windows and Apple operating systems to solve this problem, but the problem still persisted.
Not: In the meantime, the application I am talking about is now online.
I mean, he was definitely working before, but I can't even test him now.
You need to install that in your project.
npm install react-navigation --save
Also you need to pass in the view name. For example:
this.props.navigation.navigate('ViewName');

I need help uploading something to expo

I want to create my own podcast app.
I found this pre-written code online (github.com/diego3g/rocketcasts) and want to tweak it in order to create my own app.
How do I upload this code into expo?
Unfortunately that React-Native app was not built using Expo. You can tell because it has ios and android folders in its root directory.
Digging deeper you can see that it uses react-native-config as a dependency. This dependency requires access to native code, which Expo does not allow. You would have to go through and remove any dependency that requires native code if you wish to use Expo. This may remove functionality and could take some time to resolve issues.
Also this application was built using react-native: 0.47.2. Currently the most recent version of react-native is 0.57.8 with 0.58.0 just around the corner. That is quite a jump to make if you plan on upgrading the react-native version. Upgrading RN is not as simple as just changing a version code.
Similarly the repos last commit was over a year ago. That means that the majority of dependencies will be out of date and will need upgraded. Again, some dependencies aren’t a simple upgrade you would need to check every single one to make sure that it doesn’t cause unforeseen problems. You would also need to check their compatibility with Expo.
Personally I wouldn’t copy the project. I would look at how they have implemented the functionality and then in a new react-native project I would re-implement the functionality. That way all dependencies would be up to date and you would know that it would work.
Going down the path of editing an existing project like this one may be quite a challenge.
Either way good luck.
You can find more information about Expo here https://docs.expo.io/
And you can find a good explanation of the differences between Expo and react-native init here What is the difference between Expo and React Native?
The standard way to tweak an existing GitHub repository you don't own is to:
fork the repo (that is a GitHub operation, creating a copy of the repo in your account)
clone it and modify it: you can then push back to your GitHub fork.

Upgrading react native to latest version

I have an application which runs on react-native 0.49.3
I want to upgrade to the latest version which is v0.57.4.
Should I incrementally update it? For example 0.49 -> 0.50 -> 0.51 etc
Or I can just update it to to the latest version?
Do you suggest using react-native-git-upgrade or rn-diff?
My advice is to upgrade to the latest version. There will be enough dependency issues anyway so you're best dealing with them only once.
From the React Native upgrade page
(https://facebook.github.io/react-native/docs/upgrading)
you can run:
npm install -g react-native-git-upgrade
npm install -g #react-native-community/cli
react-native-git-upgrade
UPDATE 2:
The new command is
npx react-native upgrade
but I believe this is best for upgrading from more recent versions. If you have older versions, the following upgrade process still applies.
UPDATE:
I've never had a problem before with upgrades, but recently joined a project where we upgraded from an old copy of React Native 0.44.3 to a newer version (first to 0.57.8, then to 0.55.4, then to 0.58.3 while struggling with stability) and discovered that it's not always as easy as running those commands. Be warned that this could be a long, tedious process, especially if you have not upgraded regularly and have a long gap between upgrades. In this case, it was 18 months since they had upgraded.
First, there have been changes to the upgrade process itself (react-native upgrade, to now react-native-git-upgrade) itself. So, if you're using a version that's a year old or more there could be some manual discrepancies that you'll have to go through. Some are spelled out after running the react-native-git-upgrade command, and some are not. I was amazed at the number of people on Stack Overflow going through the same undocumented circular issues of a seemingly innocent upgrade. I was not expecting that. I'd be OK with Facebook not adding any features for 6 months and simplifying the upgrade process before moving on.
Second, make sure your version of React Native uses the right dependencies. Later versions of the upgrade tool (react-native-git-upgrade) try to account for this, but double check at https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md to see if the version of RN that you're upgrading to requires a specific dependency. Some do while others do not.
Next, library hades is real, depending on how big your project is. In our case, several modules in use in our 0.44.3 version have now been deprecated or no longer maintained or even work differently with the later versions of RN. I didn't consider this enough when starting this process. This caused several instances of code rewrite just to upgrade!! Yikes!
Also, just as some versions of React Native require specific versions of dependencies, other modules require specific versions of some dependencies. Worse, sometimes these are incompatible and conflicting versions, of various libraries. Save some time and write a user story or two to account for this. Go through every module you're using and see if there are any compatibility statements on their GitHub page. Some Readme files will tell you to use certain versions of their module with certain versions of React Native. Others won't and you may find out later there are requirements. But even going through this process and anticipating issues, you'll thank yourself later.
Once you're up to date and stable, consider upgrading regularly to minimize the upgrade nightmare that I just went through.
You will need #react-native-community/cli to upgrade to the latest version of react-native, sadly not mentioned anywhere.
npm install -g #react-native-community/cli
Install react-native-git-upgrade
npm install -g react-native-git-upgrade
Now go to your project.
cd your-react-native-project
Now you can run the upgrade command.
react-native upgrade
Just change the path to the project for which you want to upgrade the react native version and then run this command:
react-native upgrade
and after running this command you will see some questions. Type n to discard the change to that file or type y if you want to modify that file.
It will automatically install the latest version of react-native for your project.
More info at:
https://facebook.github.io/react-native/docs/upgrading
OR
You can upgrade react native version by this simple step:
1- Just go to package.json file of your project
2- After that, look for these lines
"dependencies": {
"react-native": "0.57.8",
}
3- Change the react-native version to any version that you want to upgrade to in "dependencies".
4- After this run npm install and react native version will be upgraded for your project.
I would recommend using this tool (upgrade helper) which allows you to compare your current react native version and latest react native version.
Also, It's good to upgrade react-native frequently to stay up to date with the latest version and make the upgrade process easy.
https://react-native-community.github.io/upgrade-helper/
I recommend visiting this page: https://github.com/react-native-community/rn-diff-purge
because you can see the list of exactly what changes in each version. I find it's simpler to manually change config settings after starting from your version that is proven to work properly via react-native run-android and react-native run-ios.
It sounds like a horrible task, but it's not very difficult for your fingers or brain to remove red lines and add green lines--at least compared to alternatives such as Googling to sort out horrific error messages in the Android/iOS build systems.
I also believe that it's a good idea to manually change config settings for example going from 0.44 to 0.59 because you get more of an opportunity to see exactly what is changing in each version. You'll see the changes are reasonable and generally have bearing on fostering future automation and increasing the build systems' robustness and aversion to breakage.
Additionally, changes were implemented in RN 0.59 that makes react-native upgrade better, and in addition to my additional statement, the whole 0.59 release is pretty massive and important for future: http://facebook.github.io/react-native/blog/#upgrading-to-059
I'm not even going to talk about react-native upgrade or react-native-git-upgrade because I find those to be generally a source of nightmares especially if you get into react-native unlink and react-native link.
You can update to the latest version directly, I'd recommend to do it with react-native-git-upgrade, but do be careful to read the update release notes on the versions up to yours, they have some notes about things you should do manually that the upgrade will not. You can find the notes here: https://github.com/facebook/react-native/releases
The notes are usually on top in the changelogs, I know the latest releases had some of those and gave me some work to update from 0.54 recently so be aware.
In case there are changes then you can either update them manually by copying and pasting from the changes in the page or you can do it with the React Native CLI upgrade command by running:
npx react-native upgrade
As explained in the docs: https://reactnative.dev/docs/upgrading
react-native upgrade
npm i react-native#{{VERSION}}
npm i react#{{VERSION}}
https://facebook.github.io/react-native/docs/upgrading
https://react-native-community.github.io/upgrade-helper/?from=0.59.9&to=0.61.0
Even with using the new upgrade helper https://react-native-community.github.io/upgrade-helper/ I still run into a bunch of issues and it takes forever to debug them. The best and most reliable way I have found to upgrade after react-native core teams make big changes like adding fast-refresh or flipper that involves a lot of xcode related changes it just start from scratch.
create new repo
npx react-native init newProject
STEP 1 -
make sure the new app runs properly so you know if you have an xcode/react native package issues that need to be upgraded. I know I ran into an xcode issue that forced me to upgrade to a new mac os version.
STEP 2 - pull up old projects xcworkspace or xcodeproj if you are not using any custom pods and just copy over the important stuff like the signing stuff and potentially any custom build scripts you have. I have custom fonts so I pull that over
STEP 3 - copy over app specific code, think app folder or src and any files that live in the root of your project.
STEP 4 - Run npm install and pod install if you have custom pods
STEP 5 - Important not to just paste over the App.js/tsx file but instead just render a simple view with text in it. If your app will run here then it means all your npm/pods are configured properly. Usually I run into a bunch of error in this step which require me to upgrade npm/pods to new version to deal with breaking changes in react-native
STEP 5.a - One by one add in each line from your original App.js/tsx file and testing if anything breaks. Sometimes its useful to reset your metro cache in between changes and removing the build folders inside of ios and android during debugging. Also its very helpful to use the chrome debugger stop on exception functionality here so you know where the issues are coming from
STEP 6 - copy over .git folder from previous project that lives in the root of your project so you can keep your version history or just create a new git repo if you dont care about this.
I have upgraded RN to newer versions in a couple of hours using this method multiple times. I typically write myself some notes while I do it to speed to up the process next time I need to upgrade. Good Luck!
npx react-native upgrade
Should do all the work for you.
use cammand npx react-native upgrade
if you are facing errors it's due to some deprecated packages.So comment all pages and in route and step by step add your pages and replace your deprecated packages with new .
And also use this update helper 'https://react-native-community.github.io/upgrade-helper/'
You can Upgrade with 4 simple step
npm install -g #react-native-community/CLI
npm install -g react-native-git-upgrade
cd your-react-native-project
react-native upgrade
Thanks :)

cannot create iOS folder on my react native app

I am asking this question for the third time and I don't get it why no one even tries to help on this, is this question not well explained? If you can ask for more information I can give!
I am having trouble created iOS folder inside my react native app(detached) as when I created the app I created it from windows machine and iOS folder didn't come when I wrote: exp detach
Now that I have got a macOS, how can I get to create iOS folder so I can use that to build from xCode. I tried react-native upgrade, this is telling me that I have some version conflicts, so I don't want to upgrade it actually, I just want to have iOS folder on my react native.
What would be the best solution in here?
Interestingly I tried exp detach over my detached app and it created iOS, it's working! hopefully this will help anyone!
Please follow the below steps:
Step I: Ensure below installable are installed
Java Sdk Android Studio
Xcode (in case of OSX)
HomeBrew (in case of OSX to install node)
Node/NPM (Node runs Javascript outside the browser. NPM is used for installing and managing Dependencies. Node and NPM come
together)
Those are some essential installs that you will need in your Project
**Step II: **
For windows/OSX you need to run the following commands in your command prompt/command line:
This is the important part for running a react native project:
**Step II: **
npm install -g react-native-cli
Then you can use this cli to start a new project like this:
**Step III: **
react-native init
Hope this helped you, please vote..