WEBVTT 0 00:00.290 --> 00:00.520 All right. 1 00:00.600 --> 00:02.940 So I hope you gave that a good go 2 00:03.150 --> 00:07.100 and as always learning comes from struggling and not following tutorials. 3 00:07.140 --> 00:12.960 But if you did get stuck and you wanted to check your solutions then this is the place because I'm going 4 00:12.960 --> 00:14.960 to walk you through the entire process. 5 00:15.090 --> 00:19.650 Now if you're already done and you're happy with the result and you've tested it, then feel free to skip 6 00:19.650 --> 00:22.470 this video and continue on to the next part. 7 00:23.130 --> 00:29.640 But first things first, let's create a new directory called Wiki-API. So inside my hyperterminal I'm 8 00:29.640 --> 00:35.430 going to open up a new tab and I'm going to leave my MongoDB connection as it is 9 00:35.430 --> 00:42.390 because if I close down this tab then my MongoDB connection will still be active but I'll have no way 10 00:42.480 --> 00:43.380 of accessing it. 11 00:43.590 --> 00:50.130 So it's a good idea to either control + C to exit or simply leave it running until you're done. 12 00:50.130 --> 00:55.590 And remember whenever you close down the application just close it down tab by tab to make sure that 13 00:55.590 --> 00:59.530 you're not closing some connections that you meant to keep open. 14 00:59.550 --> 01:08.010 So I'm going to go and open up a new tab and here I'm going to navigate to my desktop. 15 01:08.010 --> 01:13.620 Feel free to create your project anywhere you like but I'm just gonna do it here so that it's easy for 16 01:13.620 --> 01:15.340 you to see and I'll move it later. 17 01:15.450 --> 01:22.560 So on my desktop I'm going to create a new directory that is called Wiki-API. 18 01:22.740 --> 01:30.810 Then I'm going to cd into this directory Wiki-API and inside here I'm going to initialize NPM and I'm 19 01:30.810 --> 01:37.260 going to add the Y flag to basically just say yes to all of those questions that always pop up when 20 01:37.260 --> 01:38.540 you initialize NPM. 21 01:39.660 --> 01:45.450 So now that it's done and it's basically just added in all of the default options for all of those fields 22 01:45.990 --> 01:50.670 and now I'm gonna go ahead and install my modules. 23 01:51.630 --> 02:00.150 So I'm gonna write "npm i" which is short for install and remember I need to install body-parser, mongoose 24 02:00.290 --> 02:08.910 ejs and express so make sure there's no typos and then we're going to hit enter for it to run its 25 02:08.910 --> 02:09.680 course. 26 02:09.690 --> 02:11.040 So now that's done. 27 02:11.160 --> 02:15.750 Then we can create our app.js using the "touch" keyword. 28 02:16.020 --> 02:23.580 And if I run an "ls -a" you can see now I have my app.js created inside Wiki-API directory 29 02:24.240 --> 02:24.660 so. 30 02:25.080 --> 02:31.650 So now we're up to here and we have to open up our app.js and add some server code. 31 02:31.650 --> 02:38.880 Now for time sake instead of you having to watch me type 20 lines I'm gonna go ahead and just copy the 32 02:38.940 --> 02:43.830 starting server code and I'm gonna paste paste it into my app.js and hit save. 33 02:44.400 --> 02:47.140 So let's just review this code quickly. 34 02:47.190 --> 02:50.450 We are creating four constants. 35 02:50.670 --> 02:55.900 We are requiring all of those modules that we installed a little bit earlier on. 36 02:56.010 --> 02:59.830 We're creating a new app instant using Express. 37 03:00.030 --> 03:05.510 We're setting our view engine to use EJS our templating engine 38 03:05.640 --> 03:11.230 and then we're going to use body-parser in order to pass our requests 39 03:11.280 --> 03:19.500 and finally we're going to use the public directory to store our static files such as images and 40 03:19.500 --> 03:20.660 CSS code. 41 03:20.700 --> 03:24.920 The last part sets up our app to listen on port 3000 42 03:25.020 --> 03:32.520 so we should now be able to use nodemon to spin up our server app.js and it should say that "Server 43 03:32.520 --> 03:37.320 has started on port 3000." And now if you remember 44 03:37.320 --> 03:41.750 if we head over to local host 3000 45 03:41.760 --> 03:44.130 pretty much nothing will happen. 46 03:44.190 --> 03:49.760 And it tells us that it cannot get our files at our root. 47 03:49.770 --> 03:54.340 So this is because we haven't created any of our API yet. 48 03:54.510 --> 03:56.890 Which is what we will do very shortly. 49 03:57.030 --> 04:03.420 But as long as our server is running we don't have any problems in our console then that is pretty much 50 04:03.480 --> 04:07.870 success and we can move on to the next step which is setting up MongoDB. 51 04:08.040 --> 04:13.620 So in order to set up MongoDB we're going to use Mongoose and we're going say mongoose.connect 52 04:14.190 --> 04:23.340 and we're going to connect to the usual MongoDB location which is mongodb:// 53 04:23.730 --> 04:32.160 localhost:27017 which is that default port that MongoDB likes to use and then we're going 54 04:32.160 --> 04:39.520 to add a / to specify our database name which was called wikiDB. 55 04:39.630 --> 04:44.910 Make sure you don't have any typos as it's quite a long string and it has to be pretty much precise 56 04:45.300 --> 04:52.260 and that needs to match with the name of the database that you created inside Robo 3T. As you can see 57 04:52.260 --> 04:58.100 mine is wikiDB, lowercase "wiki" uppercase "DB" and that is exactly the same. 58 04:58.140 --> 05:04.850 So the next thing we're gonna do is we're going to add a property that says useNewUrlParser in 59 05:04.850 --> 05:10.970 order to get rid of the errors that MongoDB likes to throw up and then we're gonna finish it off with 60 05:11.000 --> 05:12.320 a semicolon. 61 05:12.320 --> 05:18.950 And that line of code will allow Mongoose to connect to our local MongoDB instance. 62 05:19.010 --> 05:26.120 So now that we've connected to our database the next thing is to create the schema for our articles 63 05:26.210 --> 05:29.660 collection so that we can create some models around that. 64 05:29.660 --> 05:36.350 So in order to create a new schema we're going to create a const called articleSchema or whatever 65 05:36.350 --> 05:38.280 it is you want to call it. 66 05:38.560 --> 05:42.740 And this is going to be set to have two fields: 67 05:42.740 --> 05:46.190 one was called title and this is a string. 68 05:46.460 --> 05:48.580 And the other one is called content 69 05:48.620 --> 05:55.850 and this is also a string. And then we can create our model by saying const Article, 70 05:55.850 --> 06:00.710 remember this is usually capitalized and it's usually the singular form. 71 06:00.710 --> 06:07.350 And then we're going to set it to equal mongoose.model and then specify the name of our collection. 72 06:07.370 --> 06:17.330 So Mongoose will automatically change this into a lowercase a and make this plural in quite a smart 73 06:17.330 --> 06:19.870 way as we spoke about before. 74 06:19.970 --> 06:27.260 And then all we have to do now is to just specify that article schema which we called articleSchema 75 06:27.800 --> 06:30.710 and now we're going to cap it off with a semicolon 76 06:30.710 --> 06:32.850 and that is us done. 77 06:32.900 --> 06:36.860 So we've set up our connection to our MongoDB, 78 06:36.920 --> 06:43.810 we've created our articleSchema and we've created our article model using Mongoose. 79 06:43.850 --> 06:47.930 Now all of this should be intimately familiar to you by now 80 06:47.930 --> 06:57.770 and if it's not make sure that you revisit and restudy the database module previously especially if 81 06:57.770 --> 07:03.380 you have skipped some of those lessons. It is crucially important that you've already absorbed everything 82 07:03.440 --> 07:05.680 in those modules before we continue. 83 07:05.690 --> 07:06.900 So that's it. 84 07:06.920 --> 07:09.240 That's setting up all of this. 85 07:09.380 --> 07:14.330 And I hope that you managed to do it yourself and complete the challenge using what you learnt before, 86 07:14.600 --> 07:16.940 maybe referring to some of the previous code 87 07:16.940 --> 07:23.990 just to remind yourself. So now that we've got our server setup we are absolutely ready to get started 88 07:23.990 --> 07:27.000 creating our RESTful API. 89 07:27.050 --> 07:30.020 So for all of that and more I'll see you on the next lesson.