Mastering EAS Build, Submit, and Update in React Native | DEVember Day 13

what's up noj developers welcome back to demember and today is day 13 of our monthlong marathon of react native tutorials and today we're going to learn about EAS Expo application uh Services uh and we're going to learn that for building our application in the cloud and also using yes for submitting our application to the stories and also sending over the air updates so what you're going to learn you're going to you're going to get started with es we're going to configure our project and we're going to learn more about how it works we're going to build our first uh application in the cloud using yes build then we're going to submit the application to the stores with yes submit and lastly we're going to send updates over the air using yes update before we get started uh let me quickly update you about the December our monthlong marathon of R native tutorials every day we are we are going live with a new um R native tutorial we already have 12 tutorials done and we are over half uh of our project uh so yeah you can check all the previous videos on our Channel they are uh available to everyone and yeah make sure to subscribe to the channel not to miss uh any future tutorials that we're going to do if you have ideas make sure to submit them to our idea board you'll find the link in the description below and the yes was something that was requested uh by a lot of you on the idea board anyway demember is not just about uh learning it's also about giving back as well during November we are organizing the a found raiser called education for children and during this one we are supporting the efforts of a save children organization in providing accessible education to Children worldwide if you want to donate and help this cause uh the Donate popup will be somewhere here it goes directly uh to the save children organization and handled by YouTube um we also have some incentives for as a thank you note for your donations and I want to say a big thank you to roel Sagar Val Travis and others who donated finally we also will donate $100 for every new 1,000 subscribers that we're going to get during December so simply subscribing to the channel will also contribute to the cause all right so we can get started hello everyone in the live chat how are you doing guys are you ready for this one so let's uh first of all have a look at the application so here I have a code and with source code of application you will find in a link to that in the description below it's our repository called demember and here you'll find two branches for every single day so that you can start working from the same Source s from from the same starting point as I do simply go ahead and clone the repository after that uh after you clone it check out to the branch day1 start and go ahead and do npm install the next step is going to be to build uh a development client on our system for that we're going to run npx Expo run iOS and this will build and run the application on an simulator you can do the same for run Android but for that because we are already using a development client we're no longer using Expo go um that means that we in order to build this application the native side locally we need to have X code set up if we target IOS and Android studio and all the Java environment if we're targeting Android for some developers you might have that already set up some of some developers might not have all the environment set up for Android studio and xcode and also there are situations where you're working on a Windows but you want to build test the application on a iOS device with a Windows Windows machine you cannot build for iOS and what do you do in that situation in that situation you can use y the tool that we're going to learn today to build the application in the cloud so we simply connect our application to EAS and we submit and build and uh Expo will um build the native side applications both for Android and iOS in the cloud for us so that opens up a lot of more possibilities and allows anyone to get started and build applications for any platform um it's the purpose of Expo application service is one to uh allow anyone to build applications no matter your environment maybe even you don't have the most powerful machines and also it allows us to uh create cicd pipelines that would automatically build subm and deliver of updates to the user uh for example you can set up an automatic size uh pipeline uh on with GitHub actions that will check the changes and will submit a new build when you for example um merge code to your master Branch um we have implemented this automatic cicd pipeline in our academic course um and for that we also use GitHub actions and also Expo so we have a production uh module that is focusing on this Expo application service and goes much more in depth but let's go ahead and uh get started configure it and we can talk more about how everything works as we will wait for builds to complete uh there will be a lot of waiting time during this video because it takes time to build native applications uh so um before I get started I just want to tell you that EAS is made up of three main services at the moment the build submit and update the build in a simple terms allows you to build application in the cloud submit service allows you to once you have a build um an APK or for for a file for iOS then you can use as submit to deliver that binary to the stores uh and that can automate a lot of stuff uh and yes update is something um very very cool because it allows us to send updates over the air um and these updates can be it allows us to make some changes on our JavaScript side and using GS update automatically send these updates to uh over the air to all the users that are using our application this allows us to do hot fixes bug fixes or even small updates uh without us having to go ahead and create a new build submit it for review on Apple and Play Store and wait a couple of days until the the new binary can can can be downloaded on the user device so with as update we can send that in in seconds and the next time the user will open the application it will download the new bundle the new JavaScript bundle the only thing that we cannot do with y updates it send changes that contain native side changes because es update only works on the JavaScript side the JavaScript bundle so if we install uh some Li native libraries or if we do some changes to our native configuration files uh maybe some permissions uh and so on in that situation we need to go through the build and submit route instead of update but for small bug fixes yes update is very helpful so before I go into the EAS update I actually want to go ahead and uh set up the yes update in because after we set it up we when we will set it up we will have to install a library so when doing the first build I want that library to already be there so that we can update right away without us having to do two builds with update and without update so let's go ahead and follow the es update introduction and getting started you can read more about the yes update here but I'm going to go ahead and follow the getting started what we need to do is install globally the EAS CLI tool so let's go ahead open a terminal and let's install the esli tool Vladimir hello kyash hello how are you doing guys alhuda bright great AR so Romanian Stuart reelio how are you doing guys you'll also need an expo account so make sure to create an account on Expo dodev I already have one because after we install yes we can check its version uh in my case that's 5.9 at the moment and we will also have to do esas login to log to our account go ahead and add your email and password from your export. D account and after that uh we can check EAS who am I it tells me who am I and the accounts that I manage perfect after we are logged in uh the third step here is creating a project but we already have a project the fourth step is configuring the project here we need a couple of uh dependencies to install the first one is the Expo updates package it needs to be installed in our application for because it brings this logic of checking and downloading update from uh a remote server it's quite easy to get started with it we just have to to install the library and here the next step is going to be to run yes update configure to configure this this changes at this moment if I do get status not not a lot of things are changed but now let's go ahead and do y yes update do configure a project not configure would you like to automatically create an es project for demember yes let's create one uh and we have some problems already linking local project to yes error parsing do I have some issues here expecting double Co property name in Json and position I don't know what camera permission text product name needs access to your camera to take let's see what's wrong with our upot Json somewhere around plugins and probably it's about the comment if I remove a comment let's try again yes uh okay linked local project uh the following process will configure configuring updates. URL so yeah what is doing it it configure a URL from where to check updates it automatically linked to our project that was created in our yes account and then it configure the runtime version on Android an iOS now all bills of our application going forward will be eligible to receive updates published with es updates that's why uh I wanted to start with this one because the next build will already have uh this possibility to use es update uh but we have es build that is not configured yet and we're going to do that right now um yeah I'm going to leave the es updates for a moment now we just installed and configured it uh we are going to go now back to Y build to create a build and then we're going to see how to send updates with Y updates but that's going to come later so back to yes build this is what helps us build our project in the cloud it can build both Expo and react native projects out of a box and it also handles like the application signing you don't have to worry about a lot of keys uh it handles everything for us and it also integrated with a submit to allow us to to later submit it anyway let's get uh go to the first page create your first build and what we will need here okay yes build is a new okay okay okay a r native or an Android iOS project or and an expo user account we already have that by the way yes is not free maybe we can cover the pricing a bit later I'm going to open it up but yeah the yes Services is not free however it's not like everything that's possible with yes you can do that locally it's just automates a lot of stuff for us we already have installed asli we can move on to the next one we need to log in we already have done that and the next step is to uh configure the build uh part of our application so let's run y build configure similarly to how we did as update configure here it will ask which platform would like to configure our build we're going to do for both IOS and Android and we see that it generated yes Json and also configure the as Json and our project is ready to build if we have a look at these files that we added right now we will see the as Json which has the build information uh and inside build what we see here is three different profiles three different set of configurations that simply contains different properties so by targeting the development we can simply we can simply say that we want to build a development profile and that will contain the development client through and the internal distribution if we say that we want a production build it's going to use this set of settings so it's a simple named configuration uh profile for our builds um so the easiest way to run uh esas build is to create a build that you can run on your Android device or emulator simulator and so on it's quicker than uploading it to the store but I still want to show you how to upload to the store so I think that we're going to right away do a production build um or no let's start with triggering a build that we will use to run on Android device emulator or iOS simulator uh because we if we do a build like this in this situation we don't need any uh membership any developer accounts for iOS it's easier and anyone will be able to do it later we will do a production build and for that we will need a developer account creating an installable APK for Android let's open this documentation up configuring a profile to build apks to generate apks modify as by adding one of the following properties development client through if we look at our development build it has this development client through which means that it will generate an APK it also has in distribution so we don't need any extra settings and creating a simulator build for iOS to install a build for your app on iOS simulator modify the build profile and set iOS simulator value to true so in the preview not in the preview do I want it in the preview preview or in development let's do the one from let's do V development build uh let's configure it to run on simulator because for one iOS we can build either for devices or for simulators and if we set iOS simulator through we're going to be able to install that application on our simulator okay now execute the command we need to run a build for I profile preview let's go ahead and trigger a build to trigger a build we're going to use EAS build command and here we will specify what platforms do we want to build it for maybe we're going to start with iOS and we can also specify the profile of our build basically what settings from this build object do we want to take so I'm I would suggest to start with development to have a build that we will be able to install in a simulator so let's select profile development let's press enter uh development no environment variable specified oh yeah this one has developed client through and this development client is basically uh a library that adds uh a lot of features from Expo go to our development build so it adds a menu we where we can see different stuff and because we have it here to true but we didn't install that Expo development client it asks us to install it so let's go ahead and actually install it um at the moment like come on uh at the moment we are running a development build it's demember called but it doesn't contain that development client so we are missing a lot of menus that we see here in Expo go you're going to see the difference in a moment when we will uh build this internal um this internal application using a development client it will also be a separate application but it will have some menus um similar to how expoo has for managing like different versions and so on all right so we see that our build process has already started and it also has a URL that we can open up and uh in fact after we see this message we can actually press contrl C in our terminal to exit the terminal because the build process takes quite quite a bit of time um so we're going to wait it we can wait it and look at the updates directly on expo. dashboard so what do we see here we see that in our Expo a new project was created called demember under the builds we see that a new build was generated for it it contains the version it contains the channel it's targeting development Channel and yeah it was created by me and we're going to wait for the application to to install after which we will be able to download them the build we can do the same for Android or maybe we can wait firstly for our iOS to to execute run export doctor what's happening yeah Expo doctor is worried about some uh potential issue so here yeah we can see all the steps of our build process and when something fails we're going to be able to go there and see the CLI output and see the messages that trigger that issue it pre-built the application it installed the pods configure Expo updates that's something good to to see because we already set up Expo dates and it configured it in the expo. list file and now it's running fast lane to actually build the application let's see usually it takes around 10 minutes for for this to build but we're hopefully we're going to be more lucky wait wait so while we're waiting uh let me know if you have any questions related y build Vladimir vtic is saying almost missed most important lesson will you cover local build setup to avoid Cloud build question how locally we can get APK and ABB file in Expo we have covered local builds but these are not called local yes build these are called local building locally your application and you can do that and we have done that previously when we have run npx Expo run double do iOS what this is doing is this is building locally application um yeah I was also confused that thinking that we can only use to build the project because in documentation we mostly see reference to if you have to create a build use uh and I understand why they are saying this because uh with e anyone no matter what your system is will be able to create a build but if you have like all the system if you have X code Android Studio set up you can do the build locally as well I use the yes to get a Ab now is there any other way to get that locally to be honest not sure but definitely you would be able to do that by adding some Flags here so we can have a look at the documentation of npx Expo run iOS to see see build and run the native apps locally using okay okay this one can only be around on mest yes where was I yeah here building locally is useful for development developing native module and debugging complex native issue building remotely with as build is much more resilient option due to the preconfigured cloud environment yeah that's also true because you know that as build is always up to date your system might be you might have some outdated Java that you have to debug or some other plugins or environment and yeah that's why as build is more robust if okay okay cross platform okay no build cach no install no bundler device Port Android apps can have multiple different variants which are defined in the project build.gradle variants can be selected with a variant flag you can do you can nbx exp for run Android with a variant debug and maybe that will generate that ABB file you can also do a variant release yeah so try uh the I'm answering the question from Vladimir if you want to generate the ABB file try to run it with this command npx exp for run Android variant debug okay back to our build page what do you think do we have it's actually finished it's actually finished and we see a download button what we have created is we have submitted uh let me update we have submitted a new es build targeting the development profile uh targeting a profile simply means that yeah use this settings and the settings contains that development client it ALS also contains a distribution for internal it doesn't do any UPS signing uh for for production it's using a named Channel development and this will be important for us to send uh overv year updates specifically to this build and then some iOS simulator through which means that the build that we created will be able to run on iOS simulator Let's test that by downloading this file uh uh and by where is it one second yeah I have a new file downloaded and I will simply drag and drop it on top of my iOS device like this it updates one application that I already have and let's see when I open it what's happening as you can see this is the menu that is coming from the uh package Dev client export Dev client and it allows us to connect to different servers it allows us to manage like the login the settings and the version runtime and so on so what I can do is I can go ahead and after having after having a development build created in the cloud The Next Step would be to start a metra server from where this build to connect to similar to how we were doing npm Expo start if we look in the package.json Expo automatically updated this start script for to have like the D- Dev client so it automatic if we were going to run this start Crypt it will automatically start the Expo server for Dev client so now we can do npm start it will execute this Expo start Dev client and from here from our development client we can load from this server the JavaScript bundle so yeah this is how everything is separated something is coming from the build all the native side code and the JavaScript bundle comes from the Metra server here so we can continue working like this perfect so now we have saw how to create how to do a development build in the cloud the next step is probably going to be to send hm but this is a development build okay the next step is going to be to create a build that will be ready to be submitted to uh to the stores a production build in the Json we're going to try this profile production that is targeting the production environment it will be signed and we also need some some additional things so let's go ahead and back to our documentation and continue with building for app stores before the build process can start from App Stores you will need to have store development account and generate or provide up signing credentials so that means that uh we would need a Google Play Store account to submit to Play Store and an apple development Apple developer account which costs the Apple developer account costs I think $99 a year and the Google developer account costs 25 and it's a onetime fee if I'm not mistaken but you need V accounts V paid accounts in order to submit applications to the stores so yeah I'm not going to cover creating them I expect that you already have them and let's continue yeah that's a good part of esli because it handles a lot of up signings for us yeah it handles application signing process and credentials for us yeah we need a Google developer membership is required to distribute to Google Play Store and we can see it's a one time 25 as I said and also the Apple developer which is $99 per year so yeah after you have confirmed that you have the account any of them uh you can proceed following the next steps command to build for theb platform store okay let's go ahead and start by submitting a build for iOS I'm going to do that using yes build-- platform iOS and if I don't specify the profile it will automatically take the production profile so loaded environment for the production profile uh created a channel and that channel is used for sending overway updates we're going to talk about that a bit later they also went ahead and made a branch with the same name and have pointed the channel to it okay using remote iOS credential do you want to log into to your Apple developer account yes let's go I'm already logged in for you it will ask you for the password you're going to log in and then let Expo manage all the signing um all the yeah all signing for our application in my case it asks me to reuse one in your case it might ask you to create and manage one so just simply allow es to manage that uh generate a new provision of profile yes usually I'm just yes yes yes yes for everything and would you like to set up push notifications for this project let's set no for a moment maybe later we will need it and after all of this we see a new build in our account I can do contrl c here to stop um to stop this and I can go to to our export development account in the builds we're going to see a new build but this one is already targeting the production Channel and the profile is also production in the previous step we will also see like what profiles and what channels are they targeting then we're going to have to do the same for Android so let's follow the same process for Android and the command is going to be es build platform Android uh generate a new Android key store yes again in your case if it's the first time it might ask it might ask you uh some other questions uh in order to to to allow Expo to manage like the key stores and so on on there and it makes the job like much easier and with Android everything is set up the build is submitted I can do contrl c to stop this terminal for for waiting for the build to be finished and we see here that a new build has been added to our queue uh it will wait in the que because I don't have a pro account and I only can do one build at a time so first it will finish with iOS build and then V one let's see a development build took how much time 6 minutes that's actually very good 6 minutes not too shabby let's see the the production build how much time it will take oh it's already ADV installing pods perfect let's go back to our documentation what do we see uh for Android and iOS we have done that you can attach a message to the build by passing Das Dash message uh for example message and like some some updates the message will appear on the website it comes in handy when you want to leave a note with a purpose of a build for your team yeah that's good uh so by adding more information like why you're submitting this build you can do that in the message and later it's going to be visible in in this part somewhere here as a message cool you can also use platform all to build for both Android and iOS at the same time that that's uh yeah that's useful when we set up everything and we know that our build pipeline is is working properly and after doing a change we can execute yes build platform all and then also add another uh flag Auto submit and we are done we can close our computer go to sleep and be sure that Expo uh es services will first build of application for Android an iOS and after that is done it will automatically submit it to the stores so yeah that's really handy to automate everything okay we can also monitor them with by Running Y build list what's that going to tell us yeah it shows us two new builds one in progress one as a new okay now the next step is going to be of course deploying the build to the stores if you have made it to this step congratulation depending on which path you choose you now either have a build that is ready to upload to an app store or you have a build that you can install directly on an Android device iOS Simulator for for us it's the first case uh distributor app to an app store you'll only be able to submit to an app store if you build specifically for that purpose yes we have done that you've created a build for a store learn how to submit your app to upser with submit yes after our build is going to be complete the next step is going to be y yes submit for us and I'm going to go ahead and start uh going through the documentation of yes submit because I know that uh on one platform on iOS we have to first submit it manually and only then later it's going to be able to submit from y submit so yes as I said as submit is a service for uploading and submitting your application binaries to App Stores so we can do all of this from our CLI let's see configuring as submit with ES Json production file without specifying a profile name will use a production profile if it's already defined in as Json to configure the submission yes oh by default yeah yep we're still waiting for the builds to for iOS build submit to App Store yeah I think that on iOS you can do that right away from uh from Yas but on Android yes on Android we'll have to create an application on Google Play console and upload the that one manually okay so let's go ahead and start the configuration for y submit to prepare for the next step so by default the sub uh the we will need to add a submit uh field in our y Json I'm wondering if there is no y yes submit Das configure similar to how we did it for uh update and build I didn't see that one here that means there is no configure for submit so we will have to configure it manually as you can see what we have to do is open y. Json this is the file the configuration file for all y services and we have firstly the build uh the configuration for as build and we have to look at where it ends it ends yeah here and after that we have a submit all right that's good we already have something for submit and if we don't specify any profile automatically it will take this production one so in the production we're going to need a couple of things here for Android and iOS for Android it needs service account keepu the track to which we will submit for iOS it needs Apple ID the app ID and apple team ID I think the documentation lags a bit here on the submit on how to create these ones and so on so I'm going to stop the screen sharing a bit uh do we need to First create the application actually I think that simply by running as submit dpos is going to follow through the same process without us having to manually change anything here but I might be wrong so I'm going to delete it for now wait for our iOS build to finish and I see that it failed uh okay that's interesting uh so let's go ahead and deug why it f bu we're going to go to the builds so our iOS build has failed why we're going to look that the run fast lane fa failed and the build failed we can look why it failed maybe I can zoom out a bit let's scroll until we see some errors in the build process Metro encountered an error enable to resolve amplify configuration from underscore layout yes yes I understand uh this is a very common issue when you are trying to build your application that uh depends on amplify because in our code we depend on this amplify configuration. Json file however uh and when building locally this file exists however if we look into this AWS exp ports amplify configuration file this file is added to get ignore that means that this file AWS amplify configuration let's see this means that that file is not going to be in the source code of our repository and yeah yes will only take the files that are not ignored so we can either unignore it for yes or we can uh completely unignore it in our source and submit our this file to our G repository because this file does not contain any um any secrets it only contains links to resources and the authentication authorization is handled based on the on a c on a key so we can simply do the following before the amplify do not add it here uh we we shouldn't do change anything from this part uh I'm going to take the amplify configuration ation Json and actually I'm going to do it afterwards because I'm going to negate the exclusion of this file now if I'm going to do get status I hope to see the file uh sour samplify configuration untracked so that means that now get sees it so we can do get um actually I'm going to all already check out on the day 13 and in order to keep the start clean and I'm going to do a git add G commit setup build and maybe that's it for now okay so that means that we have fixed something uh and we try to submit a new build again usually when you submit a new build you would have to uh in your up. Json You' have to increase the version number especially if that build already was submitted to the store and whenever you have to submit another one you'd come here You' change the version to 1.0.1 and let's go ahead and submit a new build for iOS using Y build platform I OS um it will ask us again to log into our account what is Expo orbit good question we're going to explore that as well uh so yeah we submitted a new build for iOS now under the build I think that it's safe to uh to stop the Android build as well because it will have the same issue so let's cancel the build not to to wait for it because it will also have the same issue of missing file from G ignore about AWS configuration uh our iOS oh wait which one did I just oh that's that's that's correct that's correct now a new iOS build with the version 1.0.1 has started and I will have to do the same for Android okay perfect all right so we're going to wait for the builds to to happen and after that we're going to go ahead and submit it uh to to the stores yes that's true um seat is saying for the failed builds you don't NE necessarily have to change the version of application because you didn't submit it anywhere only increas build number and that's enough that's true when when the application doesn't Reach the the the store uh and you need to rebuild it you don't necessarily have to increase the version code and actually you can submit multiple builds with the same version uh as long as they are internal builds I mean not in as long as they do not uh go as a public build on the market so maybe you are you submitted a build to test flight you are checking it and you see that you need to to fix a bug you can do that uh without changing the version only increasing the build number submit a new one until you fixed all the buxs for V version after that you submitted it publicly on the store so that your user will also get it and the next build from that point should already increase the version number Alexi hello what's up my man uh someone was asking also about the Expo orbit I haven't checked it out yet but this is a ma application that allows us to to manage our bills manage our yes builds and so on so let's actually give it a try while we are waiting for the build to to finish so it allows us to install and Louge builds from E we just one click launch snack project so first we're going to have to download Expo War bit [Music] probably from here let's unzip it in and [Music] install so here is Expo orbit configure developer tools so it checks with X code and so on if we press get started what's happening okay here it is it's a m Tool uh toolbar application from where we can for example launch different simulators we can also select a build from esas and that will open our es account and we can select demember and for example this internal iOS build if I press open with orbit we see I'm not sure if you can see it properly because it's a bit out of a screen for you but it automatically open and downloaded it from V and now we see installing so it's a really easy way without us having to manually download drag and drop and so on we can manage from here like emulators emulators we can run like for example Android iPhones iPads this one is running but what's going on with with it let me try to close it and so let's try to launch this iPhone 15 Pro from here not sure where it's running but it says that it's running external what not sure what's happening here maybe for the settings think by simply logging in will be better the login was very easy and just connected and it open in browser okay now after logging in it also contains projects and I can go with I can go and I don't see where are where the the simulators are because I'm launching them but my simulator broke it's a bit weird not sure what's happening actually did I just break my simulator let me try to quit orbit quit simulator and simply run it again simulator oh a lot of them are here so probably I was just not seeing them or bit I can check for example opening orbit it's installing and automatically starting here yeah perfect cool so yeah uh in a simple words this orbit is a tool for maos that allows you to easily manage like simulators emulators and also your y projects and allows you to run with a single click y builds that you have there all right back in our builds we see that uh I think our iOS store has finished yes the the build for uh production for iOS tour has successfully finished now it buil correctly and what we can do is we can either download and manually upload it to up store um or we can use the es submit service to automatically submitted for us let me quickly log into App Store so uh here on app store you can as I said you can either manually create a new application or we can go ahead and follow the Y yes submit and submit to up store documentation to submit the latest build that we created with as build to app store for that we're going to go ahead and open a terminal let's sorry for that all we have to do is do es submit dpos and if we provide latest it will take the latest build from y otherwise it will allow you to choose a build based on a list of them now what ensuring your app exist on apps are connect um it doesn't so it will create it for us it loaded with Team where Apple ID bundle identifier now it's creating the application on the store it prepared the application on the store uh and allows us to reuse a API key now it's submitting the application and it's in progress if we look at our dashboard under submit somewhere we should see this process vm7 has created an iOS submission this usually takes very fast uh it can be done in in a couple of seconds especially after it's going to be uh not not when it's the first time like a bit later now if I look at the App Store and update this page we're going to see we should see a new application being created yes we see the demember and if I go there it will also have uh in the test flight it will have this version one which doesn't have yet the binary because I think it's still submitting it if I go back here I see that the submission has finished successfully and that means that now I can go to App Store we can open demember uh here as I said we have 1.0 version uh we can scroll down under the builds to see there is no builds here let's check in the test flight no build in the test flight either but it let it it tells me that to start testing and collecting feedbacks we need to create a group test group let's create this group uh and we still do not have any builds why is that submitted production production version 1.0 point oh it might take a few minutes until it's visible online so yep that means that it's going to be available in a moment now it's on the Apple side to verify and to to update the cash if we it yeah as we can see after the next refresh uh the build is already ve if we look at the test flight and it's under processing again we're going to have to wait a bit for the bill to become available it's still processing but what is this test flight test flight is a tool to test internally with a smaller group of users your application before you publish it live uh also after you publish it live you will still use test flight uh to test new versions so you do some some new features new versions in your application you would first submit it to the test flight and then based on different test test groups you can you can test uh the application for example you might have like an internal test group for only people in your organizations maybe that's other developers maybe that's testers in your in your organization also you can have external testing which are uh test external which are the users externally from your organization that would like to help you test the the application this can be like a very small group of pro users that agreed to test the latest versions and they can join this uh testing this public test flight testing using a a link uh all right so yeah uh now we see that it has finished processing and it has this missing compliance uh we have have to press manage without going through this prompt we're not going to be able to see application on test slide and at the moment we do not use algorithms for encryptions now our application is ready to submit but it's also ready to test in test flight all we have to do is in the testing group uh we see that we already have automatically a build ready to test and we simply have to add some testers here I will add myself and when adding a tester in this one we will receive uh an invitation to our email give me just one second to bring my uh cable so that I can show you what I on my phone as well all right guys so let me connect my phone so you can see it as well apple is slow you need to wait well yeah the whole be the whole process of building applications like it's it's quite slow but and that's why tools like a helps a lot because you can automate this without you having to mentally wait for builds and to to wait like 20 minutes and then go submit it so it's much easier just one second no no no no no no no not like that come on I need my screen here why it's not connecting properly oh I I think it needs to be on the same network oh boy yeah for some reason I cannot show you the the screen of my phone right now as always the the quick time player is acting up let me see if I can do it here I really want to do it from the phone from the simulator is not going to be the same for maybe it's the table the cable give me one second let's try a different cable please work okay okay it's not working it's not working it's not working um anyway uh after adding a person I'm going to continue and I'm going to simply just explain what's happening after adding a person under the testers and after having your application in ready to test uh you'll receive a message on your email with the invitation come on with init vation to test flight I'm going to Simply open it in test flight which is a an application that you can get from from the market and that application allows us to test um apps that are still in testing mode in yeah basically through test light now I'm waiting for the application to be installed on my device and as I have it I can open it up it opens and it's the production application so it will not have any uh console warrants on top anything like that this is the production version of application so what we can do is we can also through test slide we can send feedbacks if I'm not mistaken yes you can send uh feedbacks including screenshots and you're going to see these feedbacks inside your test flight I'm going to show you that as well I just sent a feedback and here on test flight if we go to our page we're going to see uh logs about crashes that are happening and also screenshots uh with feedback points like here here I left a screenshot and I can have more details about the application the version or what's happening if something is not not correct so this is a great tool for testing your application in production now let's let's try to send an over theair update what I'm going to do for the over theair update is I want to simulate a very small fix in our application and I don't I will not want to go through again building and submitting it for rest store but I would rather send it over the air let's do that small change inside our application in the root layout and we have here the title demember Let's do let's change this title from demember to updated save now if I'm going to run this project locally with a development build on a simulator the the simulator yeah because it's working with a development build it's taking that JavaScript code from our uh Metro server so all the changes are automatically here that's cool but the application that I have on my phone installed on my phone phone it will not update because this is the build application and it still has the come on can you focus probably not going to focus so it still has the demember um title so for such small update usually what we have to do is we have to rebuild our application we have to go ahead uh in our up. Json increase the version increase the build code uh create a build again through y build then wait uh for for the iOS build to to finish then wait for Android Bild to finish then submit it to IOS and Android store so it's a long process and small things and small bug especially small bug fixes that are are on on our JavaScript side they can be sent uh through yes update so let's have a look at how we can do that I'm going to open the documentation of es uh EAS update and in by getting started we already configured it now the last step is to publish a build using as update and a branch name we can send the we can send a new update to see the branch name where we can go back to our cons to our es development dashboard and we will see that automatically we have some branches we have a development branch and the production Branch this we created automatically for US based on the es. Json here where we have channels and for every channel it created a branch these are ways for y update to know to which binary to which version of your application we should send the updates so because we want to send it to production I'm going to use the production Branch when sending the update so let's open up the terminal let's clear everything and to send this update we're going to do EAS update Branch production and message we can say uh updated title let's press enter we have exporting okay let's see what's happening uh there are some questions uh let's see do you happen to know how to set up your own iOS server with the latest version of mos and in and an installed pipeline for building application submitting them to App Store on your own home lab Lab well I haven't done that uh it would require a lot of managing of a system and everything you would also have to learn um fast lane which is um a a tool also used by E that allows you to automate this so learn about fast lane it's the app automation tool to distribute and to build to manage signing and so on so we have exported bundles we have uploaded two application bundles for Android and iOS and 73 iOS asset 73 okay okay okay perfect if we go to our documentation here not documentation to our dashboard and look at the updates uh we don't see any updates no we see one update Title and it's targeting the branch production for this specific runtime was created by me and also it will have like some some message it's also targeting Android and iOS well if we look at my application it will not update automatically by default and what we have to do is close the application because these updates will be downloaded the next time you open the application now if I open it the second time most probably I will still have a old demember title come on Focus here doesn't want to so I closed I open it again and it still has the demember title why because updates are being downloaded in the background behind behind the scenes this is happening in order to provide a very smooth and fast uh opening time of the application so when the application is open xop days um the application is being executed as it was previously but behind the scenes Expo updates is see is checking if there is updates and we'll download them and the next time when you close completely and open the application then it's going to contain it so let's have a look I'm going to close it and open for the second time and I expect the title to be updated you don't see probably but uh trust me it's V come on I just focused and I took it away but yeah um if your update if you don't see your updates make sure to close it and open a couple of times um from the second time it should work because the first time you close and open it will trigger the uh downloading the updates and then you have to do it again to the new updates to take effect hey Stuart thank you very much for your uh donation towards the fundraiser thank you very much I appreciate it uh what do you think of code push does it work for iOS I haven't tried it should I use as build for development if I can't work with local Builds on my PC in addition regarding amplify V6 I can see that Json I only have a A6 ports uh then add the if you are importing and using AWS exp ports in your where you configure uh where you configure amplify amplify configure check where where you are importing it from and make sure to extract or make sure that that file is not get ignored we do that not by deleting it from here because this part is automatically gen uh generated by amplify but by negating it below it so with a question mark and amplify configuration you can do the same with question mark and the AWS export if you are using a the EXP ports in your code can we use a popup in application for updates when user presses the button will get the update and restart the application yes very good question the Expo updates and especially um especially in the recent version maybe it's not even yet possible maybe it's going to be possible from Expo DK 50 but it will allow you to it will give you Hooks and allow you to um adjust how Expo dates will will work so Advanced optimized this is for ES updates code signing roll outs roll backs with as updates uh from the SDK 50 we will be able to do a roll out based on uh not targeting not all the users of your application but maybe like only 20% of the users so this is uh sending the updates to only parts of your application testing some new features and if everything is okay you're going to be able to send it to everyone so this is going to be available from the next SDK version for the roll outs uh uh we can probably look at the uh export updates library because that's the the library that we installed in our application so the Expo updates Library this is a separate Library independent of uh EAS update but it works well together the Expo update will only handle like hey having an URL like manage like the updates uh so with this one you it it will check it automatically and it will work the way I explained but you can also check for updates manually for example when a user presses the button where when you open the application you can check that so you can take update check for updates you'll be able to check if it's available you might show a popup if an update is available saying that hey update it before you use it and then restart the application and you can also use Expo updates with a custom server it doesn't mean that you will need to use it with a update so yeah check the documentation here for more information all right so we have covered a lot of this process for iOS but we haven't done a lot for for Android yet uh we have only build the application for Android and we can look in the builds here what we have the Android build for App Store is still in progress but I'm not sure if we're going to wait because for Android we would we will have to go through a lot of process of setting up the application ourself I saw it somewhere in medium but when I wanted to use I couldn't find it for what for the popup yes for that check the Expo updates documentation mindless caller is saying I've been watching you since two years and I know one thing uh for sure you're the best providing such content for free hats off man thank you very much I appreciate it do you deploy an application that uses amplify as is with all amplify directory content I'm afraid it exposes stuff is it safe um the the even the configuration of amplify does not contain anything that is not safe to share because most of the permissions they are happening through the AWS profile so that one is not even in your application uh worry I'm happy to to hear that where he's saying that he came to this build by searching for ES build and he saw that this is life perfect happy happy to to provide value if you find this interesting make sure to subscribe to the channel anyway guys uh it's day 13 and to be honest uh it's starting to to become harder and harder to do the toour live streams so um I'm going to stop here we have covered the Y build we have covered the es submit and the es update uh for iOS we also covered building for Android but we didn't cover submitting the Android project for that uh you can go ahead and follow the EAS submit for Android documentation EAS submit submit to Google because you will also have to first create an application to Google Play console and upload it manually at least once and only after that you'll be able to use yes submit so this is going to take a lot of time uh which we don't have at the moment um I'll will make sure to uh in future to do more tutorials like this or if you're interested uh you you can check out our Academy where we go in depth into both Android and iOS build submit update the whole process we also in our course we also create an automatic um pipeline that whenever we submit uh changes to our repository it automatically builds and submits the application so it's uh it really simp simplifies where is it it really simplifies the whole process because when you have an automated pipeline uh then you can focus on building your application or on on building features then you simply submit the code changes to your GitHub repository and it automatically is being build and submitted to the store and in probably uh some minutes like 40 minutes you're going to receive a notification from flight uh from test flight that there is a new version available you're going to test it and if everything is good you going to merge your branch with another maybe production branch and the whole process will start again but this time it will deliver to the you and users so yeah we have like these workflows for ES build submit build and deploy super cool all right guys so this was day 13 of our demember I hope you enjoyed this I hope you're following along and learning and becoming a better rack native developer uh we are going live every single day so make sure to subscribe to the channel not to miss any future videos and I'm going to see you tomorrow with a new project thank you very much guys and I'll catch up soon byebye

Channel: notJust․dev

Views: 8,576

Keywords: vadim savin, not just development, notjust.dev, react native live coding, live coding, javascript, react tutorial, react native tutorial, react native ui, react native for beginners, mobile development, DEVember, fundraiser, EAS Build, EAS Submit, EAS Update, React Native, Expo Application Services, iOS Deployment, OTA Updates, App Store Submission, Play Store Submission, App Publishing, React Native EAS, Expo EAS, Over-The-Air Updates, Mobile Deployment, Android Deployment

Id: PdHbBZvPyxI

Length: 94min 49sec (5689 seconds)

Published: Thu Dec 14 2023