1 00:00:00,210 --> 00:00:00,610 All right. 2 00:00:00,630 --> 00:00:07,560 So that was the global setup, and now we're inching closer to our actual setup, where what's really 3 00:00:07,560 --> 00:00:10,890 cool in action here is that we can set up the instance. 4 00:00:11,280 --> 00:00:12,390 Now how does that look like? 5 00:00:12,780 --> 00:00:16,110 Well, we grab the import, which is going to be Axios. 6 00:00:16,350 --> 00:00:18,210 Then we go dot create. 7 00:00:18,510 --> 00:00:22,110 And then you can set up a bunch of goodies over here. 8 00:00:22,350 --> 00:00:27,150 Now, if you want to find out more options, then yes, please navigate the docs. 9 00:00:27,150 --> 00:00:30,900 But in my case, I'll showcase the base URL, which you're going years. 10 00:00:31,200 --> 00:00:37,800 So essentially in the process will omit adding this API version one to all of our requests. 11 00:00:37,920 --> 00:00:41,790 Because remember, I mean, that's what the server is looking for. 12 00:00:41,940 --> 00:00:48,450 And at the moment, we have been hard coding that and also we can go here with a header just like we 13 00:00:48,450 --> 00:00:51,930 did previously here directly in the request. 14 00:00:52,020 --> 00:00:54,120 So now we set up the headers and authorization. 15 00:00:54,480 --> 00:00:58,830 And what's really nifty now notice how we can just use this off edge. 16 00:00:59,130 --> 00:01:06,120 Now what that means is that with my talk request, I don't have to send the bear token. 17 00:01:06,480 --> 00:01:11,190 So let's try to set this one up where I'm going to go back to app context. 18 00:01:11,190 --> 00:01:15,000 And yes, I will remove these ones because you have to read me. 19 00:01:15,390 --> 00:01:17,210 So you can always access them. 20 00:01:17,220 --> 00:01:18,900 So let me remove this one. 21 00:01:19,140 --> 00:01:21,030 And now it's set up that auth fetch. 22 00:01:21,480 --> 00:01:24,570 So let's go with Konst and then off fetch. 23 00:01:24,600 --> 00:01:27,030 Now that is equal to Axios. 24 00:01:27,150 --> 00:01:34,290 So the instance of create an alert and here we want to pass in the object now inside of the object, 25 00:01:34,290 --> 00:01:35,520 let's go with base URL. 26 00:01:35,790 --> 00:01:39,900 So something you want to add to all of your requests, which are going to, in my case, is going to 27 00:01:39,900 --> 00:01:42,060 be API and version one. 28 00:01:42,360 --> 00:01:48,480 And yes, as a sign up, for example, if you want to set up, I don't know a request for all the jobs, 29 00:01:49,020 --> 00:01:56,640 just go here and say jobs like so now in our case, I'll be adding to both to the update one as well 30 00:01:56,640 --> 00:01:57,450 as the jobs one. 31 00:01:57,460 --> 00:02:01,800 So I'm not going to do that, but it's definitely an option if we want to go with comma. 32 00:02:02,040 --> 00:02:03,930 And then let's set up the headers. 33 00:02:04,710 --> 00:02:10,710 So we're going to go here and we'll pass in the authorization again authorization. 34 00:02:11,280 --> 00:02:11,880 My apologies. 35 00:02:11,880 --> 00:02:15,960 Yes, I'm pretty bad with those type of words, for example, authorization. 36 00:02:15,960 --> 00:02:19,290 So I do need to repeat it quite a few times while I'm recording. 37 00:02:19,650 --> 00:02:21,120 So bear over here. 38 00:02:21,330 --> 00:02:26,430 And then let's also grab the token state and then token. 39 00:02:26,670 --> 00:02:34,200 And once we have this one in place, let's keep on scrolling and where I have the update user instead 40 00:02:34,200 --> 00:02:42,030 of using Axios now, I want to go with what I want to go with or fetch, and I'll purposely leave this 41 00:02:42,030 --> 00:02:43,590 one as the Axios one. 42 00:02:43,860 --> 00:02:50,670 And what you'll note is that if we go back again to our browser and I'm going to go back to John in 43 00:02:50,670 --> 00:02:53,010 this case, what's really, really cool? 44 00:02:53,190 --> 00:02:57,060 Well, first of all, it's going to say update user and cannot find. 45 00:02:57,510 --> 00:03:00,990 Sure, let's troubleshoot together what I have off fetch. 46 00:03:01,230 --> 00:03:02,070 And yes, of course. 47 00:03:02,370 --> 00:03:07,620 So notice how I added the API in version one and then I kept it over here. 48 00:03:07,980 --> 00:03:14,670 So now, since it is my base, you can actually test that out over here where you can see the Iraq correct. 49 00:03:15,060 --> 00:03:19,770 So we have this API version one API, version one and then off and that user. 50 00:03:20,200 --> 00:03:25,350 And as a very, very quick sign on since I've been getting this question in my node course. 51 00:03:25,530 --> 00:03:31,530 So some students have been asking why this one goes to localhost 3000, not 5000. 52 00:03:31,890 --> 00:03:37,800 Well, when we need to keep in mind is that when we set up the proxy, it's not like we are changing 53 00:03:37,800 --> 00:03:39,360 the entire setup. 54 00:03:40,320 --> 00:03:44,310 Meaning that proxy just adds some fullbacks. 55 00:03:44,640 --> 00:03:48,210 So in this case, we're still making a request to 3000. 56 00:03:48,690 --> 00:03:56,190 But then if we cannot get that resource, then we try out, Hey, is there something on the local host 57 00:03:56,190 --> 00:03:57,450 5000 or whatever? 58 00:03:57,450 --> 00:03:58,380 We set up the proxy? 59 00:03:58,710 --> 00:03:59,670 Hopefully, that is clear. 60 00:03:59,670 --> 00:04:04,110 And now let me fix my tiny bug over here, where our more this one. 61 00:04:05,610 --> 00:04:07,470 And then let's do it one more time. 62 00:04:07,770 --> 00:04:09,030 I'm just going to leave it as Peter. 63 00:04:09,360 --> 00:04:10,690 And then let's send it. 64 00:04:10,710 --> 00:04:13,740 And now in order something where update users 200. 65 00:04:14,130 --> 00:04:18,690 So I don't think I have to showcase that that barrier token is present over there. 66 00:04:18,690 --> 00:04:21,690 But if you take a look at the React Thoughts Project one. 67 00:04:22,170 --> 00:04:26,940 And if we keep on scrolling, the Birtukan is nowhere to be found. 68 00:04:27,440 --> 00:04:31,620 And that's exactly what I want as far as making my request. 69 00:04:31,950 --> 00:04:38,040 Because again, I know I said this already in the previous video, but the last thing you want is just 70 00:04:38,040 --> 00:04:42,090 start standing out your tokens left and right. 71 00:04:42,480 --> 00:04:47,400 And now that's how we can set up a instance using access library.