1 00:00:00,180 --> 00:00:04,290 You now have Mongoose models is set up for both users and tasks. 2 00:00:04,290 --> 00:00:10,400 You also know how to use those models to create new users and tasks storing them in the database. 3 00:00:10,410 --> 00:00:16,680 Now we're gonna have plenty more to say about customizing Mongoose and setting up relationships between 4 00:00:16,680 --> 00:00:19,350 things like users and tasks. 5 00:00:19,500 --> 00:00:25,930 But for the moment we have enough Mongoose knowledge to actually start building out the TTP end points 6 00:00:25,980 --> 00:00:33,960 necessary for the task application before we actually dive into writing code for these new TTP endpoints. 7 00:00:33,960 --> 00:00:39,330 What I want to do is go through a quick presentation which is going to give us a brief overview of how 8 00:00:39,330 --> 00:00:43,920 we'll be structuring our TTP endpoints for the task API. 9 00:00:44,070 --> 00:00:49,720 And we're also going to get a sneak peek into what exactly makes up an H TTP request. 10 00:00:49,950 --> 00:00:52,680 Let's jump right into that in this presentation. 11 00:00:52,680 --> 00:00:58,410 We're going to cover a few different topics all directly related to the rest api but to get started 12 00:00:58,440 --> 00:01:02,280 I want to define what exactly a REST API is. 13 00:01:02,370 --> 00:01:06,780 Now let's break this acronym up into its component pieces right here. 14 00:01:06,780 --> 00:01:08,820 That stands for the following. 15 00:01:08,820 --> 00:01:17,250 So rest stands for representational state transfer and API stands for application programming interface. 16 00:01:17,250 --> 00:01:22,370 Now you'll see this SHORT END TO REST API or RESTful API. 17 00:01:22,430 --> 00:01:28,140 Now to get started I want to go ahead and define what exactly an application programming interface is 18 00:01:28,590 --> 00:01:34,530 an API is nothing more than a set of tools that allow you to build software applications. 19 00:01:34,530 --> 00:01:40,060 It is a very broad term so we could say that node provides us with API eyes. 20 00:01:40,080 --> 00:01:46,500 It does things like f s enable us to build the applications we're trying to build and we could also 21 00:01:46,500 --> 00:01:53,910 say that our NPM modules like express provides us with API eyes which it does express provides us with 22 00:01:53,910 --> 00:01:58,180 a set of tools that allow us to build software applications. 23 00:01:58,230 --> 00:02:04,710 Now in this case the rest api we're creating is also going to provide a set of tools allowing others 24 00:02:04,710 --> 00:02:07,040 to build out their software. 25 00:02:07,050 --> 00:02:14,220 Now let's move on to the harder thing to define a representational state transfer the rest API allows 26 00:02:14,220 --> 00:02:21,980 clients such as a web application to access and manipulate resources using a set of predefined operations. 27 00:02:22,020 --> 00:02:23,880 So what's a resource. 28 00:02:23,880 --> 00:02:30,600 Well something like a user or a task and what's a predefined operation while a predefined operation 29 00:02:30,600 --> 00:02:37,710 for users and tasks could be something like the ability to create a new task or to mark a task as complete 30 00:02:38,070 --> 00:02:43,850 or to do something a bit more advanced like upload a profile picture for your user account. 31 00:02:43,920 --> 00:02:50,130 So these pre-defined operations are going to allow a client like a web app to go through the process 32 00:02:50,310 --> 00:02:53,910 of creating a front end for a task manager. 33 00:02:53,910 --> 00:02:58,240 Now there are three words up above representational state transfer. 34 00:02:58,260 --> 00:03:01,890 First up we have representation all with a REST API. 35 00:03:01,890 --> 00:03:07,740 We are getting and working with representations of our data so the data is stored in the database but 36 00:03:07,740 --> 00:03:14,040 using the REST API I can still fetch data I can manipulate data and I can perform all of those basic 37 00:03:14,040 --> 00:03:15,120 CRUD operations. 38 00:03:15,120 --> 00:03:20,110 So we're working with representations of our users and tasks. 39 00:03:20,120 --> 00:03:25,800 Now when it comes to state transfer a REST API the server it's stateless. 40 00:03:25,800 --> 00:03:32,010 The state has been transferred from the server to the client so each request from the client such as 41 00:03:32,010 --> 00:03:38,670 a request from a web application contains everything needed for the server to actually process that 42 00:03:38,670 --> 00:03:39,630 request. 43 00:03:39,630 --> 00:03:45,390 This includes the operation they're trying to perform all of the data the operation actually needs in 44 00:03:45,390 --> 00:03:46,340 order to work. 45 00:03:46,440 --> 00:03:52,500 And it also includes things like authentication making sure that the user who's trying to perform the 46 00:03:52,500 --> 00:03:55,540 operation is actually able to do so. 47 00:03:55,590 --> 00:03:59,780 Now all of this will make way more sense once we actually put it into practice. 48 00:03:59,850 --> 00:04:07,200 In practice the requests are gonna be made via HDTV requests so this is how a client like a web app 49 00:04:07,230 --> 00:04:10,910 is going to be able to perform those predefined operations. 50 00:04:10,920 --> 00:04:16,940 So right here we have a client and a server and the client is going to have a requirement like I need 51 00:04:16,950 --> 00:04:19,580 task data to show on this page. 52 00:04:19,710 --> 00:04:24,820 So it's going to make an H TTP request to a specific you are all on this server. 53 00:04:24,930 --> 00:04:34,070 Here I am using the get h TTP method to make a request to forward slash tasks forward slash A E A where 54 00:04:34,080 --> 00:04:40,830 this is the I.D. of the task I'm trying to fetch now in this case I'm short into the object I.D. for 55 00:04:40,830 --> 00:04:43,570 this presentation as we've seen before. 56 00:04:43,620 --> 00:04:50,160 Object ideas are a bit longer than just five characters so we make their request to the server the server 57 00:04:50,160 --> 00:04:55,740 is going to be able to go through the process of fulfilling it it's going to find the data in the database. 58 00:04:55,800 --> 00:05:02,870 In this case looking for the task by IED and it will send back as part of the TTP response. 59 00:05:02,950 --> 00:05:09,000 So right here I have a status code in this case two hundred indicating that everything went well and 60 00:05:09,000 --> 00:05:12,670 I have the Jason response with the data that was requested. 61 00:05:12,670 --> 00:05:18,130 Now you most likely know about other status codes like 4 0 4 or 4 page not found. 62 00:05:18,220 --> 00:05:24,570 And we'll explore the complete list of status codes available as we start to build out our API. 63 00:05:24,580 --> 00:05:30,100 Now these server sends the data to the client and the client can actually render things with the rest 64 00:05:30,100 --> 00:05:35,190 api though we'll be using more than just get requests to ask for data. 65 00:05:35,200 --> 00:05:39,700 We're also going to be creating data deleting data and updating data. 66 00:05:39,700 --> 00:05:46,150 So with that we still have a client and a server and we're still making an HDTV request after some need 67 00:05:46,240 --> 00:05:47,500 needs to be fulfilled. 68 00:05:47,620 --> 00:05:51,970 Something like Andrew and I need to create a to do so here. 69 00:05:51,970 --> 00:05:57,280 I'm authenticating as myself and I'm trying to perform one of our predefined operations. 70 00:05:57,310 --> 00:06:00,740 So right here I'm going to fire at the request off. 71 00:06:00,760 --> 00:06:05,170 Now at this time we're no longer using the get HDTV method. 72 00:06:05,170 --> 00:06:10,060 We're using a different method post which is used for creating data. 73 00:06:10,060 --> 00:06:15,970 So here post forward slash tasks is going to allow us to create a new task. 74 00:06:16,090 --> 00:06:21,940 And we're also sending along Jason with the request we're sending along things like the description 75 00:06:22,120 --> 00:06:27,670 which we made required in the last video and the completed status which is optional. 76 00:06:27,670 --> 00:06:33,540 Now when the server gets that it's going to authenticate making sure that we do indeed have an account. 77 00:06:33,670 --> 00:06:37,300 Then it's going to create that to do associated with us. 78 00:06:37,360 --> 00:06:41,320 And once the task has been created we'll get the response back. 79 00:06:41,440 --> 00:06:49,330 Here we are seeing a different HDTV status code to a one which signifies that a resource was created. 80 00:06:49,330 --> 00:06:54,240 And we're also getting a Jason response the new task that has been created. 81 00:06:54,310 --> 00:07:00,160 The client will eventually get the response and it'll be able to use it to signify to the user in the 82 00:07:00,220 --> 00:07:04,560 user interface that things went well and that the task was created. 83 00:07:04,600 --> 00:07:11,410 Now we'll learn more about the various H TTP methods and status codes available to us in the next slide. 84 00:07:11,410 --> 00:07:17,020 What I'd like to do is go ahead and talk about the predefined operations will typically have four our 85 00:07:17,020 --> 00:07:23,410 resources and in this case we'll talk about some of the predefined operations we're gonna have for the 86 00:07:23,410 --> 00:07:29,320 task resource in order for anyone to be able to do anything meaningful with our API. 87 00:07:29,350 --> 00:07:36,310 We need to expose the necessary set of predefined operations for things like the CRUD operations create 88 00:07:36,310 --> 00:07:38,050 read update and delete. 89 00:07:38,470 --> 00:07:45,850 So let's start with C 4 create right here I have the following allowing you to create a new task now 90 00:07:45,850 --> 00:07:51,400 every single REST API operation is defined with two pieces of data. 91 00:07:51,520 --> 00:07:54,930 The TTP method and the path. 92 00:07:54,970 --> 00:08:02,170 So in this case we are using the H TTP a post method to forward slash tasks and this is what we set 93 00:08:02,170 --> 00:08:04,660 up for creating a resource. 94 00:08:04,660 --> 00:08:07,000 Now imagine the resource changed. 95 00:08:07,010 --> 00:08:12,580 Imagine I'm working with an e-commerce Web site and I want the ability to create a new product that 96 00:08:12,580 --> 00:08:20,320 I'm selling for that I would use the post H TTP method with forward slash products where the thing that 97 00:08:20,320 --> 00:08:28,210 comes after the forward slash is the poor realised version of the resource so tasks or products or orders 98 00:08:28,390 --> 00:08:32,250 or anything else you might be working with after C for create. 99 00:08:32,260 --> 00:08:38,440 We move on to our four read and when it comes to structuring your rest api you'll typically have to 100 00:08:38,470 --> 00:08:45,400 read operations one to fetch multiple of a given resource and one to fetch a individual item like an 101 00:08:45,400 --> 00:08:47,070 individual task. 102 00:08:47,260 --> 00:08:50,070 Let's go ahead and start with the plural sized example. 103 00:08:50,080 --> 00:08:53,950 So right here we have the operation for getting all of our tasks. 104 00:08:53,950 --> 00:09:00,120 It is indeed a read operation and we're using a familiar H TTP method the get method. 105 00:09:00,160 --> 00:09:06,610 So we have post for posting new data to the server and we have get for getting existing data. 106 00:09:06,610 --> 00:09:11,560 Now you'll notice that the path is exactly the same forward slash tasks. 107 00:09:11,560 --> 00:09:17,260 This is the setup we'll use when we're trying to get all of a given resource to bring us back to that 108 00:09:17,260 --> 00:09:18,620 product's example. 109 00:09:18,670 --> 00:09:23,020 It would be forward slash products to fetch all of the products. 110 00:09:23,050 --> 00:09:29,020 Now there is that second Reid operation the ability to fetch an individual resource and for that we 111 00:09:29,020 --> 00:09:30,670 have something like the following. 112 00:09:30,670 --> 00:09:37,720 It's still a Reid operation and we're still using the TTP get method right here though you are L has 113 00:09:37,720 --> 00:09:46,780 changed it's now forward slash tasks forward slash colon I.D. Now colon I.D. is a place holder this 114 00:09:46,780 --> 00:09:52,180 will get replaced with some value and in the case of this particular path it'll get replaced with the 115 00:09:52,180 --> 00:09:59,290 I.D. of the task we're trying to fetch so we're going to see forward slash tasks when we're working 116 00:09:59,290 --> 00:10:04,770 with multiple of a resource and then forward slash tasks forward slash I.D.. 117 00:10:05,020 --> 00:10:07,530 When we're targeting an individual item. 118 00:10:08,170 --> 00:10:13,210 So next up on our list of crud operations is you for update. 119 00:10:13,270 --> 00:10:15,600 Right here we have that for update. 120 00:10:15,610 --> 00:10:22,150 We use a third H TTP method patch which allows us to patch up our existing data. 121 00:10:22,210 --> 00:10:28,000 In this case we could do something like make a task complete when it was previously incomplete. 122 00:10:28,000 --> 00:10:30,920 Now in this case we're working with an individual task. 123 00:10:31,030 --> 00:10:34,570 So we see these same you are all set up as we had up above. 124 00:10:34,570 --> 00:10:40,510 It is only the TTP method that has changed and we'll learn how to actually manipulate these methods 125 00:10:40,600 --> 00:10:43,620 as we start to build out the rest api. 126 00:10:43,630 --> 00:10:46,810 Next up after update we have d for delete. 127 00:10:46,810 --> 00:10:53,320 In this case we use the delete HDTV method followed by the same you are El structure we saw with the 128 00:10:53,320 --> 00:11:00,100 last two because in the case of delete we are deleting an individual task by its I.D.. 129 00:11:00,100 --> 00:11:03,150 So these are the basic you are El structures we'll see. 130 00:11:03,160 --> 00:11:09,310 We have forward slash resource where the resource name is Pla realized then we have forward slash plural 131 00:11:09,310 --> 00:11:16,180 sized resource forward slash the idea when we're trying to manipulate an individual resource. 132 00:11:16,180 --> 00:11:22,540 This is the common rest api structure and this is what we're going to work to build out in this section. 133 00:11:22,540 --> 00:11:27,340 Now before we go there's one more thing I want to talk about as we put all of this into practice. 134 00:11:27,340 --> 00:11:33,370 We're going to be sending hundreds of H TTP requests back and forth between the client and the server 135 00:11:33,670 --> 00:11:38,270 and it's a good idea to know what exactly makes up an H TTP request. 136 00:11:38,290 --> 00:11:42,770 What exactly is getting sent back and forth between the client and the server. 137 00:11:42,820 --> 00:11:45,730 And the answer is that it's just some text. 138 00:11:45,820 --> 00:11:49,870 So the structure of an H TTP request is text based. 139 00:11:49,870 --> 00:11:54,360 Here I have an example request and there are three main pieces. 140 00:11:54,400 --> 00:11:58,840 First up line number one this is known as the request line. 141 00:11:58,840 --> 00:12:05,590 This contains the H TTP method being used the path and the TTP protocol. 142 00:12:05,590 --> 00:12:11,800 In this case we know that the combination of post with forward slash tasks means that we're trying to 143 00:12:11,800 --> 00:12:14,400 create a new task resource. 144 00:12:14,460 --> 00:12:19,410 Now after that request line we have as many request headers as we need. 145 00:12:19,420 --> 00:12:26,530 Here we have three except connection and authorization headers are nothing more than key value pairs 146 00:12:26,770 --> 00:12:30,370 which allow you to attach meta information to their request. 147 00:12:30,370 --> 00:12:36,120 So here we are using except to say that we're expecting Jason data back which is what we'll get. 148 00:12:36,280 --> 00:12:40,610 We're using connection to say that we're likely to make other requests shortly. 149 00:12:40,660 --> 00:12:44,360 So let's go ahead and keep this connection open to keep things fast. 150 00:12:44,590 --> 00:12:48,360 And we're also setting authorization to setup authentication. 151 00:12:48,400 --> 00:12:54,070 Now in this case I have trimmed that value as it's quite long but we'll learn how to set that up later. 152 00:12:54,070 --> 00:12:58,400 Now we can have as many headers as we need in this case we have three. 153 00:12:58,450 --> 00:13:04,020 After we're done with the headers we have an empty line followed by the request body. 154 00:13:04,090 --> 00:13:10,150 So when we post data to forward slash tasks we have to provide that data and we provide it. 155 00:13:10,150 --> 00:13:16,510 As Jason right inside of the request body down below I have the following where I set up description 156 00:13:16,720 --> 00:13:19,890 giving it the value of order new drill bits. 157 00:13:19,900 --> 00:13:25,300 Now you'll notice that I'm not providing a completed value because I can just fall back to the default 158 00:13:25,300 --> 00:13:27,270 value which is false. 159 00:13:27,340 --> 00:13:29,650 And that's exactly what I want now. 160 00:13:29,680 --> 00:13:35,350 Once the server gets this request it's going to be able to pass it and express does great work for us 161 00:13:35,350 --> 00:13:41,860 by giving us access to all of this in a much easier interface and it sends back a response which looks 162 00:13:41,860 --> 00:13:43,990 quite similar to the request. 163 00:13:43,990 --> 00:13:51,160 Here we have the status line which contains the protocol followed by the status code followed by a text 164 00:13:51,250 --> 00:13:53,390 representation of the status code. 165 00:13:53,830 --> 00:14:00,820 So in this case our protocols match up the status code is to a one and two a one stands for created 166 00:14:00,970 --> 00:14:07,510 much like for 0 four stands for not found and once again you'll see a complete list of the status codes 167 00:14:07,510 --> 00:14:09,370 available shortly. 168 00:14:09,370 --> 00:14:12,360 Next up we have our response headers so down below. 169 00:14:12,370 --> 00:14:19,390 I have three headers date server and content type date just signifies the time when all of this happened 170 00:14:19,660 --> 00:14:25,000 the server would be expressed and the content type is metadata about what's below. 171 00:14:25,000 --> 00:14:27,790 In this case we're saying that it's Jason. 172 00:14:27,790 --> 00:14:33,970 Next up we do indeed have an empty line followed by the response body which in this case is the complete 173 00:14:34,030 --> 00:14:37,890 task with the I.D. and completed values set up. 174 00:14:37,960 --> 00:14:40,590 And right here we have the description we provide it. 175 00:14:40,720 --> 00:14:46,780 So we'll send body Jason in the request when we're trying to pass things over to the server and we will 176 00:14:46,780 --> 00:14:51,340 get body Jason in the response for almost everything we do. 177 00:14:51,370 --> 00:14:55,480 So this is the basics of what makes up a request and a response. 178 00:14:55,480 --> 00:14:58,780 Now let's go ahead and start to put all of this into practice. 179 00:14:58,780 --> 00:15:01,320 As far as visualization videos go. 180 00:15:01,320 --> 00:15:08,310 I know this one was a bit long but it's important to understand everything that makes up an H TTP request 181 00:15:08,550 --> 00:15:16,530 as well as the basic structure for the H TTP rest api resources which is what we explored in that last 182 00:15:16,590 --> 00:15:17,610 slide. 183 00:15:17,610 --> 00:15:19,340 All right that's it for this one. 184 00:15:19,380 --> 00:15:20,850 Let's jump into the next one.