WEBVTT 00:00.390 --> 00:05.400 Now, as far as the organization of our project and deciding where it is that we move next, I think 00:05.400 --> 00:11.180 a really great way to take an existing project and add an API to it is look at the existing projects. 00:11.190 --> 00:12.480 You are El's, for example. 00:12.480 --> 00:17.430 If I go to the Urals, that pie here, you can see this is about everything that the Web site can do. 00:17.460 --> 00:23.280 Now, we're not going to do an API for the admen, but we do want auth stuff and we do want all of these 00:23.280 --> 00:24.120 to do things. 00:24.750 --> 00:29.130 And so this can be a really nice way to come here and say, OK, what thing do we want to check off 00:29.150 --> 00:29.480 first? 00:29.690 --> 00:30.060 First. 00:30.060 --> 00:31.980 And I want to start as simple as possible. 00:32.280 --> 00:36.880 Let's first just work on being able to show completed to DOS. 00:36.960 --> 00:37.170 Right. 00:37.200 --> 00:39.570 We want to replace what's happening here. 00:39.810 --> 00:47.670 So step number one is if someone wants to go to our API slash completed to see all the completed to 00:47.670 --> 00:48.120 DOS. 00:48.600 --> 00:50.850 Well, you know, we've got to create a U. 00:50.850 --> 00:51.510 RL for that. 00:51.510 --> 00:52.050 So let's go ahead. 00:52.050 --> 00:53.570 Move over to the Urals dot pie. 00:53.600 --> 00:56.070 That's inside of the API folder. 00:56.850 --> 01:02.100 And the first thing that we've got to do is remember that with the Urals file, you got to have a U. 01:02.100 --> 01:07.880 URL patterns, which is equal to an array or a list in Python. 01:07.890 --> 01:13.200 I'm thinking of other programming languages here and inside of the are old patterns. 01:13.200 --> 01:15.480 This is where you provide all the different paths. 01:15.630 --> 01:18.480 So in order to use path, we've got to import that. 01:18.480 --> 01:24.780 So I'm going to say from Django dot your El's import. 01:25.860 --> 01:27.350 And I want to import path. 01:29.140 --> 01:29.530 Great. 01:29.830 --> 01:36.130 So now I can take this tab over and say, let's do a path for when someone wants to see a completed 01:36.130 --> 01:36.580 to do. 01:37.300 --> 01:43.960 Now, when we're talking about the API here, I think a good way to work with API is, is to have names 01:44.020 --> 01:47.200 for the different models or resources that people are trying to get to. 01:47.560 --> 01:51.580 So, for example, if someone is just trying to list out, you know, the current to DOS, I think a 01:51.580 --> 01:55.700 really good path through that is just to dos like this. 01:55.720 --> 01:59.620 And if they want to see the completed ones, I think kind of a good way to distinguish that is to add 01:59.620 --> 02:01.570 a slash completed. 02:02.020 --> 02:07.570 Now the total path here, if someone wanted to see the completed to DOS, it's going to be, you know, 02:07.600 --> 02:11.320 our site slash API slash to slash completed. 02:11.710 --> 02:11.950 Right. 02:11.980 --> 02:15.370 Because it's first going to come here, say, oh, they have an API. 02:15.400 --> 02:16.990 So I'm going to move them to this file. 02:17.350 --> 02:18.700 And then it'll come here. 02:18.940 --> 02:21.700 Okay, so we've got that part down now. 02:21.700 --> 02:25.180 We need to say, you know, what view are we going to pass this on to? 02:25.210 --> 02:26.980 Which means we've got to import the views here. 02:26.980 --> 02:31.680 So let's say from DOT import views. 02:32.260 --> 02:32.610 Right. 02:33.520 --> 02:41.380 And then I'm going to take our views and we need to create a new class based view here. 02:41.560 --> 02:44.800 So we're gonna go ahead, move over to our views. 02:45.880 --> 02:47.440 And let's make that now. 02:47.470 --> 02:51.040 With this, we're gonna have to import again some of the Gengel rest framework here. 02:51.040 --> 02:53.230 In this particular case, it's the generics. 02:53.650 --> 02:55.750 So up here at the top, we can get rid of this render. 02:55.750 --> 02:56.770 We're not going to be using this. 02:56.800 --> 02:57.910 This is an API. 02:58.000 --> 02:59.630 We don't have to send back each email. 03:00.190 --> 03:06.580 So what we're gonna do is we're gonna save from Rest. underscore framework. 03:07.600 --> 03:11.950 We want to import and this is where we want generics. 03:13.920 --> 03:14.310 Great. 03:14.640 --> 03:19.050 So now that we have that in place, we can create our very first view here. 03:19.200 --> 03:22.010 So this is for the completed to do items. 03:22.020 --> 03:23.000 We're going to be listen out. 03:23.010 --> 03:24.750 So let's just say class. 03:25.380 --> 03:27.030 Let's call this to do. 03:28.090 --> 03:28.960 Completed. 03:30.280 --> 03:30.830 List. 03:30.940 --> 03:35.650 I think that sort of describes what's going on here inside of the parentheses, we want to pass the 03:35.650 --> 03:43.780 generics that we just imported and then we're going to do dot capital list all caps, API capital view. 03:44.410 --> 03:49.090 OK, so now that we've got this here, we've got to talk about, you know, the different pieces. 03:49.120 --> 03:54.410 But before we dive too close up to this, let's go ahead and copy the name that we have here. 03:54.430 --> 03:56.110 This is what we were looking for in the URLs. 03:56.110 --> 03:57.440 That pie paste that in. 03:57.460 --> 04:02.830 And then do a dot as underscore view with the parentheses there. 04:02.890 --> 04:06.190 And then we'll add the trailing comma, save that file. 04:06.370 --> 04:08.910 So at least we have things to the point. 04:08.920 --> 04:16.060 Now, if someone comes to API slash to do slash completed, we're going to then send them to this particular 04:16.060 --> 04:17.620 class inside of our views. 04:17.740 --> 04:20.680 So let's go ahead and move back over there. 04:21.140 --> 04:26.020 So remember, with the Django rest framework, when we are going to be listing out something, we have 04:26.020 --> 04:29.200 to specialize what serializer class we're gonna be working with. 04:29.690 --> 04:31.090 So I'm going to say serial. 04:32.150 --> 04:35.100 Isar underscore class. 04:35.180 --> 04:39.620 And we need to set this equal to something, which means we need to create a serializer. 04:40.010 --> 04:41.090 So let's go ahead and right. 04:41.090 --> 04:42.460 Click on this API folder. 04:42.470 --> 04:43.550 We want a new file. 04:44.360 --> 04:45.620 We're going to call this one. 04:46.050 --> 04:47.360 These serializer is. 04:48.680 --> 04:51.970 Serializer is pi k now. 04:52.070 --> 04:55.040 Inside of our serializer dot pi. 04:55.470 --> 04:58.190 I've got to again import some code from the Jinkx jingle. 04:58.190 --> 05:06.950 Rest frameworks are going to do rest, underscore framework import and then we want serializer is with 05:06.950 --> 05:07.590 an S. 05:09.110 --> 05:12.860 And then we're gonna what we're gonna do is make our first serializer. 05:12.860 --> 05:19.460 We need one to represent D to do model so that to do model does not live inside of our API app, it 05:19.460 --> 05:20.990 lives inside of the to do app. 05:21.020 --> 05:24.980 If we go click on the models, that pie here you can see, oh OK. 05:25.070 --> 05:30.980 You know this is what makes up it to do to dial a title Memmo created date completed important in user. 05:31.430 --> 05:31.820 Awesome. 05:32.000 --> 05:34.730 OK, so let's go ahead and make sure that we import this. 05:34.730 --> 05:41.870 I'm going to go back to my serializer dot pi and I'm going to do a from to do the name of that app DOT 05:42.110 --> 05:42.860 models. 05:44.850 --> 05:48.990 I want to import capital to do just like that. 05:49.830 --> 05:53.340 So now that we have this in place, we can go ahead and create our serializer. 05:53.340 --> 05:58.110 So we're going to say class and let's just call this the straight up to do. 05:59.900 --> 06:01.510 Serial iser. 06:02.580 --> 06:02.850 OK. 06:03.620 --> 06:09.620 Inside of here, we want the serializer as dot model, serial. 06:11.450 --> 06:12.120 Iser. 06:13.490 --> 06:14.670 Let's do the colon there. 06:15.200 --> 06:20.420 And with this, remember, we have to specify what things we're looking for, something to say, Class 06:21.260 --> 06:21.710 Medha. 06:22.890 --> 06:28.190 And the model in this case is the to do that, we just importers are going to say models equal to. 06:28.290 --> 06:32.360 To do loops that want to leave it, to do comment. 06:32.620 --> 06:35.340 So make sure that's got the capital t like what we're looking for. 06:35.880 --> 06:38.400 And then we have to specify what fields we're looking for. 06:38.430 --> 06:41.460 So I'm going to do fields here again. 06:41.490 --> 06:48.780 I think a really nice and easy way to do this is to go over to our model and just copy all this code 06:48.780 --> 06:49.140 here. 06:50.120 --> 06:56.130 Come back and paste it and we can sort of use this as a reference, so we want to always start first 06:56.130 --> 07:02.220 with I.D. and then after that I'm going to copy the title, paste that sucker in. 07:03.050 --> 07:05.010 Go ahead and grab the memo. 07:07.540 --> 07:08.810 A created. 07:13.100 --> 07:14.870 We want the date completed. 07:16.750 --> 07:19.470 So you were just moving down the line here and we want. 07:19.520 --> 07:22.920 Important now in this particular case. 07:22.950 --> 07:28.290 We do not need the user because only a user can access their own to DOS. 07:28.660 --> 07:33.750 That's a big part of this app here, is that, you know, if someone makes it to do that's personal 07:33.750 --> 07:36.790 to them, we should not let other users see what that is. 07:36.810 --> 07:41.970 And so we should at no point need to pass that back via the API because they should be only able to 07:41.970 --> 07:48.780 access information for the API for things that they themselves have created so we can go ahead and delete 07:48.840 --> 07:49.190 all that. 07:49.200 --> 07:51.000 There were not can include the user. 07:51.450 --> 07:55.920 The one thing that we do want to mention here is that the field created in date completed. 07:56.400 --> 08:03.300 This should never be able to be set by the user created just happens when the to do object is created. 08:03.330 --> 08:05.560 Django automatically timestamps it for us. 08:05.640 --> 08:10.900 And then the date completed that is set specially when someone says I have completed this thing. 08:10.920 --> 08:15.120 That's not something that someone should be able to edit later via the API. 08:15.270 --> 08:19.980 So for both of those fields, we want to make sure that we specify that those are read only fields. 08:20.370 --> 08:21.930 So we're just going to type the name of these. 08:21.930 --> 08:24.030 For example, we're going to say created. 08:25.050 --> 08:28.830 Is equal to our serializer dot capital. 08:28.870 --> 08:30.750 Read capital. 08:30.830 --> 08:33.180 Only then capital field. 08:33.490 --> 08:33.680 OK. 08:34.330 --> 08:37.970 And we want almost the exact same thing for the date completed. 08:37.980 --> 08:44.370 So let's just copy and paste this line and then we're gonna take our date completed and paste that in 08:44.370 --> 08:44.640 there. 08:45.390 --> 08:51.300 OK, so now that we've done this, we have a functioning serializer that we can use. 08:51.360 --> 08:53.010 I'm going to go ahead and save this. 08:53.550 --> 08:55.090 Move back to our views. 08:55.140 --> 09:00.000 Man, you'll you'll see we were just inching our way here that eventually we're gonna be able to list 09:00.000 --> 09:01.200 out the completed to DOS. 09:01.740 --> 09:08.280 So now that we're back inside of the views, we've got to import that serializer that we had just created. 09:08.370 --> 09:09.600 So let's go ahead. 09:09.640 --> 09:12.540 Ensay from DOT. 09:12.900 --> 09:19.860 Serializer is import and this is where we want to to do serializer. 09:20.130 --> 09:20.580 There it is. 09:20.640 --> 09:23.810 Thank you, Adam, for the autumn autocomplete there. 09:24.240 --> 09:31.040 And then we'll say, OK, the serializer class that we're looking for is the to do serializer. 09:31.410 --> 09:31.800 Perfect. 09:32.310 --> 09:38.130 Now, really, the last step that we have here is that we want to make sure that when someone is accessing 09:38.130 --> 09:43.170 this API that they are logged in and that we're only getting objects for that logged in user now to 09:43.170 --> 09:44.730 make sure that someone is logged in. 09:45.150 --> 09:52.770 We can say, OK, the permission class on this permission underscore class plus. 09:53.950 --> 09:55.030 Permission. 09:55.480 --> 09:56.170 There we go. 09:56.230 --> 10:02.600 Class is equal to an inside of the list here, we want permissions. 10:04.090 --> 10:05.860 Which we are going to have to import. 10:06.070 --> 10:09.190 So go ahead and move back to the top here. 10:09.280 --> 10:12.460 After generics, we want to import permissions. 10:13.770 --> 10:17.880 OK, so then we're going to come back down here and say that we want the permissions. 10:17.910 --> 10:20.760 That is authenticated. 10:24.060 --> 10:28.980 So that makes sure that, you know, anyone that's going to be able to list out the completed to DOS 10:29.070 --> 10:30.370 is a signed end user. 10:30.390 --> 10:34.860 And then on top of that, we've got to make sure that they're only get the getting the tattoos that 10:34.860 --> 10:36.090 are relevant to them. 10:36.300 --> 10:38.750 So we've got to define the query sets. 10:38.760 --> 10:40.560 We're going to say new function here. 10:41.070 --> 10:46.290 Def get underscore query set and make sure that you spell this. 10:46.290 --> 10:46.890 Exactly. 10:46.890 --> 10:52.000 Get underscore query set because this is the special name that the Jenko rest frame will framework will 10:52.020 --> 10:53.130 look look for. 10:53.640 --> 10:55.800 Let's pass in self with the colon. 10:56.340 --> 10:58.890 And first we want to get the user object. 10:59.250 --> 11:05.130 So we're going to say user is equal to self dot request dot user. 11:05.400 --> 11:08.070 That's how we know who's looking here. 11:08.130 --> 11:09.450 We want that to be a lower case. 11:09.450 --> 11:16.200 You then we need to go get D to do objects that are connected to this user and have been completed. 11:16.560 --> 11:22.880 So we're gonna do our capital to do which we need to import this as well. 11:22.890 --> 11:31.440 So make sure with this one that you do from two do dot models and then import the capital to do. 11:31.870 --> 11:38.790 OK, so are going to say to do the objects dot and then this is where we want to say filter. 11:39.150 --> 11:44.550 Now the big one here is to make sure that user is equal to user that we just pulled here. 11:44.550 --> 11:44.790 Right. 11:44.790 --> 11:46.620 To say, you know D should be connected there. 11:47.010 --> 11:50.100 The other one is we want to make sure that we get the completed items. 11:50.430 --> 11:51.720 So here we're gonna say. 11:51.790 --> 11:53.660 Date completed. 11:54.740 --> 12:00.650 Underscore, underscore is null and set this equal to false. 12:00.980 --> 12:03.740 So this way it says, all right. 12:03.770 --> 12:09.890 Give me back all the to DOS connected to this user and ones where there is some value inside of the 12:09.890 --> 12:10.730 date completed. 12:10.820 --> 12:14.780 That's how we incited the to do app have decided to find those completed objects. 12:15.140 --> 12:19.310 In fact, a lot of the code that we'll be using here is a lot of the same code that you'll find inside 12:19.310 --> 12:22.050 of the used up high inside of the to do weps. 12:22.280 --> 12:27.860 For example, if we go scroll down to where we get the completed tatoos here, you can see we've got 12:27.860 --> 12:31.700 the same user is equal to the requests dot user and date completed. 12:31.700 --> 12:33.440 Underscore is known as equal to false. 12:33.440 --> 12:33.790 Right. 12:34.190 --> 12:35.150 We've got all that stuff. 12:35.150 --> 12:36.590 And in fact, look, here's a little bonus. 12:36.620 --> 12:38.350 Let's make sure that we order these by. 12:38.720 --> 12:40.730 Which ones have been completed soonest. 12:40.850 --> 12:41.020 OK. 12:41.240 --> 12:42.470 So we'll go ahead and copy that. 12:43.370 --> 12:43.820 Come in. 12:43.820 --> 12:44.830 Pace that there. 12:45.290 --> 12:50.420 And then we need to make sure that we return what this query gets us. 12:50.580 --> 12:50.740 OK. 12:51.500 --> 12:56.240 So I hope that we've gone so many places here, but we're getting really close. 12:56.250 --> 12:57.830 So let's go ahead and save this. 12:58.190 --> 13:03.230 We now should have the ability to go to the API slash Tudou slash completed. 13:03.650 --> 13:05.930 This is the first time we're finally testing our code. 13:05.960 --> 13:10.340 It took a little bit of time to get up and running, but it's all gonna be worth it here. 13:10.340 --> 13:12.680 So let's make sure that we get our server running. 13:13.010 --> 13:16.700 So Python three managed up pie run server. 13:18.620 --> 13:19.820 So that's up and running. 13:20.480 --> 13:24.560 Let's go ahead, you can see currently we have you know, we can see the completed stuff, so it should 13:24.560 --> 13:26.360 be showing by cheese and our API. 13:26.400 --> 13:33.890 But let's go to our Web site, slash API slash to dos slash completed. 13:34.660 --> 13:40.280 OK, so once you come here, you see a very familiar face in the API here. 13:40.700 --> 13:42.140 And look at this. 13:42.560 --> 13:45.140 It has all of our information here. 13:45.140 --> 13:51.860 It's got, you know, the buy cheese, get enough for three pizzas, all of this good stuff, except 13:51.860 --> 13:54.110 that this is not what we're looking for. 13:54.110 --> 13:56.080 Is that the one that we completed now? 13:56.150 --> 13:57.560 That is the one that we completed. 13:58.930 --> 13:59.590 So, OK. 13:59.690 --> 14:01.100 I thought it was the other one. 14:01.850 --> 14:03.380 But this is correct. 14:03.510 --> 14:05.360 I was just caught up for a second there. 14:05.480 --> 14:06.920 So this is great. 14:07.580 --> 14:12.590 The one thing that you'll notice here is I don't have the ability to log in and out with the API. 14:13.040 --> 14:16.310 Remember, if you do want to add that, you can do the API dash off. 14:16.370 --> 14:20.750 But the cool thing is we have a functioning Web site where people can log in and log out. 14:20.780 --> 14:27.530 So, for example, if I come here and I log out and then I try to go back to the, you know, API to 14:27.530 --> 14:31.190 DOS completed, I get this real nasty error. 14:31.220 --> 14:35.390 Now, this is because of a spelling mistake I had instead of my views that pie. 14:35.410 --> 14:38.660 So if we go back to our used up pie, I have permission class. 14:38.690 --> 14:43.010 It should be class is I should have noticed this because it was looking for a list of things. 14:43.040 --> 14:50.480 But if we go ahead and save this and now come back to this page and we reload, we get a much better, 14:50.510 --> 14:54.710 you know, four or three code saying, hey, you can provide any authentication. 14:54.770 --> 14:56.120 I can't show you this. 14:56.300 --> 14:59.910 But so we're we're glad to know that that's what's showing up. 14:59.930 --> 15:01.670 You know, if they're not signed in. 15:01.700 --> 15:05.120 But I'd like to really confirm and show you that this is working. 15:05.120 --> 15:07.970 So let's go ahead and sign back in here. 15:07.970 --> 15:11.120 So go back to our home page. 15:11.720 --> 15:14.180 And then we want to log in. 15:15.860 --> 15:20.210 Let's sign in as Nick and let's go ahead and do a password here. 15:21.810 --> 15:23.110 Let's see if I can remember it. 15:23.140 --> 15:24.310 Yes, I did. 15:24.850 --> 15:26.590 But let's go now to our API. 15:27.970 --> 15:29.590 Go to the completed and now it's showing. 15:30.010 --> 15:31.870 Give yourself a nice pat on the back. 15:32.350 --> 15:39.280 You have the ability to show and list out completed to do items just to really drive the point here. 15:39.700 --> 15:45.280 Let's go ahead and let's create another to make our. 15:46.500 --> 15:48.260 First API you URL. 15:48.730 --> 15:54.150 Okay, so we have now completed this are going to hit complete, we should be showing two completed 15:54.150 --> 15:54.840 things here. 15:55.350 --> 15:57.930 So let's go back to API slash. 15:58.080 --> 15:59.250 Oh, and look at this. 15:59.610 --> 16:00.900 We've got the things here. 16:00.900 --> 16:02.970 It's showing which ones were completed first. 16:03.660 --> 16:05.850 We are in an excellent, excellent position.