1 00:00:00,260 --> 00:00:02,720 In this video, we'll be wrapping up this chapter 2 00:00:02,720 --> 00:00:05,220 by testing out our weather feature. 3 00:00:05,220 --> 00:00:06,700 First you need to make sure that you have 4 00:00:06,700 --> 00:00:08,300 saved all your files. 5 00:00:08,300 --> 00:00:09,920 All the files that you've worked in. 6 00:00:09,920 --> 00:00:11,240 And also make sure that you're running the 7 00:00:11,240 --> 00:00:13,040 updated versions of the frontend and backend 8 00:00:13,040 --> 00:00:13,940 code. 9 00:00:13,940 --> 00:00:15,660 So let us ensure that. 10 00:00:15,660 --> 00:00:19,240 First let us bring up our backend server once 11 00:00:19,240 --> 00:00:21,020 again. 12 00:00:21,020 --> 00:00:22,880 That's working fine. 13 00:00:22,880 --> 00:00:25,480 Our frontend server is still on, can still 14 00:00:25,480 --> 00:00:26,800 serve us. 15 00:00:26,800 --> 00:00:28,180 So we just need to head over to our browser 16 00:00:28,180 --> 00:00:31,560 and commence our tests. 17 00:00:31,560 --> 00:00:33,340 Now back in the browser, we have our previous 18 00:00:33,340 --> 00:00:35,380 search, which was the image search. 19 00:00:35,380 --> 00:00:38,400 Let us refresh this application once again 20 00:00:38,400 --> 00:00:39,940 to make sure that our changes have kicked 21 00:00:39,940 --> 00:00:41,060 in. 22 00:00:41,060 --> 00:00:42,740 And now I'm just going to be doing our Paris 23 00:00:42,740 --> 00:00:48,700 search once again from the text search section. 24 00:00:48,700 --> 00:00:52,580 It gets suggestions to get some destinations. 25 00:00:52,580 --> 00:00:54,640 We have our destinations coming in. 26 00:00:54,640 --> 00:00:56,520 But we've seen all this before, that's not 27 00:00:56,520 --> 00:00:57,340 why we're here. 28 00:00:57,340 --> 00:01:00,460 We are here for the Check Weather button. 29 00:01:00,460 --> 00:01:01,400 So let us click that. 30 00:01:01,400 --> 00:01:06,020 Let us click for Giverny and see what we get. 31 00:01:06,020 --> 00:01:08,520 So we're getting that. 32 00:01:08,520 --> 00:01:10,960 Probably have some things to fix up in the 33 00:01:10,960 --> 00:01:12,000 loading section, 34 00:01:12,000 --> 00:01:14,460 but yeah, we have our weather information. 35 00:01:14,460 --> 00:01:17,660 Giverny, 65 degrees Celsius, fair weather. 36 00:01:17,660 --> 00:01:20,160 Humidity is 79%. 37 00:01:20,160 --> 00:01:23,200 Wind speed is seven miles per hour. 38 00:01:23,200 --> 00:01:25,640 Now the AI insight that we get back is that 39 00:01:25,640 --> 00:01:28,000 the weather in Giverny is currently fair with 40 00:01:28,000 --> 00:01:30,180 a temperature of 65°C. 41 00:01:30,180 --> 00:01:32,700 Humidity and wind speed information is here, 42 00:01:32,700 --> 00:01:33,520 is advisable to 43 00:01:33,520 --> 00:01:36,320 stay hydrated and wear light clothing if you 44 00:01:36,320 --> 00:01:37,720 plan to explore the gardens. 45 00:01:37,720 --> 00:01:39,760 Pack sunscreen and a hat to protect yourself 46 00:01:39,760 --> 00:01:41,600 from the sun. 47 00:01:41,600 --> 00:01:43,820 Now before we do our next test, let me check 48 00:01:43,820 --> 00:01:47,640 the loading indicator that was a bit buggy 49 00:01:47,640 --> 00:01:51,300 and see where we missed something. 50 00:01:51,300 --> 00:01:53,920 Now back in VS Code, let me close out of this. 51 00:01:53,920 --> 00:01:57,940 Let's go to that indicator, it's around here. 52 00:01:57,940 --> 00:02:00,820 Yeah, let us see what we missed. 53 00:02:00,820 --> 00:02:03,140 So after checking for a few seconds, 54 00:02:03,140 --> 00:02:05,680 I noticed that we're not closing this div. 55 00:02:05,680 --> 00:02:06,920 So I think that's where our bug is coming 56 00:02:06,920 --> 00:02:07,260 from. 57 00:02:07,260 --> 00:02:08,460 So let's close that. 58 00:02:08,460 --> 00:02:09,680 Let's make sure that other elements 59 00:02:09,680 --> 00:02:11,860 are closed appropriately also. 60 00:02:11,860 --> 00:02:13,040 Good. 61 00:02:13,040 --> 00:02:14,980 Now let's head back to our browser and try 62 00:02:14,980 --> 00:02:16,800 once again. 63 00:02:16,800 --> 00:02:18,460 Now before we run this application once again, 64 00:02:18,460 --> 00:02:21,400 note that Giovanni gave us 65°C, the humidity 65 00:02:21,400 --> 00:02:24,160 was 79% and the wind speed was several miles 66 00:02:24,160 --> 00:02:25,400 per hour. 67 00:02:25,400 --> 00:02:26,820 We're going to be checking to see that the 68 00:02:26,820 --> 00:02:30,500 next query does not display the same values. 69 00:02:30,500 --> 00:02:32,660 So first, I'm going to click out of this, 70 00:02:32,660 --> 00:02:36,000 refresh the page, do our Paris search once 71 00:02:36,000 --> 00:02:38,600 again. 72 00:02:38,600 --> 00:02:40,280 We have some new results. 73 00:02:40,280 --> 00:02:43,560 Now let us check Chautier de Chantilly. 74 00:02:43,560 --> 00:02:45,480 Hope I'm pronouncing that correctly. 75 00:02:45,480 --> 00:02:46,560 Most likely not. 76 00:02:46,560 --> 00:02:48,720 As you check weather, and you see our weather 77 00:02:48,720 --> 00:02:50,900 loading screen shows properly now. 78 00:02:50,900 --> 00:02:52,460 Didn't have that weird bug. 79 00:02:52,460 --> 00:02:54,100 And now for this, we have a temperature of 80 00:02:54,100 --> 00:02:56,660 82 degrees Celsius, unlike the 65 we had for 81 00:02:56,660 --> 00:02:59,560 Giovanni, and humidity of 41%. 82 00:02:59,560 --> 00:03:01,900 So that just kind of shows the randomization 83 00:03:01,900 --> 00:03:04,560 logic that we wrote for our function that 84 00:03:04,560 --> 00:03:06,480 is returning the weather information. 85 00:03:06,480 --> 00:03:08,280 Like I said, in a real world scenario, you 86 00:03:08,280 --> 00:03:10,660 want to use an API like the OpenWeather API 87 00:03:10,660 --> 00:03:12,960 to query this information so you are getting 88 00:03:12,960 --> 00:03:16,560 real world information, real time, real life 89 00:03:16,560 --> 00:03:17,660 information. 90 00:03:17,660 --> 00:03:20,100 But as you can see our weather feature works 91 00:03:20,100 --> 00:03:21,360 fine and that's 92 00:03:21,360 --> 00:03:22,240 just perfect. 93 00:03:22,240 --> 00:03:24,160 We have successfully implemented a weather 94 00:03:24,160 --> 00:03:25,060 retrieval feature 95 00:03:25,060 --> 00:03:28,000 for our travel companion application.