1
00:00:00,380 --> 00:00:06,590
And once the main structure of our front end is complete, we're pretty much done with the first part

2
00:00:06,590 --> 00:00:07,490
of the course.

3
00:00:07,790 --> 00:00:12,200
So now let's switch gears and start working on our back end.

4
00:00:12,530 --> 00:00:14,840
As a side note from this point on.

5
00:00:15,450 --> 00:00:22,350
I won't have the browser and a text editor side by side since there's very little point.

6
00:00:22,500 --> 00:00:28,830
And I want to start with the folder structure and please don't skip over this video.

7
00:00:29,310 --> 00:00:38,970
This is extremely important since if you don't have the same setup, it's going to be very hard to deploy

8
00:00:38,970 --> 00:00:44,370
the project, which is obviously something we're going to do at the very end of this course.

9
00:00:44,460 --> 00:00:53,880
So judging by the questions and issues that students experienced in the course Q and A in the previous

10
00:00:53,880 --> 00:01:02,670
iteration of the course, I highly, highly, highly recommend having the same folder structure that

11
00:01:02,670 --> 00:01:04,440
I'm about to set up.

12
00:01:04,440 --> 00:01:08,340
This is extremely important, especially the git part.

13
00:01:08,430 --> 00:01:10,560
So here's the first thing we want to do.

14
00:01:10,800 --> 00:01:20,710
If you have an existing Git folder, essentially if you already set up the source control for the front

15
00:01:20,710 --> 00:01:23,860
end application, please remove it.

16
00:01:23,890 --> 00:01:32,040
So I'm going to use the Mac command since of course I'm using the Mac, but I also provided in the Readme

17
00:01:32,200 --> 00:01:35,080
the commands for the windows.

18
00:01:35,110 --> 00:01:43,630
Now I haven't tested these commands, but students provided them and I'm pretty sure they work since

19
00:01:43,660 --> 00:01:47,920
other students agreed that yes, those are the correct commands.

20
00:01:47,920 --> 00:01:55,360
So effectively the result you're looking for if you run git status is not a git repository.

21
00:01:55,360 --> 00:01:56,680
So let's try this one out.

22
00:01:56,710 --> 00:02:00,280
Now I already know that it's not a git repo, but you know what?

23
00:02:01,070 --> 00:02:02,540
Why don't we do it one more time?

24
00:02:02,540 --> 00:02:05,450
So get status fatal, not a git repo.

25
00:02:05,450 --> 00:02:07,370
And this is exactly what we want.

26
00:02:07,400 --> 00:02:14,210
Now if it says, yeah, it's a git repo again, run one of these commands, please make sure that there

27
00:02:14,210 --> 00:02:15,680
is no existing.

28
00:02:16,470 --> 00:02:19,970
Get folder inside of the client.

29
00:02:19,980 --> 00:02:21,480
So that's the first step.

30
00:02:21,570 --> 00:02:26,130
Once we have this one, we want to create a new folder.

31
00:02:26,130 --> 00:02:29,010
So essentially we want to create the main folder.

32
00:02:29,010 --> 00:02:37,380
So now let me navigate to a desktop and I believe I'm going to go here with Java file and once I have

33
00:02:37,380 --> 00:02:40,320
this folder in place, so this is going to be our main folder.

34
00:02:40,320 --> 00:02:44,160
We want to move the client to the Java file.

35
00:02:44,370 --> 00:02:49,280
So yes, a little bit of acrobatics, but this is going to be our setup.

36
00:02:49,290 --> 00:02:52,170
Now to answer your question, can you set up.

37
00:02:52,880 --> 00:02:53,870
Both of them separately.

38
00:02:53,870 --> 00:02:55,910
Basically, you have client and server.

39
00:02:55,940 --> 00:02:56,840
Yes, you can.

40
00:02:56,840 --> 00:03:00,440
But you need to add, in my opinion.

41
00:03:01,300 --> 00:03:05,080
Quite a bit of logic in the main route.

42
00:03:05,080 --> 00:03:08,970
One, in order to spin both of them up when you deploy.

43
00:03:08,980 --> 00:03:12,830
And in my experience it's just easier if you do it this way.

44
00:03:12,850 --> 00:03:15,190
So let me now move my job if I want.

45
00:03:15,220 --> 00:03:18,670
Again, this is my main one, so the client is going to be inside of it?

46
00:03:18,670 --> 00:03:19,870
Yes, that's correct.

47
00:03:19,870 --> 00:03:21,610
So this is my client.

48
00:03:21,940 --> 00:03:29,080
And first, I just want to move this Readme from the client to a source.

49
00:03:29,760 --> 00:03:31,380
Yep, that's what we want to do.

50
00:03:31,380 --> 00:03:34,020
So now it's located in the source.

51
00:03:34,020 --> 00:03:42,360
And once the Readme is in the root, we want to create a package.json file which effectively is a manifest

52
00:03:42,360 --> 00:03:43,320
for our project.

53
00:03:43,320 --> 00:03:47,040
So this is where we'll have the scripts, this is where we'll have the packages.

54
00:03:47,040 --> 00:03:52,050
And of course we already have the package.json for the client.

55
00:03:52,050 --> 00:03:57,090
So now we'll be setting up the Package.json for our server.

56
00:03:57,090 --> 00:04:02,430
So let's navigate I guess to the integrated terminal.

57
00:04:03,640 --> 00:04:04,930
Let me double check over here.

58
00:04:05,050 --> 00:04:08,470
And the command we're looking for is npm init.

59
00:04:08,470 --> 00:04:13,870
And I'm just going to go with dash y, which is going to answer yes to pretty much all of the questions.

60
00:04:13,870 --> 00:04:17,680
Again, please keep in mind that we're not talking about.

61
00:04:18,459 --> 00:04:19,480
The client.

62
00:04:19,480 --> 00:04:22,790
So this package, Json right now is in our root.

63
00:04:22,810 --> 00:04:26,710
And in order to test it, I want to create a new file.

64
00:04:27,130 --> 00:04:29,190
I'll call this Server.js.

65
00:04:29,200 --> 00:04:34,600
So now, of course we don't need to use the JSX extension and essentially.

66
00:04:35,320 --> 00:04:40,600
I'm not going to be original and I'm going to say server is working.

67
00:04:42,190 --> 00:04:43,270
Dot, dot, dot, dot, dot.

68
00:04:43,420 --> 00:04:46,090
And then let's navigate to integrated terminal.

69
00:04:46,090 --> 00:04:47,770
And we're looking for Node.

70
00:04:48,040 --> 00:04:50,720
And then let's run the file.

71
00:04:50,740 --> 00:04:53,080
So in here you can add JS.

72
00:04:53,950 --> 00:04:54,340
Remove.

73
00:04:54,580 --> 00:04:57,940
It doesn't really matter if you see servers working.

74
00:04:58,760 --> 00:04:59,720
In the console.

75
00:04:59,720 --> 00:05:03,660
We are in good shape and we can move on to the next step.

76
00:05:03,680 --> 00:05:05,300
Again, very, very important.

77
00:05:05,300 --> 00:05:09,470
Make sure that the folder structure is exactly the same.

78
00:05:09,470 --> 00:05:15,800
It's going to be easier for you also if you need to troubleshoot your project because if you don't have

79
00:05:15,800 --> 00:05:21,130
the same folder structure in the course Q&A, I'll ask you to do it regardless.

80
00:05:21,140 --> 00:05:24,530
And also it's going to be easier when we need to deploy the project.

81
00:05:24,530 --> 00:05:28,490
So make sure that you have the main folder in there.

82
00:05:28,490 --> 00:05:33,950
You have the client and client does not have existing git repo.

83
00:05:33,950 --> 00:05:35,180
Hopefully that is clear.

84
00:05:35,180 --> 00:05:39,680
Hopefully it wasn't too annoying that I was repeating that 50,000 times.

85
00:05:39,890 --> 00:05:43,100
And yes, now we can move on to the next step.