WEBVTT

1
00:00:01.699 --> 00:00:08.980
So, I did now open up Cursor here in a brand new folder, an empty folder, where I want

2
00:00:08.980 --> 00:00:12.360
to put all that code for my REST API.

3
00:00:13.260 --> 00:00:20.160
Now I got one example folder structure suggested here and I'll at least implement parts of

4
00:00:20.160 --> 00:00:20.520
that.

5
00:00:21.900 --> 00:00:25.460
I will need a package.json file to manage my dependencies.

6
00:00:25.880 --> 00:00:31.080
I want to have a root entry file, though I will name mine app.js.

7
00:00:31.900 --> 00:00:38.060
I will add such a .env file to store, for example, my JSON Web Tokens secret.

8
00:00:39.800 --> 00:00:46.260
And I will add some of these folders, though not in a source subfolder, but instead directly

9
00:00:46.260 --> 00:00:47.340
in the root directory.

10
00:00:48.000 --> 00:00:49.880
And I also won't add all of them.

11
00:00:51.380 --> 00:00:57.240
So to get started, I'll first run npm init dash y to create this package.json file.

12
00:00:58.160 --> 00:01:01.220
And I could ask AI for that, of course.

13
00:01:01.780 --> 00:01:07.360
I could use that inline chat here to, say, generate a new package.json file.

14
00:01:08.120 --> 00:01:11.320
And it likely would suggest the same command.

15
00:01:11.420 --> 00:01:12.040
Yes, it does.

16
00:01:12.620 --> 00:01:18.660
But of course, that is already a first example for something where I could use AI, but it

17
00:01:18.580 --> 00:01:22.340
actually takes me more time because I already know the command.

18
00:01:23.399 --> 00:01:28.440
Nonetheless, now that I showed you how you could use AI, I'll just use this command

19
00:01:28.440 --> 00:01:30.980
and click run here to run it.

20
00:01:31.200 --> 00:01:33.580
And this generates this package.json file.

21
00:01:35.140 --> 00:01:39.160
Now here in that file, I already want to change some things.

22
00:01:39.280 --> 00:01:43.560
And again, I'll do that manually because I know exactly what I want to change.

23
00:01:45.100 --> 00:01:50.780
I'll put in my name here and the name of my company.

24
00:01:51.900 --> 00:01:56.480
I will change the main file to app.js because that's the name I'll choose.

25
00:01:57.400 --> 00:02:02.760
I'll add type module, getting a nice suggestion here, which I'll just confirm by hitting

26
00:02:02.760 --> 00:02:07.580
tab, which allows me to use a different import and export format in this application.

27
00:02:08.979 --> 00:02:11.920
And I also will change that script.

28
00:02:11.980 --> 00:02:15.040
I'm getting some suggestions here, but hard to see.

29
00:02:15.140 --> 00:02:15.860
Let me zoom out.

30
00:02:16.760 --> 00:02:19.980
Yeah, these are not exactly the scripts I want.

31
00:02:20.360 --> 00:02:26.160
Instead, I will add a dev script, but I will accept the suggestion here, but I will not

32
00:02:26.160 --> 00:02:29.420
run app.js with an extra tool called nodemon.

33
00:02:29.680 --> 00:02:34.700
Instead, since I'm using a fairly recent version of node.js, I'll use the built-in

34
00:02:34.700 --> 00:02:40.000
watch mode, which is now suggested to me to run my application in watch mode where the

35
00:02:39.860 --> 00:02:42.480
server will be restarted whenever I make changes.

36
00:02:44.120 --> 00:02:49.500
Now we could add more scripts, but that's the basic behavior I want and need here.

37
00:02:51.080 --> 00:02:53.880
Okay, so that's the package jsonfile edited.

38
00:02:54.100 --> 00:03:00.060
As mentioned, I'll add a .env file to hold some environment variables, which I'll need

39
00:03:00.060 --> 00:03:00.300
later.

40
00:03:01.940 --> 00:03:06.700
And I'll actually also add a gitignore file, even though it was not suggested because I

41
00:03:06.580 --> 00:03:09.020
plan on using git here for this project.

42
00:03:10.660 --> 00:03:12.440
And that's why I add this file.

43
00:03:12.980 --> 00:03:19.580
And here I want to ignore this special file here, which is a Mac-specific file, the .env

44
00:03:19.580 --> 00:03:21.600
file for sure, and node modules.

45
00:03:22.280 --> 00:03:27.140
So I'll accept these suggestions here, whoops, like this, and that's my gitignore file.

46
00:03:29.480 --> 00:03:35.800
Well, and now I'll add an app.js file, which will be my root entry file for this application.

47
00:03:37.420 --> 00:03:45.360
I also need to install dependencies, one dependency to get started, and that will be the express.js

48
00:03:45.360 --> 00:03:50.780
package, which I can install with this command here, because I'll use the express framework

49
00:03:50.780 --> 00:03:53.400
to build this node.js REST API.

50
00:03:55.100 --> 00:03:57.220
But again, you don't need to know express or node.

51
00:03:57.460 --> 00:04:00.360
You can just copy my code, follow along, and you'll be fine.

52
00:04:01.700 --> 00:04:09.220
Now if you don't know node.js, though, it's worth noting that you need to visit nodejs.org

53
00:04:10.460 --> 00:04:12.700
and download node.js from there.

54
00:04:12.820 --> 00:04:14.700
It's available for all operating systems.

55
00:04:15.000 --> 00:04:19.940
And install it on your system so that you will be able to run this application.

56
00:04:21.760 --> 00:04:26.140
Obviously this npm init command from before will already fail if you don't have node.js

57
00:04:26.140 --> 00:04:28.100
installed, so you will need that.

58
00:04:29.280 --> 00:04:32.540
And with that, I got the most important files set up here.

59
00:04:32.860 --> 00:04:37.600
Now I will also add a couple of folders, though, a couple of folders which I'll need, some

60
00:04:37.600 --> 00:04:40.420
of which have been suggested here by chat.gpt.

61
00:04:41.460 --> 00:04:45.620
For example, I will add a controllers, a models, and a routes folder.

62
00:04:47.360 --> 00:04:53.280
So I'll do that here, not inside of a src folder, though, but instead here in the root

63
00:04:54.000 --> 00:04:58.000
project folder, controllers, models, and routes.

64
00:05:00.180 --> 00:05:06.720
And I'll also, in addition, add a public folder which will, for example, later hold my uploaded

65
00:05:06.720 --> 00:05:09.100
images in an images subfolder.

66
00:05:10.980 --> 00:05:15.560
So these are some folders I want to create, even though they hold no files yet.

67
00:05:16.720 --> 00:05:22.100
Because that's what I'll now try to do in a next step with more help by cursor.

68
00:05:22.440 --> 00:05:27.020
Because up to this point I did basically all of that manually because I knew exactly what

69
00:05:27.020 --> 00:05:27.360
I needed.

70
00:05:28.280 --> 00:05:32.420
Now I'll try to generate some code and files with help of cursor.