1 00:00:00,860 --> 00:00:05,090 Now that we've got our application up and running on our mobile device let's open up our code editor 2 00:00:05,150 --> 00:00:09,020 and start exploring our project directory just to see what we're working with here. 3 00:00:09,070 --> 00:00:14,740 It's going to start up my code editor just you know there's not necessarily one code editor that is 4 00:00:14,740 --> 00:00:19,560 better for working with React Native than another you can use any editor that you want to use. 5 00:00:19,810 --> 00:00:25,140 It's going to open up that project directory we just created of our starter and then right away inside 6 00:00:25,140 --> 00:00:27,690 of here we're gonna see a couple of different files and folders. 7 00:00:27,690 --> 00:00:33,010 Now as I mentioned I generate this project ahead of time and added in just a little bit of code to it. 8 00:00:33,120 --> 00:00:35,280 We are going to eventually generate projects together. 9 00:00:35,280 --> 00:00:36,820 We'll walk through that entire process. 10 00:00:36,870 --> 00:00:40,320 But for right now we're just gonna use the starter project inside of here. 11 00:00:40,350 --> 00:00:45,810 You'll notice a file called Ask me a folder called s RC and then inside there is a screen directory 12 00:00:46,110 --> 00:00:49,410 and then inside there is a file called home screen. 13 00:00:49,410 --> 00:00:53,870 If you open up that file right now you're going to see some little bit of something it looks like h 14 00:00:53,870 --> 00:00:57,310 t mail right there and inside of it is the word home screen. 15 00:00:58,080 --> 00:01:02,310 So I'm going to assume that at this point in time you've got your application up and running on your 16 00:01:02,310 --> 00:01:03,080 physical device. 17 00:01:03,090 --> 00:01:07,310 Hopefully you see those words home screen on your physical device. 18 00:01:07,560 --> 00:01:11,970 If you do I want you to try changing the text inside of there to something else something like maybe 19 00:01:11,970 --> 00:01:14,790 I don't know Hi there or something similar. 20 00:01:14,790 --> 00:01:17,000 I'm then going to go ahead and save that. 21 00:01:17,100 --> 00:01:22,700 Emily after now we should see a change automatically appear on your mobile device. 22 00:01:22,830 --> 00:01:27,420 You'll notice right here I'm running a simulator for iPhone and emulator for Android just so you can 23 00:01:27,420 --> 00:01:29,130 see very easily what I get. 24 00:01:29,490 --> 00:01:33,880 But if you are running your own physical device you should see that change up here right away. 25 00:01:34,110 --> 00:01:35,710 If you don't see that change up you're right away. 26 00:01:35,730 --> 00:01:40,430 You can always close down the expo app and re scan that QR code. 27 00:01:40,430 --> 00:01:43,050 One thing I want you to notice here is that we get library load. 28 00:01:43,070 --> 00:01:46,580 Anytime that we make use or make a change to our ReACT native project. 29 00:01:46,640 --> 00:01:52,130 So in other words anytime we change something inside of a javascript file the application should automatically 30 00:01:52,130 --> 00:01:54,430 reload for us. 31 00:01:54,450 --> 00:01:58,520 There's one other thing that I want you to see very quickly once again inside of my home screen that 32 00:01:58,570 --> 00:01:59,700 J.S. file. 33 00:01:59,700 --> 00:02:04,980 I'm going to go down to the very bottom down here and I'm going to add in a couple of just like whatever 34 00:02:04,980 --> 00:02:10,800 characters like so something that's going to definitely cause an error so that a doubt that is not valid 35 00:02:10,800 --> 00:02:15,300 javascript code after putting that in there I'm going to save that. 36 00:02:15,300 --> 00:02:20,090 And then on your mobile device you should see a big red error message like the one right here. 37 00:02:20,190 --> 00:02:22,670 This is going to be the air screen that you see very frequently. 38 00:02:22,670 --> 00:02:28,800 Anytime you make a typo or some kind of exception HAMP happens inside your application at the very top. 39 00:02:28,800 --> 00:02:32,880 Inside this red box right here is a description of the error that just occurred. 40 00:02:32,880 --> 00:02:38,700 You'll notice that inside this path right here we're told the exact file and line that the error occurred 41 00:02:38,700 --> 00:02:39,360 on. 42 00:02:39,360 --> 00:02:44,220 So in this case we're being told that inside the home screen J.S. file on line 17. 43 00:02:44,250 --> 00:02:45,380 There is some air. 44 00:02:46,200 --> 00:02:47,340 So if we want to fix this. 45 00:02:47,370 --> 00:02:53,970 Well very simply we would go back over delete those extra characters save the file and then we should 46 00:02:53,970 --> 00:02:56,310 see the error message go away. 47 00:02:56,310 --> 00:03:01,650 Now unfortunately if you're running an iPhone you might not see the error message go away automatically. 48 00:03:01,650 --> 00:03:05,220 You'll notice that on my android emulator the error message did go away. 49 00:03:05,220 --> 00:03:07,700 But on the iPhone it's still here. 50 00:03:07,710 --> 00:03:12,780 So if you still see that error message on an iPhone after you have fixed an error or at least you think 51 00:03:12,780 --> 00:03:18,470 you fixed it then there are a couple of steps we can go through to manually clear this error message. 52 00:03:18,510 --> 00:03:21,870 First off you'll notice that there are a couple buttons down here at the bottom of the screen that you 53 00:03:21,870 --> 00:03:22,920 can tap. 54 00:03:22,980 --> 00:03:28,280 So you could hit reload once you hit reload you're almost always going to see a second error message 55 00:03:28,290 --> 00:03:30,930 one that looks like attempting to reload bridge. 56 00:03:31,050 --> 00:03:35,730 You can hit reload again and then hopefully the application should reload and you'll then see your content 57 00:03:35,760 --> 00:03:36,720 appear on the screen again. 58 00:03:37,550 --> 00:03:37,800 OK. 59 00:03:37,830 --> 00:03:42,780 So what we've learned here is that whenever we make a change to our project our application should automatically 60 00:03:42,780 --> 00:03:47,910 reload and if we ever cause an error we're going to see that big red error message that tells us exactly 61 00:03:47,910 --> 00:03:48,680 what went wrong. 62 00:03:49,810 --> 00:03:54,000 And if you're running an iPhone you might have to manually clear out that error message. 63 00:03:54,010 --> 00:03:57,250 Sometimes it's not going to go away automatically. 64 00:03:57,250 --> 00:03:57,490 OK. 65 00:03:57,520 --> 00:04:00,730 So now we've gone through some very simple things inside of our code. 66 00:04:00,740 --> 00:04:03,990 Ed let's come back the next video we're going to start to discuss. 67 00:04:04,000 --> 00:04:08,830 Well what react and react native are all about a quick pause and I'll see you in just a minute.