Multiple Schemes and Configurations in a React Native iOS App | React Native | BETA,DEV,STAGING
ฝัง
- เผยแพร่เมื่อ 3 ก.ค. 2024
- ANDROID CONFIGUARATION:
• Configure multiple fla...
In this video, we’ll be discussing Build Types. We’ll see how they make our React-native Development easier and faster especially when we’re creating applications with minimal differences. These differences can be as small as changes in themes and app icons or can be for different stages of the product such as Dev, QA, Production etc.
We will understand multi configuration as we want to install three different application simultaneously on the device. for example, We want to bundle three different app shares same source code and having display name Dev, QA and Production
Apparently React-Native has problems handling Xcode build configurations and schemes this due the way the packenger works when it creates the Xcode project references from the node modules directory. And this can be a problem is you need to handle multiple environments in your app
1.Create React Native Application
2.Add Development, Staging, Production Target
3.Add Development, Staging, Production Schema
4.Link each Schema with each Target
5.Add Build, Set Pre-Actions and Select Run Target Executable
6.Place Development, Staging and Production GoogleService-Info.plist file
7.Link each GoogleService-Info.plist file with each Target
8.Update .podfile to share dependency with Development, Staging and 9.Production Target
10.SetUp various environment in Android
11.SetUp Product Flavor
12.Place Development, Staging and Production google-services.json file in
#jasacadamy #reactnativecourse #reactnativetutorial #react #reactnative
#reactnativecourse #reactjs #build
build successful product,product development process,product development,startup idea generation,product development lifecycle,idea validation,difference,product development stages,production environment,development environment,idea generation,product,ideation,software testing course,software idea generation,software testing training,software testing,software development lifecycle,application development lifecycle,software testing tutorial,validate idea,product flavors android example,product flavors android,build variants vs product flavors,tutorial,emulator,android (operating system),bhavna thacker,project,build variants tab android studio,build variants android studio test,tools,build variants android studio,android,build variants android example,open build variants android studio,build variant android,cream,build variants android,install,sandwich,creating,create build variants android,how,ice,and,open build variants android studio,build variants android studio,android (operating system),build variants tab android studio,build variants android studio test,programming,create build variants android,build variants android,variations,flavors,creating,tutorial,sandwich,android,project,emulator,kotlin,mindorks,buildtypes,androiddev,and,tools,install,ice,cream,gradle,learn react native,react native,react native app,learn react,reactnative,react native 2020,react-native,react native course,react native project,react native tutorial,react native crash course,react native app tutorial,react native for beginners,react native tutorial for beginners,programming with mosh,mobile app development,androiddev,app development,react,multi environment,mindorks,tutorial,javascript,environment,development,code with mosh,android,production,react native,projects,firebase,mobile app,software engineer,react,full-stack,programming,coding,how to,expo cli,to do list,expo,computer science,react native tutorial,react native app,react native expo,react native,react native from scratch,react native crash course,react native app tutorial,react native modern ui,react native nft marketplace,build a react native app,react native tutorial,react native app,react native expo,react native,react native from scratch,react native crash course,react native app tutorial,react native modern ui,react native nft marketplace,build a react native app,react native app development,react native tutorial for beginners,react js,react js project,javascript mastery,js mastery,javascript tutorial,master javascript
00:00 Introduction
03:22 Different Target creation for Dev, Staging, Prod
07:08 Different Schema creation for Dev, Staging, Prod
11:44 Pod installation for Dev, Staging, Prod
13:43 Env file creation for Dev, Staging, Prod
18:38 Pre action script for Dev, Staging, Prod
23:45 Different App name for Dev, Staging, Prod
26:33 Different App Icons for Dev, Staging, Prod
33:24 Different Google-Service.info.plist for Dev, Staging, Prod
this is very straightforward. thank you
thanks for feedback 👍
Nice one Jas, very informative!!
thanks for feedback 👍
After wasting my weekend on a failed attempt set up iOS schemes, this worked for me. I am glad this worked out. Thank you very much!
thanks for feedback 👍
Thanks, bro 😊
Perfect tutorial. Thank you so much.
You're very welcome!
Great tutorial! wasted my time on other videos. But this one rocks 🚀🚀🚀 Thanks a lot and keep making like this videos!
Glad you liked it!
Perfect life saver:))))
Great Tutorial!!
Thanks a lot!!!
You're welcome!
Awesome one. Thanku so much.
Most welcome 😊
what will be the command for Debug and Release Build for iOS ?
Very informative, Thanks for guiding us JAS :)!!
One question JAS is why we need to create different targets, without this also we can create a different schema with multiple builds like prod, stage etc.
Thanks!
creating different build target in react native allows you to customise the build process
great 👏
Thank you
Great tutorial Jas! I've a doubt, when I start the active scheme, the screen shows the value of my env file perfectly, but when I changed the scheme for another and started it, the screen shows the value of the env file of the last scheme. I don't understand why! can you help me? thanks in advance!
just clean up before build
how to automatically map custom fonts to dev and stage enviroment. i add fonts to asset folder after run react-native-asset, fonst add to auto add to Info.plist but not auto add dev and stage. tks
Solution: in xcode select target name dev or stage -> in tab buildPhase search copy bundle resources and manual add list font in Resources folder.
Very nice, thank you! I have one question. Is it possible to upload both scheme, prod and dev to Testflight? I want testers install and try fist Dev scheme and then Prod scheme. Thank you
Yes
@19:58 didnt work for me anyone faced the same issue..taking from .env except from prod
Clean the build once
great tutorial Jas! i've a doubt , if we have three identifiers for cd do we need to create multiple apps in the apple dev account? Thanks in advance
yes.you can
@@JASACADAMY when i run it from terminal it picks up from previous build config what extra steps we need to do to run it from terminal i tried npm run ios --scheme , Thanks in advance
you saved my day
Thanks for feedback 👍
I tried this and it worked, but I can't make changes in real time (watchman doesn't work).
This is normal?
clean product before changing schema
How add different LaunchScreen for different scemes
you can chnage it from general tab on settings
What about config Info.plist and Build Settings to use .env variables bro?
Its also a good approach
If I need both debugging and release, do I create 3 more scheme only or both targets too?
Yes
What would the script look like to run this from your terminal?
add schema on run iod
react-native run-ios --schema=your schema name
Can you do the same for Android as well?
th-cam.com/video/rhdOWYqc-Cg/w-d-xo.html
@@JASACADAMY it's same iOS