WEBVTT 00:02.760 --> 00:08.910 The last piece of code that we need to write for an application before compile need for production is 00:08.910 --> 00:11.590 needed to provide an application. 00:11.630 --> 00:14.460 The ability to manage wrong you address. 00:14.460 --> 00:21.010 So for example in this case we know that we can create a new question by going on as Lesh asking. 00:21.240 --> 00:27.720 But what if we just go to slash as as you see the pages no empty. 00:27.720 --> 00:30.630 And that's because in their root there Dr. J. 00:30.630 --> 00:31.450 Yes file. 00:31.470 --> 00:36.930 There is no route specified to actually serve that specific path. 00:36.990 --> 00:41.610 And so here below we can create one last route. 00:41.670 --> 00:43.130 We've path. 00:43.710 --> 00:47.830 And here we can add an asterisk and n is a name. 00:48.090 --> 00:49.110 We can set. 00:49.170 --> 00:55.580 Page not found and there's a component just to show our way. 00:55.590 --> 01:01.420 But if it works we can add the home component. 01:01.640 --> 01:09.350 So let's go back here and if we now try to navigate once again to these as path we are now redirected 01:09.410 --> 01:11.330 you see to the home component. 01:11.330 --> 01:14.780 Basically this was of course just an example. 01:14.780 --> 01:21.600 Let's now create an appropriate component not found dot view. 01:21.600 --> 01:23.470 And now we can imported Yeah. 01:23.550 --> 01:25.060 A route that GSA. 01:25.530 --> 01:28.980 So I'm just going to copy the code and just paste it. 01:29.490 --> 01:29.910 Yeah. 01:30.570 --> 01:37.170 So import not found from the view's not found don't view and we can pass it. 01:37.530 --> 01:38.310 Yeah. 01:38.310 --> 01:46.460 So let's now develop this component template and yet inside as always diva we can also add this USS 01:46.530 --> 01:49.630 Glasser not found. 01:50.200 --> 01:55.980 Let's add another diva glass container and a bit of margin 01:58.740 --> 02:08.480 and yet we can now use an H to again to show what message we can do and define in this creep tag. 02:08.480 --> 02:14.890 So a script name not found 02:17.370 --> 02:18.750 data. 02:19.260 --> 02:23.400 The third message for 0 4. 02:23.410 --> 02:26.970 Page Not Found. 02:27.010 --> 02:32.200 We can also idea an idea not found and added below. 02:32.200 --> 02:41.880 Let's define a style tag and well actually let's remove this hyphen so that we can use the idea like 02:41.890 --> 02:48.720 song color red text align center. 02:49.200 --> 02:56.860 And so if you now go back here let's try to create a new question and let's change the umbrella once 02:56.860 --> 02:58.550 again to assume. 02:59.050 --> 03:01.740 Awesome we know good photo for Page Not Found. 03:01.750 --> 03:04.060 Everything works as expected. 03:04.060 --> 03:11.870 So as long as the U.S. red requested is not air defined as a path as a proper path in the route that 03:11.870 --> 03:12.360 a Delta G. 03:12.370 --> 03:18.010 Yes file viewer Luther Wheeler redirected the request to the not found component. 03:18.010 --> 03:19.630 However this is not enough. 03:20.110 --> 03:26.030 Let's try to open a question and let's try to use it wrong as luck. 03:26.070 --> 03:31.110 Like so you see that this is the question component because we have posted by. 03:31.120 --> 03:39.550 We have answered the question and if we expect the application here we see the 4 0 4 message not found 03:39.670 --> 03:46.180 of course but in view dev tools we still have the question components you see. 03:46.350 --> 03:54.060 So we need to change the way our application gets the data and also the way the age TTP requests are 03:54.060 --> 03:54.960 handled. 03:54.960 --> 03:58.740 So first of all let's go to common API set of these three. 03:58.740 --> 03:59.260 Yes sir. 03:59.610 --> 04:03.140 And yeah I see first of all that we don't need this a scene. 04:03.460 --> 04:07.830 And we can change the name of a function to handle response 04:11.150 --> 04:12.070 like so. 04:12.080 --> 04:20.110 So if they start whose code is 2 0 4 we just want to return an empty string. 04:20.180 --> 04:30.710 Else if a response dot status is for 0 4 not found in that case we want to return new low. 04:30.740 --> 04:42.250 Otherwise we can just return response not Jason and you are like it is three equal signs like so. 04:42.520 --> 04:44.340 However this is not in our film. 04:44.410 --> 04:53.260 So let's go back to the question that you component specifically in there get question data method so 04:53.800 --> 04:56.920 we can check if we actually get data. 04:56.950 --> 05:12.720 So if data in that case everything should work as always so we could either push the user to these root 05:13.470 --> 05:14.630 or even better. 05:14.820 --> 05:25.180 We can set these that question to a new low and said these DOT said Page data also called that said 05:25.210 --> 05:36.650 Page Title method to set the title of the page to photo for page not found and now appear in this deed 05:36.880 --> 05:42.340 of class contain it we can add the veep if question. 05:42.430 --> 05:49.950 So all the h the email code for the component as to be shown if we actually get a question otherwise 05:51.360 --> 05:59.110 below we can define another diva V as endearing side we can define and each one are very similar to 05:59.110 --> 06:00.520 the one defined yet. 06:00.730 --> 06:09.620 Ah well actually almost the same each one had to we can simply add for 0 4. 06:09.650 --> 06:14.760 Page not found or even better question. 06:14.780 --> 06:15.580 Not found. 06:15.630 --> 06:19.880 And just to optimize the component of it more the effect. 06:22.020 --> 06:22.940 QUESTION. 06:23.130 --> 06:32.340 SO LET'S GO BACK HERE AND LET'S MAKE ANOTHER Geth request using these same urinal and we get for a question 06:32.430 --> 06:33.210 not found. 06:33.210 --> 06:34.380 Very good. 06:34.530 --> 06:41.770 Just to be precise this tiling of course is zero because we have not included code. 06:41.790 --> 06:50.290 Yeah that we can actually add so we can simply define the same code here below. 06:50.400 --> 06:52.930 Oh well in fact we have the error class. 06:53.240 --> 06:55.050 So let's go back here. 06:56.790 --> 07:05.990 So we can just add class header text Center going back here. 07:06.050 --> 07:07.370 It's now even better. 07:07.430 --> 07:08.380 Awesome. 07:08.420 --> 07:13.580 Now we have a single page up is finally completed on the javascript code is being written. 07:13.640 --> 07:18.650 It's finally time to learn how to compile the whole application for a production and we are going to 07:18.650 --> 07:20.060 do so in the next lesson.