1
00:00:02,220 --> 00:00:04,870
So, what is this pop-up now?

2
00:00:04,870 --> 00:00:07,680
In case you're using a different editor by the way,

3
00:00:07,680 --> 00:00:09,740
you might not have this pop-up,

4
00:00:09,740 --> 00:00:13,750
but a different one prompting you to enter your user email,

5
00:00:13,750 --> 00:00:16,610
your username, or your password.

6
00:00:16,610 --> 00:00:19,760
The thing is here that although we established a connection

7
00:00:19,760 --> 00:00:22,140
to the remote repository,

8
00:00:22,140 --> 00:00:25,860
we don't have the permission to push to this repository.

9
00:00:25,860 --> 00:00:29,190
So to basically add code or add data

10
00:00:29,190 --> 00:00:31,440
to this remote repository.

11
00:00:31,440 --> 00:00:33,820
And this makes a lot of sense,

12
00:00:33,820 --> 00:00:37,520
because otherwise anybody who would have the URL

13
00:00:37,520 --> 00:00:41,120
of this remote repository could interact with it.

14
00:00:41,120 --> 00:00:44,250
That's of course not how it's supposed to be.

15
00:00:44,250 --> 00:00:49,020
Therefore, to be able to push our code to the repository,

16
00:00:49,020 --> 00:00:53,970
we have to create a so-called personal access token.

17
00:00:53,970 --> 00:00:57,920
Now, where can we find this now and what is that?

18
00:00:57,920 --> 00:01:00,500
Back on GitHub,

19
00:01:00,500 --> 00:01:04,220
we can create this personal access token

20
00:01:04,220 --> 00:01:08,670
here in our profile there under settings.

21
00:01:08,670 --> 00:01:10,270
Before we'll go there though,

22
00:01:10,270 --> 00:01:14,040
the question is why can we create this token right here,

23
00:01:14,040 --> 00:01:18,260
and not individually for a specific repository,

24
00:01:18,260 --> 00:01:22,590
in our case, for this web dev GitHub repository for example.

25
00:01:22,590 --> 00:01:25,100
Because the personal access token

26
00:01:25,100 --> 00:01:29,700
grants anybody who has this token, and that's important,

27
00:01:29,700 --> 00:01:34,700
anybody who has this token can access all repositories

28
00:01:35,020 --> 00:01:37,850
inside your GitHub account,

29
00:01:37,850 --> 00:01:40,733
via git by using this token.

30
00:01:41,620 --> 00:01:45,520
Therefore, you have to be very careful when using this token

31
00:01:45,520 --> 00:01:49,070
and you have to keep this well secretly for yourself.

32
00:01:49,070 --> 00:01:52,620
Otherwise, as I said, other people can access

33
00:01:52,620 --> 00:01:55,800
your GitHub repos via git by using

34
00:01:55,800 --> 00:01:57,713
this personal access token.

35
00:01:58,550 --> 00:02:02,083
However, you can create this token here under settings.

36
00:02:03,150 --> 00:02:07,463
There we'll scroll down a bit to the developer settings,

37
00:02:09,520 --> 00:02:13,590
and there we go to personal access tokens.

38
00:02:13,590 --> 00:02:14,493
This option.

39
00:02:15,550 --> 00:02:18,430
In here, we can now generate a new token,

40
00:02:18,430 --> 00:02:19,793
over here with this button,

41
00:02:21,510 --> 00:02:24,830
and I'll just give it a name, what it's for,

42
00:02:24,830 --> 00:02:26,600
maybe let's say web

43
00:02:27,670 --> 00:02:28,503
dev

44
00:02:29,380 --> 00:02:30,900
course

45
00:02:30,900 --> 00:02:32,320
GitHub

46
00:02:32,320 --> 00:02:33,220
access,

47
00:02:33,220 --> 00:02:34,143
for example.

48
00:02:35,020 --> 00:02:38,770
Below that, you can define an expiration for this token,

49
00:02:38,770 --> 00:02:42,940
so a specific amount of days, or no expiration at all.

50
00:02:42,940 --> 00:02:45,980
And below here you can define which kind

51
00:02:45,980 --> 00:02:48,710
of access rights you grant the user,

52
00:02:48,710 --> 00:02:52,073
so yourself, in this case, who has this access token.

53
00:02:52,970 --> 00:02:56,220
For example, we want to have full control

54
00:02:56,220 --> 00:02:57,960
of private repositories,

55
00:02:57,960 --> 00:02:59,930
at the moment we have a public repository,

56
00:02:59,930 --> 00:03:02,770
but this might change throughout this module.

57
00:03:02,770 --> 00:03:06,720
We want to be able to write and read inside the repositories

58
00:03:06,720 --> 00:03:08,550
of this user account.

59
00:03:08,550 --> 00:03:10,270
We might want to delete things

60
00:03:10,270 --> 00:03:12,700
and here we could define some admin topics,

61
00:03:12,700 --> 00:03:14,800
which we actually don't need.

62
00:03:14,800 --> 00:03:16,820
And I think this is all right.

63
00:03:16,820 --> 00:03:19,830
Maybe some user settings can be ticked, and with that,

64
00:03:19,830 --> 00:03:21,403
we should be ready to go.

65
00:03:22,530 --> 00:03:26,410
Let's not generate the token until you can see

66
00:03:26,410 --> 00:03:27,720
this secret token.

67
00:03:27,720 --> 00:03:30,090
So my secret token, by the way,

68
00:03:30,090 --> 00:03:33,360
at the point of time where you are watching this video,

69
00:03:33,360 --> 00:03:35,190
this token is not valid anymore.

70
00:03:35,190 --> 00:03:37,340
So please don't copy it.

71
00:03:37,340 --> 00:03:41,160
And now we can copy this token by clicking right here,

72
00:03:41,160 --> 00:03:42,823
and go back to VS code.

73
00:03:44,230 --> 00:03:46,900
And there, we won't select allow now

74
00:03:46,900 --> 00:03:51,520
because this would open a dedicated VS code extension.

75
00:03:51,520 --> 00:03:54,280
I want to enter the credentials differently though,

76
00:03:54,280 --> 00:03:58,290
so we will click cancel, and up here now,

77
00:03:58,290 --> 00:04:01,240
we can enter our user name first,

78
00:04:01,240 --> 00:04:03,453
so our GitHub username,

79
00:04:04,650 --> 00:04:08,220
you can find this name again up here in your profile,

80
00:04:08,220 --> 00:04:11,000
so this is the name you have to enter here.

81
00:04:11,000 --> 00:04:13,713
So not my name, your name, of course, in this case.

82
00:04:14,820 --> 00:04:18,233
So let me do that and confirm it with enter.

83
00:04:19,250 --> 00:04:21,649
Now we have to enter the password

84
00:04:21,649 --> 00:04:25,240
and the password now is the personal access token,

85
00:04:25,240 --> 00:04:27,133
so please paste this token now.

86
00:04:28,060 --> 00:04:30,380
And with this, we are hopefully able,

87
00:04:30,380 --> 00:04:31,730
yes, this looks good,

88
00:04:31,730 --> 00:04:36,730
to add this content of our repository to GitHub,

89
00:04:37,330 --> 00:04:38,700
and this looks all right.

90
00:04:38,700 --> 00:04:40,390
We see we created a new branch,

91
00:04:40,390 --> 00:04:42,790
so the main branch on GitHub.

92
00:04:42,790 --> 00:04:45,463
Therefore, if we go back to GitHub now,

93
00:04:47,960 --> 00:04:51,373
and go back to our starting page here,

94
00:04:53,330 --> 00:04:57,080
you see that now we have that newly created repository.

95
00:04:57,080 --> 00:04:59,330
So nothing new, so we can access it here.

96
00:04:59,330 --> 00:05:02,430
So this web dev GitHub repository,

97
00:05:02,430 --> 00:05:07,430
and now this is what the repository page looks like.

98
00:05:07,630 --> 00:05:10,040
Again, you can see the repository name,

99
00:05:10,040 --> 00:05:13,450
and the fact that this is a public repository.

100
00:05:13,450 --> 00:05:15,640
There you can find the code section,

101
00:05:15,640 --> 00:05:18,410
and this section contains all the code

102
00:05:18,410 --> 00:05:21,740
that you have inside this repository.

103
00:05:21,740 --> 00:05:24,070
All the code here, of course, refers

104
00:05:24,070 --> 00:05:27,080
to all the branches and all the commits.

105
00:05:27,080 --> 00:05:30,080
Here we can see that we are in the main branch

106
00:05:30,080 --> 00:05:32,603
and that we only have the main branch in here.

107
00:05:34,340 --> 00:05:36,950
And in this branch, we can now access, of course,

108
00:05:36,950 --> 00:05:38,480
the content in this branch,

109
00:05:38,480 --> 00:05:42,320
so we can access folders and go back if we want to.

110
00:05:42,320 --> 00:05:45,710
And we can also check the different commits inside of this

111
00:05:45,710 --> 00:05:49,010
branch by clicking onto this commits area here.

112
00:05:49,010 --> 00:05:50,163
So let's do that.

113
00:05:51,110 --> 00:05:54,010
And there you see all the commits we added so far

114
00:05:54,010 --> 00:05:56,440
in this branch locally on git.

115
00:05:56,440 --> 00:06:00,010
Now, also available on GitHub.

116
00:06:00,010 --> 00:06:02,040
If we go back to the code section here,

117
00:06:02,040 --> 00:06:04,640
we are back there, and there we also have now

118
00:06:04,640 --> 00:06:08,210
this code button with the URL of this repository

119
00:06:08,210 --> 00:06:11,083
that you can use to establish the connection to it.

120
00:06:12,070 --> 00:06:15,470
So this is how we can create a remote repository,

121
00:06:15,470 --> 00:06:17,800
an empty remote repository,

122
00:06:17,800 --> 00:06:20,980
and how we can then establish a connection

123
00:06:20,980 --> 00:06:23,880
from the local to the remote repository,

124
00:06:23,880 --> 00:06:27,640
and how we can then bring this locally created project

125
00:06:27,640 --> 00:06:29,413
to the remote repository.

126
00:06:30,570 --> 00:06:34,710
What if we now have another scenario where we are working

127
00:06:34,710 --> 00:06:37,630
from a different computer where this project

128
00:06:37,630 --> 00:06:39,630
is not available at all.

129
00:06:39,630 --> 00:06:43,573
And where we would like to access this project now via git?

130
00:06:44,740 --> 00:06:47,520
Well then the process is a bit different,

131
00:06:47,520 --> 00:06:50,390
and as I would like to simulate the situation

132
00:06:50,390 --> 00:06:52,910
from the machine I'm currently working on,

133
00:06:52,910 --> 00:06:55,860
first we should get rid of our current

134
00:06:55,860 --> 00:06:58,310
personal access token that we added.

135
00:06:58,310 --> 00:07:02,010
So to simulate basically a machine which doesn't have access

136
00:07:02,010 --> 00:07:05,160
to this GitHub account here.

137
00:07:05,160 --> 00:07:08,983
For this, I'll go back to VS code and clear this,

138
00:07:09,860 --> 00:07:13,550
and now to get rid of the credentials we just added,

139
00:07:13,550 --> 00:07:16,350
which might also be the case on your computer,

140
00:07:16,350 --> 00:07:19,240
if you want to have access to another GitHub

141
00:07:19,240 --> 00:07:20,660
account that you might own,

142
00:07:20,660 --> 00:07:23,880
that's why I want to show you this resetting process

143
00:07:23,880 --> 00:07:26,270
for the personal access token.

144
00:07:26,270 --> 00:07:27,670
So to do this,

145
00:07:27,670 --> 00:07:29,190
we have to enter, well,

146
00:07:29,190 --> 00:07:32,303
three lines of code here in the command line.

147
00:07:33,390 --> 00:07:35,180
The first is,

148
00:07:35,180 --> 00:07:36,310
git

149
00:07:36,310 --> 00:07:38,260
credential

150
00:07:38,260 --> 00:07:39,420
dash

151
00:07:39,420 --> 00:07:40,970
OSX

152
00:07:41,920 --> 00:07:43,750
key chain

153
00:07:43,750 --> 00:07:44,800
space

154
00:07:44,800 --> 00:07:46,060
erase

155
00:07:46,060 --> 00:07:50,170
this simply refers to the MacOS keychain

156
00:07:50,170 --> 00:07:54,810
which saves these keys internally and safely for you.

157
00:07:54,810 --> 00:07:57,810
So we want to get rid of a specific key restored

158
00:07:57,810 --> 00:08:00,990
in that Apple or MacOS keychain.

159
00:08:00,990 --> 00:08:02,750
So let's confirm this with enter.

160
00:08:02,750 --> 00:08:06,580
Now we have to enter the host of this specific key,

161
00:08:06,580 --> 00:08:10,020
and the host here is equal to github.com.

162
00:08:12,990 --> 00:08:15,560
Let's also confirm this with enter

163
00:08:15,560 --> 00:08:18,370
and the protocol is

164
00:08:19,809 --> 00:08:21,220
HTTPS.

165
00:08:21,220 --> 00:08:23,810
Let's also confirm this with enter,

166
00:08:23,810 --> 00:08:27,370
and now hitting enter twice to make sure it works,

167
00:08:27,370 --> 00:08:30,600
has deleted our personal access token.

168
00:08:30,600 --> 00:08:33,130
So basically our way to interact

169
00:08:33,130 --> 00:08:35,000
with this remote repository,

170
00:08:35,000 --> 00:08:38,039
which means this sets this machine now equal

171
00:08:38,039 --> 00:08:42,130
to a machine which doesn't have access to this project.

172
00:08:42,130 --> 00:08:44,140
Let me clear this now.

173
00:08:44,140 --> 00:08:47,010
Besides this, we still have the project locally

174
00:08:47,010 --> 00:08:48,950
on git here though, and for this,

175
00:08:48,950 --> 00:08:51,673
I'll now close my VS code instance here.

176
00:08:53,520 --> 00:08:55,213
I'll quit Visual Studio code.

177
00:08:56,320 --> 00:08:59,010
And now I'm back on my desktop in this case,

178
00:08:59,010 --> 00:08:59,843
and here,

179
00:08:59,843 --> 00:09:03,080
this git basics folder contains the project

180
00:09:03,080 --> 00:09:05,560
that we just created throughout this module

181
00:09:05,560 --> 00:09:09,250
and I'll now simply delete this, like that.

182
00:09:09,250 --> 00:09:12,720
And with this, this is another machine so to say,

183
00:09:12,720 --> 00:09:14,960
which doesn't contain this project at all,

184
00:09:14,960 --> 00:09:17,480
and which doesn't have any access rights

185
00:09:17,480 --> 00:09:19,483
to this GitHub repository.

186
00:09:21,920 --> 00:09:26,490
Now let me create a new folder first, and call it,

187
00:09:26,490 --> 00:09:29,610
maybe GitHub like this.

188
00:09:29,610 --> 00:09:33,200
And now I'll open a new visual studio code instance,

189
00:09:33,200 --> 00:09:36,310
and drag this folder into it.

190
00:09:36,310 --> 00:09:40,600
And yes, we again, trust the offers and we can close this.

191
00:09:40,600 --> 00:09:45,123
Now let's open our terminal by view, appearance,

192
00:09:46,480 --> 00:09:48,840
and show panel here,

193
00:09:48,840 --> 00:09:50,200
And now the question is,

194
00:09:50,200 --> 00:09:53,740
how can we now bring our remote repos content

195
00:09:53,740 --> 00:09:55,670
to this local repo?

196
00:09:55,670 --> 00:09:58,520
Please note that at the moment, this isn't a repo though,

197
00:09:58,520 --> 00:10:01,410
as I didn't initialize git so far.

198
00:10:01,410 --> 00:10:02,310
I'm aware of that.

199
00:10:03,200 --> 00:10:05,790
But for this, we need another git command

200
00:10:05,790 --> 00:10:09,360
and this is git clone now.

201
00:10:09,360 --> 00:10:12,890
Clone will simply, well clone, the content

202
00:10:12,890 --> 00:10:17,890
of an existing remote repository into our local repository.

203
00:10:18,390 --> 00:10:22,000
To make sure cloning is successful though, we need what?

204
00:10:22,000 --> 00:10:24,560
The URL again, of our repo,

205
00:10:24,560 --> 00:10:27,430
therefore back in GitHub once again.

206
00:10:27,430 --> 00:10:31,323
We go to this code button and copy it right here.

207
00:10:32,610 --> 00:10:37,270
Now let's go back and paste this URL and now stop.

208
00:10:37,270 --> 00:10:39,950
If we would run the command like this now,

209
00:10:39,950 --> 00:10:41,460
this wouldn't be a problem,

210
00:10:41,460 --> 00:10:45,820
but we would create a sub folder inside this GitHub folder,

211
00:10:45,820 --> 00:10:47,720
we would create another folder,

212
00:10:47,720 --> 00:10:50,140
and this is not what I want at this stage.

213
00:10:50,140 --> 00:10:53,480
Therefore, instead of running the command like this,

214
00:10:53,480 --> 00:10:57,120
we'll add a space here and add a dot.

215
00:10:57,120 --> 00:11:00,180
With this, the content of the remote repository

216
00:11:00,180 --> 00:11:04,150
will be copied directly into this GitHub folder.

217
00:11:04,150 --> 00:11:05,233
Let's do this now.

218
00:11:06,070 --> 00:11:08,250
Now the cloning starts, and now it's done

219
00:11:08,250 --> 00:11:10,320
and as you see, we have the GitHub folder,

220
00:11:10,320 --> 00:11:11,960
and in there, the new feature folder,

221
00:11:11,960 --> 00:11:13,523
second commit and so on.

222
00:11:14,720 --> 00:11:16,390
Okay, so this is nice.

223
00:11:16,390 --> 00:11:19,100
So we now have access to this project again,

224
00:11:19,100 --> 00:11:21,050
locally on our machine.

225
00:11:21,050 --> 00:11:24,790
But what if we want to change something now.

226
00:11:24,790 --> 00:11:27,790
Let's say I create a new file and say,

227
00:11:27,790 --> 00:11:31,520
created after clone dot text,

228
00:11:31,520 --> 00:11:35,570
just to make sure we can identify this file easily.

229
00:11:35,570 --> 00:11:38,350
Now I'll add this, as we learned it.

230
00:11:38,350 --> 00:11:41,870
So git add, now git commit dash M,

231
00:11:41,870 --> 00:11:43,110
added

232
00:11:43,110 --> 00:11:44,570
local text

233
00:11:45,550 --> 00:11:48,423
file after clone,

234
00:11:51,440 --> 00:11:52,790
like this.

235
00:11:52,790 --> 00:11:55,750
And now, what if you run again,

236
00:11:55,750 --> 00:11:57,610
git push

237
00:11:57,610 --> 00:11:59,413
origin main.

238
00:12:00,620 --> 00:12:02,090
Does this work?

239
00:12:02,090 --> 00:12:04,590
And by the way, before we continue here,

240
00:12:04,590 --> 00:12:07,370
did you see that adding and committing worked,

241
00:12:07,370 --> 00:12:09,630
although we didn't initialize git,

242
00:12:09,630 --> 00:12:12,010
so we didn't run git in it at all.

243
00:12:12,010 --> 00:12:14,410
And this only work because with git clone,

244
00:12:14,410 --> 00:12:17,250
we copy the entire repository,

245
00:12:17,250 --> 00:12:20,440
including the interrogate logic.

246
00:12:20,440 --> 00:12:24,100
So we copied the full git project, so to say.

247
00:12:24,100 --> 00:12:27,563
However, with git push origin main, let's see what happens.

248
00:12:28,900 --> 00:12:31,790
You see, we have the same thing that we had before,

249
00:12:31,790 --> 00:12:34,430
we were able to clone the repository,

250
00:12:34,430 --> 00:12:36,870
this was possible, but again,

251
00:12:36,870 --> 00:12:40,400
adding content to it, changing the code, adding commits,

252
00:12:40,400 --> 00:12:43,860
is only possible with the corresponding permissions.

253
00:12:43,860 --> 00:12:46,510
So again, we can press cancel here

254
00:12:46,510 --> 00:12:49,400
to follow the same process as before.

255
00:12:49,400 --> 00:12:53,393
Now we have to enter our GitHub username once again,

256
00:12:54,440 --> 00:12:57,433
and now we need to add the personal access token.

257
00:12:58,390 --> 00:13:01,420
If you didn't copy that personal access token before,

258
00:13:01,420 --> 00:13:03,660
you have to create another one.

259
00:13:03,660 --> 00:13:06,700
And as you see in my case, I also didn't do this,

260
00:13:06,700 --> 00:13:08,440
therefore let's create one together.

261
00:13:08,440 --> 00:13:12,640
So we'll again, go to our profile here,

262
00:13:12,640 --> 00:13:16,853
go to settings, go down to developer settings,

263
00:13:17,760 --> 00:13:19,483
personal access tokens.

264
00:13:20,320 --> 00:13:23,640
Well, now you'll see, this is the previous token we had,

265
00:13:23,640 --> 00:13:25,670
I'll just copy the name to be honest,

266
00:13:25,670 --> 00:13:28,010
and I'll delete it now because I cannot access

267
00:13:28,010 --> 00:13:31,230
this token anymore, it's hidden, so let's delete it.

268
00:13:31,230 --> 00:13:33,272
Yes, I understand this.

269
00:13:33,272 --> 00:13:37,070
And now we'll create a new token, paste the name,

270
00:13:37,070 --> 00:13:40,910
and I'll again, give it access to repo, to workflows,

271
00:13:40,910 --> 00:13:42,973
write packages, to delete packages,

272
00:13:44,190 --> 00:13:47,100
no admin rights and user,

273
00:13:47,100 --> 00:13:49,940
and maybe some write access down here.

274
00:13:49,940 --> 00:13:52,713
And with this, we can generate the token again.

275
00:13:53,980 --> 00:13:55,573
Copy it from here.

276
00:13:58,900 --> 00:14:01,600
And paste it up there.

277
00:14:01,600 --> 00:14:03,700
With this in place, let's see.

278
00:14:03,700 --> 00:14:04,940
Yeah, this looks good.

279
00:14:04,940 --> 00:14:09,110
Now we pushed this new commit to our remote repository.

280
00:14:09,110 --> 00:14:11,540
Let's explore this again, but going back

281
00:14:11,540 --> 00:14:15,523
to our landing page, to our repository over here,

282
00:14:17,750 --> 00:14:19,740
and there you can find that we now have

283
00:14:19,740 --> 00:14:23,400
seven commits including this created after the clone

284
00:14:23,400 --> 00:14:26,650
text file that we just added.

285
00:14:26,650 --> 00:14:31,470
So this is how we can interact between git and GitHub.

286
00:14:31,470 --> 00:14:34,400
So far though, we are kind of working alone

287
00:14:34,400 --> 00:14:37,240
in this project, and as I also mentioned,

288
00:14:37,240 --> 00:14:39,700
GitHub is especially good to collaborate

289
00:14:39,700 --> 00:14:42,220
on projects with other developers.

290
00:14:42,220 --> 00:14:45,140
So let's explore the collaboration

291
00:14:45,140 --> 00:14:47,833
options we have in GitHub as a next step.

