1 00:00:01,630 --> 00:00:02,710 All right. 2 00:00:02,840 --> 00:00:04,240 Welcome back. 3 00:00:04,750 --> 00:00:12,970 This is the most exciting part of the whole concept until this point is starting and stopping React 4 00:00:12,970 --> 00:00:14,020 application. 5 00:00:14,170 --> 00:00:16,900 So how can we start React application? 6 00:00:17,350 --> 00:00:19,450 All right, so let's get rocking. 7 00:00:19,870 --> 00:00:25,600 Well, we have couple of ways that we can run our React application. 8 00:00:26,050 --> 00:00:35,140 If you have NPM or what you need to do is CD into the folder as we did, now we are inside our React 9 00:00:35,140 --> 00:00:36,310 application folder. 10 00:00:37,530 --> 00:00:42,930 So all what we need is making use of n p m start if you have. 11 00:00:43,110 --> 00:00:46,710 PM If you have John going to be John start. 12 00:00:47,190 --> 00:00:48,360 Or better store. 13 00:00:48,390 --> 00:00:55,800 We can use the built in terminal that came with Visual Studio code can click on terminal here and now 14 00:00:55,800 --> 00:00:57,960 we have the built in terminal. 15 00:00:58,080 --> 00:01:04,890 So here we can run the same command as on my default or my. 16 00:01:05,670 --> 00:01:07,270 Terminate here. 17 00:01:07,890 --> 00:01:10,230 So let's make this off. 18 00:01:11,710 --> 00:01:15,400 And p m starts if you're using n pm. 19 00:01:15,400 --> 00:01:25,780 So hit enter analysis that first of all is using the script start which which is inside my package, 20 00:01:25,780 --> 00:01:27,100 which is this one. 21 00:01:27,970 --> 00:01:30,070 Let me come down here. 22 00:01:30,100 --> 00:01:31,540 Which is this? 23 00:01:32,350 --> 00:01:36,250 Use this script here to start my ad application. 24 00:01:37,190 --> 00:01:39,020 All right, So let's have some patience. 25 00:01:39,020 --> 00:01:41,000 For the first time you run. 26 00:01:41,300 --> 00:01:43,870 You're going to take a little bit longer than before. 27 00:01:43,880 --> 00:01:48,410 But after our first run in time, you want to run that application again. 28 00:01:48,500 --> 00:01:49,620 It's going to be faster. 29 00:01:49,640 --> 00:01:51,620 So let's have some patience. 30 00:01:51,650 --> 00:01:55,640 While it is starting our React application. 31 00:01:56,530 --> 00:01:57,670 All right, cool. 32 00:01:57,700 --> 00:01:58,480 See that? 33 00:01:58,480 --> 00:02:03,310 It has finish and a half a message called Compiled successfully. 34 00:02:03,310 --> 00:02:13,330 And you cannot view the name of our project in the browser by visiting local host semicolon 3000 or 35 00:02:13,360 --> 00:02:14,470 a network. 36 00:02:14,470 --> 00:02:21,190 This you are l if you installed react using the node package manager. 37 00:02:21,190 --> 00:02:22,390 That's NPM. 38 00:02:22,390 --> 00:02:28,810 You can start your application using the PM like we said, and this is going to start a development 39 00:02:28,810 --> 00:02:37,630 server where we can access your app at HTTP semicolon slash slash localhost 3000 as we see here. 40 00:02:38,110 --> 00:02:47,110 So it's supposed to open for us automatically and my has been open here. 41 00:02:47,140 --> 00:02:54,520 So let me bring it back here and we see that I have my React application being installed. 42 00:02:54,850 --> 00:02:56,050 So let me refresh it. 43 00:02:56,050 --> 00:03:00,700 And now I have my react and see that it's running on a port. 44 00:03:00,700 --> 00:03:06,310 Look at host Semicolon 3000 that is by default. 45 00:03:06,340 --> 00:03:09,340 Or better still, we can copy this one. 46 00:03:09,760 --> 00:03:10,240 Copy. 47 00:03:10,240 --> 00:03:11,020 It's. 48 00:03:11,970 --> 00:03:15,990 And then let's head to our browser and then paste it. 49 00:03:15,990 --> 00:03:19,590 And I have my React application. 50 00:03:20,070 --> 00:03:23,640 So how can we stop it Now our server is running. 51 00:03:24,090 --> 00:03:32,850 So how can we stop it and we can stop it using this command control plus C on all operating system, 52 00:03:32,850 --> 00:03:35,010 whether on Mac or Windows. 53 00:03:35,220 --> 00:03:45,180 So on my terminal or what I need is I need to press control plus C and now my server has shut down so 54 00:03:45,180 --> 00:03:47,100 that I'm back to my folder. 55 00:03:47,460 --> 00:03:57,060 So if I refresh the application now you see that this server cannot be reached because my React server 56 00:03:57,060 --> 00:04:06,390 or application is no more running so I can run it back again using NPM start or yarn start and going 57 00:04:06,390 --> 00:04:08,400 to start my server again. 58 00:04:08,820 --> 00:04:17,040 So that is how we're able to start and stop your react application.