WEBVTT 00:07.770 --> 00:11.860 Now you're going to publish you up to the Google Play and absol. 00:12.270 --> 00:19.050 But before we do that we need to do a little bit more wake the UP WE built so far is what we call a 00:19.050 --> 00:20.580 hybrid up. 00:20.670 --> 00:27.210 So what is a hybrid of a hybrid app is an app that is built with a combination of Web Technologies a 00:27.210 --> 00:30.550 shemale says and Javascript. 00:30.600 --> 00:33.530 So our app is a hybrid up. 00:33.900 --> 00:38.230 So the question you should be asking by now is how are hybrid mobile apps built. 00:38.520 --> 00:49.020 Well once we create our ASML CSSA javascript files we're not going to target a mobile browser but a 00:49.140 --> 00:54.360 web view or a UI view in us. 00:54.390 --> 01:01.770 So a review is hosted inside a native container in the device. 01:02.160 --> 01:10.410 So the view does not include any features of a fully developed web browser like all the controls the 01:10.500 --> 01:19.060 address bar and so on all the Web is going to be doing is showing a page written in HLL just like this. 01:19.430 --> 01:21.060 OK. 01:21.120 --> 01:29.580 Also the Web is going to enable us to do things like accessing the hardware capabilities of the mobile 01:29.580 --> 01:30.830 device. 01:31.440 --> 01:40.550 So to access those capabilities we're going to use apage Cordova which is formerly known as phone gap. 01:41.040 --> 01:49.330 So Cordova will provide some javascript API to access the capabilities of the device. 01:49.410 --> 01:58.860 So he's going to use plugins which are built with native code so these plug ins they will help us access 01:58.860 --> 02:06.710 the device capabilities like the camera the contacts the accelerometer and so on. 02:07.470 --> 02:15.780 So a hybrid option run just like a native up but if you're planning to build mobile games where graphics 02:15.930 --> 02:20.840 performance is paramount then the app might feel a little bit sluggish sometimes. 02:22.610 --> 02:28.490 This part of the video has been updated to reflect some changes which have occurred since the first 02:28.520 --> 02:32.340 video was released in the first video. 02:32.390 --> 02:38.850 We use the Telarc up builder to build and upload our up to the app stores. 02:38.880 --> 02:45.440 Unfortunately Telic has decided just recently to discontinue that products so we won't be able to use 02:45.440 --> 02:46.630 it. 02:46.820 --> 02:53.590 Now there are many other alternatives in the market but most of them are paid well. 02:53.910 --> 02:59.320 Fortunately we've got a couple of up builders up cocoon. 02:59.370 --> 03:06.090 They both come with a free plan which you can use to build upload apps to the app so you can build one 03:06.090 --> 03:11.850 up using fill that gap you can build two concurrent apps using code and obviously you can delete apps 03:12.180 --> 03:13.830 if you like and create new ones. 03:14.010 --> 03:16.530 And both of them. 03:16.530 --> 03:22.890 Now if you want to sign up to fill the gap you will need to have a doobie account so you can create 03:22.890 --> 03:23.640 that for free. 03:23.820 --> 03:35.890 Basically phone up was built by a company which was acquired subsequently by Adobe and while doing the 03:35.890 --> 03:42.610 sign up process you will be able to link your Adobe account to your accounts if you want to sign up 03:42.610 --> 03:44.740 to cacoon is pretty straight straightforward. 03:44.740 --> 03:48.120 You don't have to have any prerequisites to sign up. 03:48.370 --> 04:01.300 Right now the main difference between these two buildings that's the sign up process for cocoon. 04:01.480 --> 04:07.090 From my perspective I find it's a lot easier because you don't have to do some extra steps which you 04:07.090 --> 04:09.500 will need to do in funda. 04:09.580 --> 04:14.680 So for example you don't have to create a configuration file for your OP. 04:14.950 --> 04:18.720 If you build this using Akun that's already including. 04:18.760 --> 04:21.870 So you can just use the existing templates. 04:21.910 --> 04:27.580 Also it's going to guide you through the creation of the icon of the up and so on while you still need 04:27.580 --> 04:29.970 to do about one with the in front. 04:30.010 --> 04:36.730 On the other hand the documentation in front up is really great especially when it comes to the signing 04:36.730 --> 04:44.310 process which you will need to go through to create a key to prove ownership of the app. 04:44.410 --> 04:47.530 And that's very important is to upload your app to the app stores. 04:47.660 --> 04:48.640 And we're going to come back. 04:48.640 --> 04:50.480 We're going to come to that in a bit. 04:50.980 --> 04:55.810 So for now I'm going to use cocoon to create our up. 04:55.810 --> 05:00.460 So first of all we're going to upload it to the Android app so and then later on we're going to upload 05:00.460 --> 05:02.110 it to the IRS Opsahl. 05:02.290 --> 05:07.690 So to create your app you just need to upload your zip file. 05:07.720 --> 05:11.750 So we're going to need to zip our products for the. 05:12.140 --> 05:21.290 So if you go to your product for the event select all the files then compress them and name your zip 05:21.290 --> 05:25.700 file something like a speed reader. 05:25.940 --> 05:34.430 Then you can just drag and drop the file write the. 05:34.770 --> 05:37.420 So now we've caught our projects created. 05:37.500 --> 05:42.050 So this collection is served us our up. 05:42.500 --> 05:51.020 So now we just need to change the title of how far up and we can do that by going to the config. 05:51.030 --> 06:00.180 Those file basically if you do this in Photoshop you won't have this config file ready so you will need 06:00.180 --> 06:01.470 to create as well. 06:01.680 --> 06:03.150 And includes inside your app. 06:03.210 --> 06:09.280 So I'm going to change the title of the OP the name will be up to speed reader 06:12.810 --> 06:22.390 and we're going to change the description to something like efficient greeting. 06:22.430 --> 06:29.340 Let's also change the ID of our up to come daubs. 06:29.410 --> 06:31.120 So we're going to go for development to island 06:34.510 --> 06:35.360 as Peter de 06:39.810 --> 06:40.180 say 06:42.960 --> 06:48.460 so also you will need to add an icon to your up 06:53.180 --> 06:57.940 going to as default and you just need to drop an image right there. 06:57.950 --> 06:59.810 So I'm going to use an image here. 07:21.660 --> 07:29.750 And also you can choose plugins that you'd like to use inside your app. 07:29.800 --> 07:36.430 So for example you may want to use a Facebook for Android or Facebook for us. 07:36.620 --> 07:40.730 So at the moment our OP doesn't use any of these plugins. 07:40.840 --> 07:44.580 So if he need any of those you just need to install he's using the install button. 07:45.730 --> 07:47.800 All right. 07:48.000 --> 07:55.140 So here are some things. 07:55.160 --> 07:59.050 So everything else will be left as default. 07:59.050 --> 08:06.730 So we're using the web ending and the content of your email is our index notes a simplified. 08:06.740 --> 08:07.250 All right. 08:07.490 --> 08:15.780 So since we are uploading now or building for android I'm going to take the under-rate checkbooks. 08:16.460 --> 08:16.850 All right. 08:16.880 --> 08:27.720 So let's save right now before we build our up and upload it to the App Store we will need to sign it 08:27.770 --> 08:29.860 to prove ownership of the app. 08:29.930 --> 08:34.970 So the signing process means that you're going to be building a key which you will attach to your job 08:34.970 --> 08:41.690 to prove that you would the up so that you can upload it to the Opsahl and then upload further versions 08:41.690 --> 08:42.660 if you like. 08:42.740 --> 08:48.650 So you can compile the app using that button if you like decompile develop an app if you want to test 08:48.650 --> 08:51.730 the app on your Android device. 08:52.010 --> 08:55.980 But to upload it to the Apso you will need to to use that person. 08:56.050 --> 08:57.700 Now we can we're not going to do that for now. 08:57.700 --> 08:59.590 We need to sign the office. 09:00.050 --> 09:03.290 So here comes the documentation that we need. 09:03.290 --> 09:11.090 So we're going to go back to you Phil. Go and click on the box link and here you'll find the signing 09:11.660 --> 09:14.930 documentation for both of us under our windows. 09:14.990 --> 09:17.150 So we're interested in at the moment. 09:17.150 --> 09:21.360 So to sign up you will need to go through these steps. 09:21.390 --> 09:22.150 All right. 09:22.670 --> 09:26.170 So first of all you will need to download and install job. 09:26.250 --> 09:27.320 So it is open that's 09:30.430 --> 09:35.950 so all you need to do is click on that button and then follow the installation process is pretty straight 09:36.070 --> 09:36.890 straightforward. 09:37.180 --> 09:41.850 I've already installed Java on my computer so I don't need to do this again. 09:41.970 --> 09:42.590 Right. 09:42.640 --> 09:47.250 So once you do that you just need to go to the next step. 09:49.520 --> 09:53.090 Which is to set the Java home directory. 09:53.120 --> 09:57.190 So first of all you will need to install the JDK. 09:57.950 --> 10:00.380 So the steps are different. 10:01.810 --> 10:04.520 Depending on whether you're on Unix or Windows. 10:04.520 --> 10:11.290 So on a Mac you need to follow the Unix instructions when you need to follow these four windows. 10:11.320 --> 10:11.720 Right. 10:11.890 --> 10:24.480 So for now I'm going to follow these ones so I'm going to need to install the JDK software. 10:24.640 --> 10:33.160 So again you just need to click on that link and follow the instructions for the installation process. 10:33.370 --> 10:34.040 All right. 10:34.500 --> 10:45.520 So once you do that you will need to set the Java variable there before you do that. 10:45.540 --> 10:49.860 You will need to know where Java has been installed when you can be. 10:50.070 --> 10:56.460 So to do this you just need to open the command prompt all the terminal. 10:56.460 --> 11:02.850 So if you are on Windows you just click on the button and then type command. 11:02.880 --> 11:09.810 If you're on a Mac just type or press command space so you will see the spotlights 11:13.060 --> 11:13.750 search. 11:13.870 --> 11:16.450 And let's look for terminal 11:21.630 --> 11:36.740 so the command to run here to find where Java has been installed is going to be Ecko use of force slush 11:38.400 --> 11:41.880 Lipp exec files flash Java. 11:42.700 --> 11:45.350 So you find this just before the video. 11:45.370 --> 11:50.650 So I'm going to include all the commands that you will need to run in the terminal. 11:50.840 --> 11:55.780 Say all you need to do is copy paste these commands to save time. 11:55.780 --> 12:02.770 So once you do this this will show you where Java has been installed in your computer so you will need 12:02.770 --> 12:05.050 this for your next command. 12:11.820 --> 12:13.860 So you need to run this command now. 12:14.900 --> 12:20.750 And replace this with the location of your Java. 12:21.140 --> 12:33.110 All right so I'm going to pause and then copy the right command rights then you will need to run this 12:33.230 --> 12:36.980 command to set up the Java path. 12:41.400 --> 12:42.640 Here we go. 12:42.660 --> 12:49.370 So now you have set the Java on your system. 12:49.560 --> 12:56.640 So on Windows a slightly different you just need to right click on the on my computer select Properties 12:57.000 --> 13:03.830 then go to the advanced tab selects the environments variables and then Edie's the variable right there. 13:03.860 --> 13:06.500 All right so now we are done with this step. 13:06.670 --> 13:11.390 Now you need to run this command to create Yawkey. 13:11.610 --> 13:16.290 So you can change the keys to winning. 13:16.290 --> 13:18.120 So this is the name of your key. 13:18.390 --> 13:19.510 There's going to be created. 13:19.710 --> 13:21.620 So you can give it any name you like. 13:22.080 --> 13:28.050 And also you can change the alias name and you can choose any alias name you like. 13:28.050 --> 13:28.560 All right. 13:28.770 --> 13:34.270 So we're going to pause the video charities and then go back to the command or the terminal 13:41.160 --> 13:52.380 so I named my key key speed reader crystal and the areas I chose a speed reader alias. 13:52.520 --> 13:53.120 Right. 13:53.500 --> 13:56.980 So now it's asking for a password. 13:58.240 --> 14:07.150 So you're going to have a couple of passwords later a key to password and a specific password. 14:07.330 --> 14:14.650 So I'm going to make sure that we use the same password in case it's it's us for another password. 14:14.750 --> 14:26.710 So we're going to use a simple password here and re-integrate say is going to ask you for a few pieces 14:26.710 --> 14:27.750 of information. 14:27.760 --> 14:50.720 So first and last name. 14:51.320 --> 14:55.970 OK so now he's going to ask you if everything is correct here. 14:56.040 --> 14:56.840 Just say yes 15:00.780 --> 15:07.980 tonight say that it's storing the speed reader pistol key and you can see that it didn't ask us for 15:10.900 --> 15:12.440 a specific password. 15:12.460 --> 15:16.970 So this means that's what you call the same password for both the keys still. 15:17.050 --> 15:19.900 Besides if it's going to need those later. 15:20.260 --> 15:22.400 So now our key has been created. 15:22.450 --> 15:27.150 So if you find the key you just go to your finder or your Explorer 15:31.350 --> 15:40.400 and you click on the root directory and you find your key right there. 15:40.700 --> 15:41.680 Right. 15:41.880 --> 15:45.390 Because in my case I saw these in the root directory. 15:45.430 --> 15:48.770 So I didn't specify another folder. 15:48.810 --> 15:53.220 So by default it's going to be so bad because that's where I run my commands. 15:53.730 --> 15:58.030 So that's the key and you need now to add the key to your projects. 16:12.140 --> 16:22.640 There it is go back to our projects and our key going to select under-rate and then add a key so you 16:22.660 --> 16:28.200 need to give us a title so I'm going to choose the same title there. 16:28.370 --> 16:30.070 You can name it anything you like. 16:31.800 --> 16:32.830 And the alias 16:36.300 --> 16:38.930 I'm going to choose the same one that's 16:43.520 --> 16:45.240 I haven't. 16:45.240 --> 16:46.230 All right. 16:46.250 --> 16:52.790 And then the system because password is the same password that we used earlier and that was the same 16:52.910 --> 16:54.110 was the case all password 16:56.950 --> 16:58.330 and notice to the file 17:01.040 --> 17:04.940 Arianespace so that they cannot 17:09.140 --> 17:09.390 say. 17:09.420 --> 17:14.170 Now our key has been added or is to the projects 17:17.910 --> 17:23.730 and now we are ready to compile our projects to update the absol 17:29.370 --> 17:31.020 So just click on that button. 17:35.430 --> 17:36.630 And now it's compiling. 17:36.820 --> 17:45.430 Now just a note if you use phone gap instead of cocoon and you create a key to unlock it at some point. 17:45.590 --> 17:57.730 So to create the key in front you'll need to go to Edie's account signing keys and then add a key. 17:58.170 --> 18:02.490 So you need to choose a title alias alias. 18:02.790 --> 18:14.120 So for example it's good for those and then to the key submit the key. 18:14.180 --> 18:17.000 Now you will need to look at the odds your passwords 18:25.010 --> 18:31.150 know your key has been looked and now you can use it to compile your projects. 18:31.160 --> 18:34.800 All right so now let's go back to Cancun. 18:35.120 --> 18:36.340 So we're still compiling. 18:36.340 --> 18:43.070 Sorry we're going to pause now and wait for it to finish compilation right now it has finished compiling. 18:43.090 --> 18:50.530 So if you click on that button you'll be able to download your AP file which you will need to upload 18:50.530 --> 18:53.620 your up to the Android app store. 18:53.620 --> 19:00.630 So that's name it's speed read up for example. 19:00.630 --> 19:05.630 So let's save right now if you click on this zip file 19:08.250 --> 19:08.640 so 19:12.840 --> 19:23.670 inside it's You'll find your under-rate release file and that's the file you will need to submit to 19:23.700 --> 19:24.510 the App Store. 19:24.720 --> 19:28.480 And that's what we do in the next part of this video. 19:34.330 --> 19:40.630 Once you get to this stage all you need to do is accept the developer agreements by taking these books 19:41.260 --> 19:43.620 and then continue to payments. 19:43.620 --> 19:45.750 There is a 25 dollar fee. 19:45.790 --> 19:52.600 You need to pay for the developer registration and then once you've done that you can follow the steps 19:52.600 --> 19:54.620 you can find in the documentation. 19:55.210 --> 20:02.050 So you will need to create a new application in the console and then upload the AP K package that you 20:02.050 --> 20:07.000 have just downloaded and then after that you can fill the product details. 20:07.030 --> 20:11.370 So a price and then you can publish the app. 20:11.980 --> 20:18.880 So once you register you're going to learn in this page if you want to publish your Abdus click on the 20:18.970 --> 20:23.880 publisher wasn't ok and then gave a title to the OP 20:30.240 --> 20:33.560 so you can choose the default language. 20:33.730 --> 20:36.140 And now you're ready to upload the AP 20:43.950 --> 20:46.530 OK. 20:46.800 --> 20:48.750 Now you can click on the upload button 20:51.560 --> 20:54.250 and choose the file. 20:54.500 --> 20:57.240 We can just drop the file there. 20:57.630 --> 20:58.080 OK. 21:09.460 --> 21:10.650 OK. 21:11.840 --> 21:16.170 Now we can fill in other bits of information about what's up. 21:16.280 --> 21:16.730 Mike 21:19.860 --> 21:20.750 solacing. 21:20.850 --> 21:29.170 OK we can add a description for the also so we can add screenshots and so on. 21:29.400 --> 21:30.660 OK. 21:30.740 --> 21:38.130 And then if you go to content's rating. 21:38.270 --> 21:44.600 So if you click on continue there would be a questionnaire that is used to inform consumers about different 21:44.600 --> 21:49.640 things like the age restrictions for the app. 21:49.660 --> 21:52.250 Ok then if you go to prising on the solution 21:59.070 --> 22:01.350 then you can set the price for the up. 22:02.170 --> 22:05.640 And go for free or a paid up. 22:05.640 --> 22:09.880 In that case you need to set up a merchant account. 22:10.140 --> 22:10.830 OK. 22:11.070 --> 22:17.160 So once you've finished all the necessary information then you'll be able to publish your app so if 22:17.160 --> 22:18.860 you click on why can't I publish it. 22:18.870 --> 22:20.910 We'll show you all the missing bits. 22:20.970 --> 22:21.450 OK. 22:21.750 --> 22:29.310 So you'll need to finish all these points to be able to polish up in the next video we are going to 22:29.340 --> 22:32.190 publish our up to the U.S. Opsahl.