1
00:00:01,090 --> 00:00:03,220
‫Let's now go very quickly

2
00:00:03,220 --> 00:00:06,120
‫over the absolutely fundamentals of Git,

3
00:00:06,120 --> 00:00:10,140
‫and this is by no means a complete overview of Git.

4
00:00:10,140 --> 00:00:12,410
‫All I want to do here is to get you started

5
00:00:12,410 --> 00:00:14,730
‫with Git as quick as possible

6
00:00:14,730 --> 00:00:18,297
‫so that we can then deploy our project to Heroku.

7
00:00:19,760 --> 00:00:21,790
‫And as I mentioned in the last video,

8
00:00:21,790 --> 00:00:25,460
‫I will start using Git in the command line now, all right?

9
00:00:25,460 --> 00:00:27,100
‫And actually I'm using the terminal

10
00:00:27,100 --> 00:00:29,290
‫right here in VS Code again.

11
00:00:29,290 --> 00:00:33,320
‫So let's now quit the current process here, okay?

12
00:00:33,320 --> 00:00:35,770
‫And now here in our local project folder,

13
00:00:35,770 --> 00:00:37,950
‫create a new repository,

14
00:00:37,950 --> 00:00:42,750
‫and we do that by writing git init, okay?

15
00:00:42,750 --> 00:00:45,640
‫Hit Enter and that's it.

16
00:00:45,640 --> 00:00:48,650
‫So we just initialized an empty Git repository,

17
00:00:48,650 --> 00:00:50,990
‫or we can also call it just a repo.

18
00:00:50,990 --> 00:00:53,290
‫So that's a bit easier to say.

19
00:00:53,290 --> 00:00:56,470
‫So, again, in order to create a new repository,

20
00:00:56,470 --> 00:00:58,530
‫or repo, for your project,

21
00:00:58,530 --> 00:01:01,080
‫you need to navigate to that project folder,

22
00:01:01,080 --> 00:01:04,790
‫which here in VS Code happens kind of automatically.

23
00:01:04,790 --> 00:01:07,837
‫So we're automatically right here in the Home folder

24
00:01:07,837 --> 00:01:10,970
‫and then in there you write git init,

25
00:01:10,970 --> 00:01:14,350
‫and so that then spins up this new repository.

26
00:01:14,350 --> 00:01:16,170
‫And here in my command line, you can actually

27
00:01:16,170 --> 00:01:19,480
‫see this yellow part now here of the prompt,

28
00:01:19,480 --> 00:01:22,330
‫and probably on your terminal you won't have that,

29
00:01:22,330 --> 00:01:23,670
‫and it doesn't really matter.

30
00:01:23,670 --> 00:01:26,290
‫So all that means here is that right now

31
00:01:26,290 --> 00:01:31,100
‫we have a repository with a branch called master, okay?

32
00:01:31,100 --> 00:01:34,950
‫And a bit more about the master branch later.

33
00:01:34,950 --> 00:01:37,600
‫Anyway, before we now do anything else,

34
00:01:37,600 --> 00:01:40,770
‫let's create a special file called gitignore,

35
00:01:40,770 --> 00:01:42,863
‫and in there we will add all the files

36
00:01:42,863 --> 00:01:45,703
‫that we do not want to have in our repository.

37
00:01:47,630 --> 00:01:50,080
‫So that's kind of a configuration file

38
00:01:50,080 --> 00:01:53,423
‫just like this prettier or eslint configurations.

39
00:01:54,420 --> 00:01:58,883
‫So I can create a new one here.

40
00:02:00,990 --> 00:02:01,910
‫The output here.

41
00:02:01,910 --> 00:02:04,617
‫So .gitignore, like this, all right?

42
00:02:09,370 --> 00:02:11,220
‫And VS Code, actually once more,

43
00:02:11,220 --> 00:02:13,110
‫already recognized this file

44
00:02:13,110 --> 00:02:15,700
‫and adds this nice symbol to it.

45
00:02:15,700 --> 00:02:17,630
‫And the first folder that we actually want

46
00:02:17,630 --> 00:02:20,633
‫to completely ignore is the node_modules folder,

47
00:02:21,870 --> 00:02:24,733
‫so we write node_modules, all right?

48
00:02:27,720 --> 00:02:30,040
‫Give it a second and then also want

49
00:02:30,040 --> 00:02:32,690
‫to ignore the configuration file.

50
00:02:32,690 --> 00:02:34,970
‫So all the environment variables file.

51
00:02:34,970 --> 00:02:39,970
‫And so we can say all the .env files, okay?

52
00:02:40,260 --> 00:02:43,130
‫So the node_modules folder, we do really not want

53
00:02:43,130 --> 00:02:46,980
‫in our repository because that's simply not necessary.

54
00:02:46,980 --> 00:02:49,840
‫So, for example, if we're gonna upload our repository

55
00:02:49,840 --> 00:02:54,050
‫to GitHub, we then don't want to upload all these

56
00:02:54,050 --> 00:02:57,030
‫tens of thousands of files because once we download

57
00:02:57,030 --> 00:02:59,120
‫the project from GitHub somewhere else,

58
00:02:59,120 --> 00:03:02,060
‫we can then easily get the node_modules folder back

59
00:03:02,060 --> 00:03:05,770
‫by writing npm install, right?

60
00:03:05,770 --> 00:03:09,630
‫And so keep in mind that Git is all about sharing as well,

61
00:03:09,630 --> 00:03:13,610
‫not just about saving your code with snapshots over time,

62
00:03:13,610 --> 00:03:17,240
‫but it's really also about all this collaboration.

63
00:03:17,240 --> 00:03:19,670
‫Now here in VS Code on this left side,

64
00:03:19,670 --> 00:03:22,250
‫we actually have this integration with Git.

65
00:03:22,250 --> 00:03:24,520
‫So if you click here, you'll see all

66
00:03:24,520 --> 00:03:27,720
‫of the files that are marked as modified.

67
00:03:27,720 --> 00:03:29,810
‫Well, right now we don't see any here,

68
00:03:29,810 --> 00:03:34,030
‫so let's just reload, but they still don't show up here,

69
00:03:34,030 --> 00:03:36,250
‫and I think that's because we initially

70
00:03:36,250 --> 00:03:38,840
‫had too many files in node_modules,

71
00:03:38,840 --> 00:03:42,540
‫and so now VS Code is a bit confused with that.

72
00:03:42,540 --> 00:03:43,910
‫Let's check our Problems.

73
00:03:43,910 --> 00:03:47,160
‫No, it doesn't have anything to do with that, all right?

74
00:03:49,680 --> 00:03:52,423
‫But, anyway, that doesn't really matter, okay?

75
00:03:53,300 --> 00:03:55,940
‫What matters is that we can now actually also see

76
00:03:55,940 --> 00:03:59,033
‫all these modified files by writing git status.

77
00:04:01,170 --> 00:04:03,010
‫Like this, okay?

78
00:04:03,010 --> 00:04:06,550
‫And so here are now all the files and folders

79
00:04:06,550 --> 00:04:10,063
‫which are basically not yet committed to our repository.

80
00:04:11,220 --> 00:04:14,320
‫So Git is all about commit, and so let's now learn

81
00:04:14,320 --> 00:04:17,310
‫how we can commit files to the repository,

82
00:04:17,310 --> 00:04:19,590
‫and that's kind of a two-step process.

83
00:04:19,590 --> 00:04:23,550
‫First we need to add the files to a so-called staging area,

84
00:04:23,550 --> 00:04:26,030
‫and only after they are in this area,

85
00:04:26,030 --> 00:04:27,700
‫we can then commit all files

86
00:04:27,700 --> 00:04:31,380
‫that are there to a new commit, all right?

87
00:04:31,380 --> 00:04:32,533
‫So let's do that.

88
00:04:33,800 --> 00:04:38,680
‫So git add, and then if I want to add all the files,

89
00:04:38,680 --> 00:04:43,680
‫I can simply write -A, am I right?

90
00:04:43,910 --> 00:04:45,880
‫So that's taking a bit of time now

91
00:04:45,880 --> 00:04:47,890
‫because there are so many files,

92
00:04:47,890 --> 00:04:50,363
‫and so now if I write git status again,

93
00:04:51,360 --> 00:04:54,543
‫let's see, now all of them are actually green.

94
00:04:55,980 --> 00:04:59,050
‫So here you can see all the tons of these files

95
00:05:01,050 --> 00:05:04,610
‫which are now gonna be added to our git commit, okay?

96
00:05:04,610 --> 00:05:07,600
‫Now, actually, I don't want these cached files

97
00:05:07,600 --> 00:05:09,150
‫in this cache folder,

98
00:05:09,150 --> 00:05:11,513
‫so let's quickly get rid of this folder.

99
00:05:14,330 --> 00:05:18,623
‫Okay, so I hope they are gone now actually also from this.

100
00:05:19,580 --> 00:05:22,850
‫So let's hope they are gone from here as well now.

101
00:05:22,850 --> 00:05:25,340
‫And delete, they are now deleted,

102
00:05:25,340 --> 00:05:26,713
‫so they're no longer here,

103
00:05:27,700 --> 00:05:30,143
‫but let's see if all the others are still here.

104
00:05:31,300 --> 00:05:34,790
‫Okay, so you see that these are not staged for commit,

105
00:05:34,790 --> 00:05:36,350
‫but all of these other files,

106
00:05:36,350 --> 00:05:39,570
‫they will now be committed to the repository.

107
00:05:39,570 --> 00:05:42,010
‫Now probably it sounds a bit confusing to you

108
00:05:42,010 --> 00:05:45,210
‫why we first have to add these files to the staging area,

109
00:05:45,210 --> 00:05:47,480
‫and only then they can be committed.

110
00:05:47,480 --> 00:05:50,310
‫And the quick reason for that is that you might want

111
00:05:50,310 --> 00:05:53,860
‫to add different files for different commits, okay?

112
00:05:53,860 --> 00:05:56,470
‫So imagine you change 10 files but only want

113
00:05:56,470 --> 00:05:59,200
‫to commit five of them to a certain commit.

114
00:05:59,200 --> 00:06:01,670
‫And so by staging, you can do that.

115
00:06:01,670 --> 00:06:05,070
‫But we just want to keep it very simple here,

116
00:06:05,070 --> 00:06:06,830
‫and so we simply add all the files

117
00:06:06,830 --> 00:06:09,640
‫to this staging area and then commit all of them.

118
00:06:09,640 --> 00:06:11,180
‫And, actually, let's do it again

119
00:06:11,180 --> 00:06:13,270
‫because now I deleted all these files.

120
00:06:13,270 --> 00:06:18,270
‫So let's do git add -A again, okay?

121
00:06:19,240 --> 00:06:21,800
‫And so now we're ready to commit the files

122
00:06:21,800 --> 00:06:24,603
‫by writing git commit -m,

123
00:06:26,680 --> 00:06:29,710
‫and then we specify a commit message.

124
00:06:29,710 --> 00:06:32,250
‫And this message should really be descriptive

125
00:06:32,250 --> 00:06:34,490
‫of the changes that you did.

126
00:06:34,490 --> 00:06:37,920
‫Now usually the first commit is called Initial commit,

127
00:06:37,920 --> 00:06:39,620
‫and so let's do that here as well.

128
00:06:41,550 --> 00:06:46,480
‫So Initial commit, hit Return, and that's it.

129
00:06:46,480 --> 00:06:48,580
‫So with this commit we saved

130
00:06:48,580 --> 00:06:51,550
‫all the modifications to the repository,

131
00:06:51,550 --> 00:06:54,610
‫and, again, a commit is like a snapshot

132
00:06:54,610 --> 00:06:58,380
‫of all the code at a certain point in time, all right?

133
00:06:58,380 --> 00:07:02,170
‫And kind of the philosophy is to create one new commit

134
00:07:02,170 --> 00:07:05,633
‫each time that you do significant changes to your code base.

135
00:07:06,481 --> 00:07:10,870
‫So the concept of commit is really the central point of Git.

136
00:07:10,870 --> 00:07:14,880
‫So everything revolves around committing, okay?

137
00:07:14,880 --> 00:07:17,893
‫And now let's just try to modify some file here.

138
00:07:18,900 --> 00:07:20,350
‫So we can close all of these.

139
00:07:20,350 --> 00:07:25,163
‫Now let's now open up app.js here, all right?

140
00:07:26,240 --> 00:07:27,563
‫Close this a bit more.

141
00:07:29,070 --> 00:07:34,070
‫And here let's just say Start express app.

142
00:07:35,220 --> 00:07:38,070
‫Give it a save, and you see it right away

143
00:07:38,070 --> 00:07:41,260
‫in VS Code how we get this green line.

144
00:07:41,260 --> 00:07:42,540
‫And so that means that there

145
00:07:42,540 --> 00:07:45,810
‫was something new inserted at this point.

146
00:07:45,810 --> 00:07:47,510
‫You can now also click on it

147
00:07:47,510 --> 00:07:50,500
‫and see basically how it looked like before,

148
00:07:50,500 --> 00:07:53,730
‫and you can also, right here, move back in time.

149
00:07:53,730 --> 00:07:55,343
‫So revert the change.

150
00:07:56,630 --> 00:07:59,330
‫And the same thing when you delete something.

151
00:07:59,330 --> 00:08:01,500
‫So let's just delete this line of code.

152
00:08:01,500 --> 00:08:03,900
‫And so here you see that before

153
00:08:03,900 --> 00:08:06,130
‫basically there was something.

154
00:08:06,130 --> 00:08:08,340
‫So, again, you can click that

155
00:08:08,340 --> 00:08:11,740
‫and basically see what there was before.

156
00:08:11,740 --> 00:08:13,560
‫You can move back in time,

157
00:08:13,560 --> 00:08:16,123
‫and so let's do that in order to bring it back.

158
00:08:17,409 --> 00:08:19,583
‫Now let's quickly try to load it here,

159
00:08:20,600 --> 00:08:23,870
‫but for some reason the changed files do not appear here.

160
00:08:23,870 --> 00:08:27,960
‫So, ideally, now app.js would be here in this list

161
00:08:27,960 --> 00:08:32,580
‫because that is the file that I just edited, okay?

162
00:08:32,580 --> 00:08:35,270
‫But, again, anyway, that's not really important.

163
00:08:35,270 --> 00:08:37,900
‫It should also show up here in this file tree

164
00:08:37,900 --> 00:08:42,530
‫with a different color as soon as I edited it, okay?

165
00:08:42,530 --> 00:08:44,623
‫Now if we say git status again,

166
00:08:46,280 --> 00:08:51,280
‫then you will see here modified: app.js, okay?

167
00:08:51,730 --> 00:08:54,160
‫So that's the only output that we have here,

168
00:08:54,160 --> 00:08:56,420
‫and you also see that the changed

169
00:08:56,420 --> 00:08:59,770
‫are not yet staged for commit, okay?

170
00:08:59,770 --> 00:09:02,670
‫And so now, again, let's add all of them.

171
00:09:02,670 --> 00:09:05,810
‫So git add and then -A,

172
00:09:05,810 --> 00:09:09,313
‫or we could also just add this single file to the add.

173
00:09:10,300 --> 00:09:14,440
‫So app.js, all right?

174
00:09:14,440 --> 00:09:18,430
‫Let's try git status again, and so now it is green.

175
00:09:18,430 --> 00:09:21,940
‫And so that means that the changes will be committed

176
00:09:21,940 --> 00:09:24,300
‫as soon as we do a new commit.

177
00:09:24,300 --> 00:09:27,743
‫So let's do that, git commit -m.

178
00:09:29,820 --> 00:09:34,820
‫For the message, Added a comment,

179
00:09:36,810 --> 00:09:38,550
‫and that's it.

180
00:09:38,550 --> 00:09:41,000
‫So, you see, the message added the comment.

181
00:09:41,000 --> 00:09:43,850
‫One file has changed and there was one insertion.

182
00:09:43,850 --> 00:09:45,450
‫So that's this line here.

183
00:09:45,450 --> 00:09:49,150
‫And so now that green bar that we had here is gone,

184
00:09:49,150 --> 00:09:52,600
‫and so that means that everything is now clean again.

185
00:09:52,600 --> 00:09:55,640
‫Now you also see that this master here,

186
00:09:55,640 --> 00:09:57,030
‫you also see it here,

187
00:09:57,030 --> 00:10:00,040
‫and that means that we are on the master branch.

188
00:10:00,040 --> 00:10:04,180
‫So branches are another very important concept in Git,

189
00:10:04,180 --> 00:10:07,070
‫but I will not really go into that at this point.

190
00:10:07,070 --> 00:10:10,750
‫For now we will always just work in the master branch.

191
00:10:10,750 --> 00:10:14,140
‫Great, so now you have a local repository

192
00:10:14,140 --> 00:10:16,920
‫with all your code committed to it.

193
00:10:16,920 --> 00:10:19,000
‫And so in the next video, let's actually

194
00:10:19,000 --> 00:10:22,480
‫push this branch onto a remote branch on GitHub.

195
00:10:22,480 --> 00:10:25,170
‫So basically host it on the GitHub account

196
00:10:25,170 --> 00:10:26,960
‫that we just created before.

197
00:10:26,960 --> 00:10:28,560
‫So I hope to see you there soon.