1 00:00:00,000 --> 00:00:05,280 Remember, unlike a traditional server-side application, which responds to requests 2 00:00:05,280 --> 00:00:09,942 with HTML, a REST-ful API responds with data, most of the time a JSON object. 3 00:00:09,942 --> 00:00:11,110 To see how this works, 4 00:00:11,110 --> 00:00:14,689 let's write a simple route that responds to a GET request with JSON. 5 00:00:15,710 --> 00:00:20,020 To follow along with me, download the starter files from the link on this page. 6 00:00:20,020 --> 00:00:22,450 Locate the project folder from the terminal and 7 00:00:22,450 --> 00:00:26,590 run npm install, to install the project's dependencies. 8 00:00:26,590 --> 00:00:29,960 Then open the starter files in your preferred text editor. 9 00:00:29,960 --> 00:00:33,114 We're starting off with some standard files for a basic Express app. 10 00:00:33,114 --> 00:00:37,319 Along with a file called records.js, and a file called data.json, 11 00:00:37,319 --> 00:00:39,754 both of which we'll discuss very soon. 12 00:00:39,754 --> 00:00:42,159 Right now, let's look at the app.js file, 13 00:00:42,159 --> 00:00:44,643 which is where we'll begin writing our code. 14 00:00:44,643 --> 00:00:48,524 Open up that file, and you'll see that we're importing express, 15 00:00:48,524 --> 00:00:51,944 creating an express app, and listening on port 3000. 16 00:00:51,944 --> 00:00:55,580 We'll begin by creating an Express GET route handler. 17 00:00:55,580 --> 00:01:00,600 Recall that the Express function adds a bunch of methods to Node's HTTP server, 18 00:01:00,600 --> 00:01:04,050 to make it easier for us to receive and respond to requests. 19 00:01:04,050 --> 00:01:08,190 These Express methods include GET, POST, PUT, and DELETE. 20 00:01:08,190 --> 00:01:10,660 We're creating a GET method. 21 00:01:12,160 --> 00:01:14,270 The GET method takes two arguments. 22 00:01:14,270 --> 00:01:16,756 The first argument is the route that we wanna handle. 23 00:01:16,756 --> 00:01:20,793 Let's write some code that will respond to a request to a route called greetings. 24 00:01:20,793 --> 00:01:23,918 So in quotes, we'll say '/greetings'. 25 00:01:23,918 --> 00:01:28,693 The second argument is the callback function we want to run when this request 26 00:01:28,693 --> 00:01:30,869 comes in, how we want to respond. 27 00:01:33,145 --> 00:01:37,760 Recall that when a client, a browser, or some other application makes a get request 28 00:01:37,760 --> 00:01:42,308 to this URL, Express will run the code inside of this callback function. 29 00:01:43,948 --> 00:01:46,780 This callback function takes at least two arguments, 30 00:01:46,780 --> 00:01:49,780 one representing the incoming request from the client, and 31 00:01:49,780 --> 00:01:52,610 one representing the outgoing response from the server. 32 00:01:52,610 --> 00:01:57,243 By convention, they're both typically shortened to req for 33 00:01:57,243 --> 00:01:59,747 request, and res for response. 34 00:01:59,747 --> 00:02:03,675 Recall that in a traditional server-side Express application, 35 00:02:03,675 --> 00:02:08,233 you'd respond to a client request using the Express res.render function, 36 00:02:08,233 --> 00:02:11,400 to render a template and send HTML back to the client. 37 00:02:11,400 --> 00:02:13,042 So you might do something like this. 38 00:02:13,042 --> 00:02:19,254 You'd say res.render('some_html_template'). 39 00:02:19,254 --> 00:02:22,191 But we don't wanna do that, because we're building a REST API. 40 00:02:22,191 --> 00:02:25,697 So inside the callback function, we wanna send back JSON. 41 00:02:25,697 --> 00:02:30,318 So to do that, we can use the JSON method available on the response object. 42 00:02:30,318 --> 00:02:33,552 So we can say res.json. 43 00:02:33,552 --> 00:02:36,807 And we can pass the JSON method an object, and 44 00:02:36,807 --> 00:02:41,184 it will convert that object to JSON and send it to the client. 45 00:02:41,184 --> 00:02:45,073 So let's pass the JSON method an object. 46 00:02:45,073 --> 00:02:49,724 And this object can be a greeting, Hello World! 47 00:02:49,724 --> 00:02:52,169 Now let's save and test this out. 48 00:02:52,169 --> 00:02:54,108 Open up a terminal on your computer. 49 00:02:54,108 --> 00:02:58,695 Or if you're using VS Code, open your integrated terminal by 50 00:02:58,695 --> 00:03:03,829 selecting it from the menu or using the keyboard shortcut Ctrl+\. 51 00:03:03,829 --> 00:03:07,576 Type npm start, to get the server running. 52 00:03:07,576 --> 00:03:10,789 Recall that this project is using nodemon to run the server, so 53 00:03:10,789 --> 00:03:12,616 we don't have to keep restarting. 54 00:03:12,616 --> 00:03:16,202 See the teacher's notes if you need assistance installing nodemon. 55 00:03:16,202 --> 00:03:18,799 As you can see from the message in the console, 56 00:03:18,799 --> 00:03:21,604 our app should be running at local host 3000. 57 00:03:21,604 --> 00:03:25,293 If we visit localhost:3000/greetings from a browser, 58 00:03:28,297 --> 00:03:32,345 You can see that our API is sending JSON when we make a request. 59 00:03:32,345 --> 00:03:35,253 The browser, by default, sends a GET request. 60 00:03:35,253 --> 00:03:38,287 By visiting localhost:3000/greetings, 61 00:03:38,287 --> 00:03:43,195 we're sending a GET request to the greetings route, which we've programmed in 62 00:03:43,195 --> 00:03:47,759 our Express application to send back a JSON object containing a greeting. 63 00:03:47,759 --> 00:03:50,650 You've written code that responds to JSON when a client makes 64 00:03:50,650 --> 00:03:51,883 a request to an endpoint. 65 00:03:51,883 --> 00:03:54,602 At a high level, that's really all there is to it. 66 00:03:54,602 --> 00:03:56,835 You've written a very simple REST API. 67 00:03:56,835 --> 00:04:01,350 If all you want is a REST API that returns a simple message, then congratulations, 68 00:04:01,350 --> 00:04:02,198 you're done. 69 00:04:02,198 --> 00:04:05,607 But we want a REST API that provides much more functionality. 70 00:04:05,607 --> 00:04:08,664 We want to display, create, update, and delete quotes. 71 00:04:08,664 --> 00:04:11,575 With this in mind, let's plan out our application and 72 00:04:11,575 --> 00:04:13,418 start building our first routes.