1
00:00:00,330 --> 00:00:00,830
Okay.

2
00:00:00,840 --> 00:00:01,660
Here goes nothing.

3
00:00:01,680 --> 00:00:04,080
I'm going to demonstrate these centralized workflow.

4
00:00:04,290 --> 00:00:06,570
I'm working with the same two user accounts.

5
00:00:06,570 --> 00:00:11,070
Same to get users, colts and good old Stevie Chicks.

6
00:00:11,070 --> 00:00:11,970
My chicken.

7
00:00:12,630 --> 00:00:15,420
Well, you can see Stevie Chicks.

8
00:00:15,420 --> 00:00:16,770
That's who I'm signed in here.

9
00:00:16,770 --> 00:00:18,930
Once again, pay attention to what you see up top.

10
00:00:19,350 --> 00:00:22,770
That is very important to differentiate between the different users.

11
00:00:23,040 --> 00:00:23,460
All right.

12
00:00:23,460 --> 00:00:25,800
So I've made a repo called centralized workflow.

13
00:00:25,800 --> 00:00:31,380
Colt is the owner and I've gone ahead and added Stevie Chicks as a collaborator.

14
00:00:31,380 --> 00:00:35,610
As you can see here, I just fast forwarded or I didn't even fast forward.

15
00:00:35,610 --> 00:00:38,610
I skipped through that part entirely because it just takes time.

16
00:00:38,610 --> 00:00:41,820
I had to open the email and accept the invite as Stevie.

17
00:00:41,910 --> 00:00:43,470
But anyway, we both have access.

18
00:00:43,470 --> 00:00:44,640
It's a public repo for now.

19
00:00:44,640 --> 00:00:45,450
It doesn't matter.

20
00:00:45,450 --> 00:00:50,850
And Colt's already added a simple read me and I actually did that all in the browser.

21
00:00:50,850 --> 00:00:57,450
I don't have this on my local machine, so I am going to clone this down as colt so make sure I'm not

22
00:00:57,450 --> 00:00:58,290
in a git repo.

23
00:00:58,290 --> 00:00:59,250
Get status.

24
00:00:59,250 --> 00:00:59,880
Cool.

25
00:00:59,880 --> 00:01:02,250
So get clone that url.

26
00:01:04,129 --> 00:01:04,580
Okay.

27
00:01:04,760 --> 00:01:11,030
So now we have that folder get status, we've got the read me and I'll open that over here.

28
00:01:11,690 --> 00:01:18,680
So there's that file there and then I'll go ahead and clone the same repo down to Steve's local machine

29
00:01:18,680 --> 00:01:20,330
so that we can both work on it.

30
00:01:20,330 --> 00:01:25,880
Just like we would just like in the diagrams where in this centralized workflow, everybody clones or

31
00:01:25,880 --> 00:01:29,150
everybody gets the same starting repo, the same remotes.

32
00:01:29,150 --> 00:01:30,650
So that's what I'm going to do here.

33
00:01:31,520 --> 00:01:33,170
So I'm going to copy this URL.

34
00:01:34,850 --> 00:01:39,890
And then as Stevie cloned it and just as a reminder, I had to do.

35
00:01:39,920 --> 00:01:44,930
I had to jump through some hoops in order to have these two different accounts and be able to clone

36
00:01:44,930 --> 00:01:48,110
as separate users with different SSH keys.

37
00:01:48,110 --> 00:01:52,090
So I actually did tweak my URL a bit to make this all work.

38
00:01:52,100 --> 00:01:55,850
It doesn't really matter because I'm not expecting you to do it, but I just want to be very clear and

39
00:01:55,850 --> 00:01:57,050
transparent about that.

40
00:01:57,650 --> 00:02:02,210
I am on one machine and normally you don't have two different accounts and two different ssh keys and

41
00:02:02,210 --> 00:02:02,780
all of that.

42
00:02:03,020 --> 00:02:06,800
Anyway, I clone that we see centralized workflow.

43
00:02:07,070 --> 00:02:07,820
Great.

44
00:02:08,180 --> 00:02:09,919
And we're now working on that.

45
00:02:09,919 --> 00:02:11,890
I'll open it in Stevie's editor, too.

46
00:02:12,080 --> 00:02:13,940
Okay, so now we both have it.

47
00:02:13,940 --> 00:02:15,530
We've cloned, we're ready to go.

48
00:02:15,650 --> 00:02:17,420
So we're going to make a simple website.

49
00:02:17,420 --> 00:02:19,340
I'm talking very, very simple.

50
00:02:19,340 --> 00:02:21,560
And Colt is going to start it off.

51
00:02:21,560 --> 00:02:29,150
Cold is going to make the index that HTML, our main file, the entry point into our app and then he's

52
00:02:29,150 --> 00:02:30,350
going to add and commit that.

53
00:02:30,350 --> 00:02:36,770
So we'll do a git add index, get commit dash add index HTML.

54
00:02:36,770 --> 00:02:41,360
I'm doing super short and kind of terrible commit messages, but that's fine.

55
00:02:41,360 --> 00:02:44,720
And then what I'm going to do is use bootstrap.

56
00:02:44,720 --> 00:02:46,700
So if you're familiar with bootstrap, great.

57
00:02:46,700 --> 00:02:52,160
If not, it doesn't really matter because I'm not expecting you to follow along, but I'm going to open

58
00:02:52,160 --> 00:02:56,900
that HTML file and add some basic bootstrap boilerplate.

59
00:02:57,050 --> 00:02:57,390
Okay.

60
00:02:57,470 --> 00:03:02,240
So I put that in there and I'll add and commit that as cold.

61
00:03:02,270 --> 00:03:03,770
Get add index.

62
00:03:03,800 --> 00:03:04,880
Get commit.

63
00:03:06,860 --> 00:03:10,130
Had bootstrap boilerplate.

64
00:03:10,340 --> 00:03:10,730
All right.

65
00:03:10,730 --> 00:03:13,460
So now we're going to push this up clear.

66
00:03:13,670 --> 00:03:16,490
I'm going to push those two commits to Origin Main.

67
00:03:16,490 --> 00:03:20,060
If we're all working on one branch, in this case, it will be the main branch.

68
00:03:20,060 --> 00:03:25,630
But in the diagrams I created, it's the master branch everyone's working on, but it's the same concept.

69
00:03:25,640 --> 00:03:31,640
So basically right now we're playing the role of forest, doing some commits and pushing them up.

70
00:03:31,970 --> 00:03:33,540
All right, so that's what I'm going to do.

71
00:03:33,560 --> 00:03:34,940
Get push origin Main.

72
00:03:35,790 --> 00:03:37,230
And that goes up to GitHub.

73
00:03:38,010 --> 00:03:43,940
And now if we refresh our repository we see index.html write this is now up here.

74
00:03:43,950 --> 00:03:47,610
So now as Steve we definitely want to pull down those changes.

75
00:03:47,610 --> 00:03:48,110
Right.

76
00:03:48,630 --> 00:03:51,750
So get pull origin main just to start.

77
00:03:53,710 --> 00:03:54,220
All right.

78
00:03:54,340 --> 00:03:58,650
So now we have that new file index of HTML and let's get to work.

79
00:03:58,660 --> 00:04:04,690
Let's say that Colt has been tasked with making a form on their web page, a simple form.

80
00:04:05,080 --> 00:04:08,620
So we're just going to copy some of the forms from the documentation.

81
00:04:08,830 --> 00:04:11,470
Maybe it's a form that looks like.

82
00:04:11,860 --> 00:04:13,840
Sure, maybe it's just a login form.

83
00:04:13,930 --> 00:04:16,690
So we're just going to copy this just to keep everything short.

84
00:04:16,690 --> 00:04:19,060
So this is on Colt's machine.

85
00:04:19,959 --> 00:04:23,650
We'll put this in the body, we'll add a bootstrap container.

86
00:04:25,380 --> 00:04:25,740
Okay.

87
00:04:25,770 --> 00:04:27,090
So this is the work.

88
00:04:27,120 --> 00:04:28,900
We'll pretend this took all morning.

89
00:04:28,920 --> 00:04:31,920
Colt did this work so then cold decides.

90
00:04:32,220 --> 00:04:34,260
So weird saying my name in third person.

91
00:04:34,260 --> 00:04:37,940
But anyway I decide it's time to make a commit.

92
00:04:37,950 --> 00:04:40,320
So always check get status.

93
00:04:40,320 --> 00:04:41,310
All right, get.

94
00:04:41,310 --> 00:04:42,570
I'll just do a one liner.

95
00:04:42,600 --> 00:04:52,980
Get dash or get commit dash am for would we do add basic to the login form that we made sure log in

96
00:04:52,980 --> 00:04:53,580
form.

97
00:04:54,270 --> 00:05:00,810
All right so now pushes this up he wants everyone else to to know about this so get push origin main.

98
00:05:02,070 --> 00:05:07,380
Now at the same time all of this has been happening, Stevie is working on some other feature.

99
00:05:07,410 --> 00:05:10,020
Stevie has been tasked with adding a nav bar.

100
00:05:10,440 --> 00:05:11,340
Probably not.

101
00:05:11,580 --> 00:05:19,650
Not exactly a super realistic reflection of a real workplace where one person is asked to just put a

102
00:05:19,650 --> 00:05:24,570
form on a page and somebody else is asked to independently put some random nav bar on a page, and then

103
00:05:24,570 --> 00:05:26,040
they're expected to combine it.

104
00:05:26,040 --> 00:05:33,330
Usually there would be some sort of design process and some sort of mockup or wireframes or something.

105
00:05:33,330 --> 00:05:35,460
That would be what we were trying to recreate.

106
00:05:35,460 --> 00:05:37,350
But anyway, let's just say it's a free for all.

107
00:05:37,350 --> 00:05:42,690
Steve has been asked to add a nav bar, so on bootstrap we can make all sorts of fancy nav bars like

108
00:05:42,690 --> 00:05:46,230
this one here again, I'm just going to copy this.

109
00:05:46,470 --> 00:05:47,220
Just straight up.

110
00:05:47,220 --> 00:05:47,940
Copy it.

111
00:05:47,940 --> 00:05:49,200
I don't want to waste your time.

112
00:05:49,500 --> 00:05:52,620
So, Stevie, this is Stevie's desktop here.

113
00:05:52,620 --> 00:05:54,990
Puts that in index.html.

114
00:05:56,350 --> 00:05:59,470
Puts it right above everything else.

115
00:05:59,650 --> 00:06:01,190
So this is Steve's work.

116
00:06:01,210 --> 00:06:03,170
Let's see what it looks like if we refresh.

117
00:06:03,190 --> 00:06:04,540
There's the nav bar.

118
00:06:05,050 --> 00:06:14,650
Okay, so then Steve adds and commits that get add index get commit dash m add bootstrap nav bar.

119
00:06:16,570 --> 00:06:20,470
So then he keeps working and then maybe he makes another small tweak.

120
00:06:20,500 --> 00:06:23,390
He actually wants this to be a dark nav bar.

121
00:06:23,410 --> 00:06:29,740
So on the naff bar, we can change this left nav bar or light to be nav bar dark and then give it a

122
00:06:29,740 --> 00:06:31,210
dark background.

123
00:06:31,720 --> 00:06:35,020
So bg dark like this.

124
00:06:35,350 --> 00:06:36,570
Let's see what that looks like.

125
00:06:36,580 --> 00:06:38,110
All right, so that's what Steve wants.

126
00:06:38,620 --> 00:06:41,950
And then he realizes, Oh, you know what?

127
00:06:41,950 --> 00:06:44,080
This is supposed to be responsive.

128
00:06:44,080 --> 00:06:45,010
And it is.

129
00:06:45,010 --> 00:06:47,690
Except why is this draw not working right?

130
00:06:47,710 --> 00:06:50,700
He wants this draw like it does on the documentation.

131
00:06:50,710 --> 00:06:51,310
Oops.

132
00:06:51,310 --> 00:06:52,600
It's on this page, isn't it?

133
00:06:53,290 --> 00:06:55,810
On the documentation when this collapses.

134
00:06:56,200 --> 00:06:57,100
Right there.

135
00:06:57,400 --> 00:07:03,040
There's this dropdown that's supposed to show up, this draw that expands, but it's not happening on

136
00:07:03,040 --> 00:07:04,870
Steve's copy, and he's freaking out.

137
00:07:04,870 --> 00:07:05,740
He's very junior.

138
00:07:05,920 --> 00:07:06,930
I mean, he's a chicken.

139
00:07:06,940 --> 00:07:08,440
He doesn't know what's going on.

140
00:07:08,440 --> 00:07:09,940
So he decides, you know what?

141
00:07:09,940 --> 00:07:11,580
I should just ask Colt.

142
00:07:11,590 --> 00:07:13,710
He's somewhat experienced with this.

143
00:07:13,720 --> 00:07:14,890
I'm going to just ask him.

144
00:07:14,890 --> 00:07:20,110
I'll send him a Slack message and I'll put my code up on GitHub so you probably know where I'm going

145
00:07:20,110 --> 00:07:20,640
with this.

146
00:07:20,650 --> 00:07:22,870
Steve He needs to put this code on GitHub.

147
00:07:22,900 --> 00:07:24,580
He wants to put this half.

148
00:07:24,580 --> 00:07:25,690
I mean, it's it's working.

149
00:07:25,690 --> 00:07:26,350
It's a nav bar.

150
00:07:26,350 --> 00:07:27,160
It's showing up.

151
00:07:27,160 --> 00:07:29,520
But for whatever reason, it's not collapsing.

152
00:07:29,530 --> 00:07:31,360
He wants to share this with Colt.

153
00:07:31,360 --> 00:07:34,750
So Steve goes ahead and adds and commits.

154
00:07:34,750 --> 00:07:46,540
He needs to add that get add index, get commit dash m change nav bar color to dark or something.

155
00:07:46,780 --> 00:07:49,540
All right, so now, Steve, moment of truth.

156
00:07:49,570 --> 00:07:51,130
I'll make this a bit larger here.

157
00:07:51,430 --> 00:07:55,420
Now, he pushes this code up, and we're doing this centralized workflow.

158
00:07:55,480 --> 00:07:56,980
There's only one branch main.

159
00:07:56,980 --> 00:07:58,210
He pushes that up.

160
00:07:58,420 --> 00:08:01,360
So get push origin main.

161
00:08:03,330 --> 00:08:03,910
Oh.

162
00:08:03,930 --> 00:08:05,100
What does this say?

163
00:08:05,130 --> 00:08:06,480
Rejected.

164
00:08:06,690 --> 00:08:08,090
Oh, who saw this coming?

165
00:08:08,100 --> 00:08:10,880
Failed to push some refs to blah, blah, blah, blah, blah.

166
00:08:10,920 --> 00:08:15,220
Updates were rejected because the remote contains work that you do not have locally.

167
00:08:15,240 --> 00:08:18,200
This is usually caused by another repository pushing blah blah blah blah.

168
00:08:18,240 --> 00:08:20,820
So basically we ran into this problem.

169
00:08:20,820 --> 00:08:27,170
Oh my gosh, lots of desktops right here where if we try and push something up and we don't have all

170
00:08:27,180 --> 00:08:30,740
the new work from GitHub, get won't let us do that.

171
00:08:30,750 --> 00:08:33,650
So we first have to pull those new commits down.

172
00:08:33,659 --> 00:08:39,600
Basically, I have to get the work Stevie has to get the work that Colt pushed up to GitHub.

173
00:08:39,900 --> 00:08:40,860
Oh, boy.

174
00:08:40,890 --> 00:08:42,840
What a nightmare to talk about all of this.

175
00:08:43,230 --> 00:08:43,950
But right.

176
00:08:43,980 --> 00:08:45,030
There's these new commits.

177
00:08:45,030 --> 00:08:46,140
There's five commits here.

178
00:08:46,140 --> 00:08:49,860
The most recent one is the login form that Colt pushed up to GitHub.

179
00:08:49,890 --> 00:08:55,140
Stevie doesn't have that locally, so we have to pull down so we can do that.

180
00:08:55,320 --> 00:08:59,130
Get pull origin main.

181
00:09:01,150 --> 00:09:03,730
And it could have been worse, but there were still a merge.

182
00:09:03,730 --> 00:09:09,160
So we have this merge commits and it's saying merge branch, Maine, blah blah blah blah blah on into

183
00:09:09,160 --> 00:09:09,770
main.

184
00:09:09,790 --> 00:09:10,270
Sure.

185
00:09:10,270 --> 00:09:11,350
We'll just go with that.

186
00:09:11,350 --> 00:09:14,220
So this is what things now look like on Stevie's machine.

187
00:09:14,230 --> 00:09:20,530
He got the changes that Colt did for this form, so now he can push up, hopefully.

188
00:09:20,620 --> 00:09:21,150
Let's see.

189
00:09:21,160 --> 00:09:22,120
Get status.

190
00:09:22,120 --> 00:09:23,440
Yes, he's good to go.

191
00:09:23,440 --> 00:09:29,260
So he can push up, get push origin main, which is what we tried to do in the first place.

192
00:09:29,260 --> 00:09:29,620
Right.

193
00:09:29,620 --> 00:09:31,390
We don't even have this finished nav bar.

194
00:09:31,390 --> 00:09:33,010
It's still not really working.

195
00:09:33,010 --> 00:09:34,330
We want to push that up.

196
00:09:34,870 --> 00:09:35,110
Okay.

197
00:09:35,260 --> 00:09:37,720
We go to GitHub and it does show up here.

198
00:09:37,720 --> 00:09:41,710
We can see on index we have the nav bar content.

199
00:09:41,710 --> 00:09:47,530
So in the meantime, it's the next day Colt shows up to work and he starts doing some other stuff.

200
00:09:47,530 --> 00:09:49,960
Let's say he's just making some minor tweaks.

201
00:09:50,050 --> 00:09:51,790
He's changing the form.

202
00:09:52,300 --> 00:09:56,680
I don't know what he's doing to the form instead of, We'll never share your email with anyone else.

203
00:09:56,680 --> 00:10:00,340
We'll always share your email with everyone.

204
00:10:00,340 --> 00:10:01,900
So he's just making some changes.

205
00:10:01,900 --> 00:10:06,850
And then he gets that message from Stevie saying, Hey, I just pushed up new some new code, this broken

206
00:10:06,850 --> 00:10:07,090
nav.

207
00:10:07,090 --> 00:10:08,590
Mark, can you try and fix it for me?

208
00:10:08,590 --> 00:10:16,300
So Colt then has to decide, okay, well, I have these changes right on my master branch or my main

209
00:10:16,300 --> 00:10:19,090
branch, the only branch allowed in this workflow.

210
00:10:19,480 --> 00:10:21,370
Oh, you can see, it's kind of a nightmare.

211
00:10:21,520 --> 00:10:23,860
I have changes that are not ready to commit.

212
00:10:23,860 --> 00:10:24,610
What do I do?

213
00:10:24,610 --> 00:10:27,100
I want to go get that new stuff from Stevie.

214
00:10:27,820 --> 00:10:31,540
But if I try and pull right now, get pull Origin Main.

215
00:10:33,410 --> 00:10:34,910
And what do we see?

216
00:10:34,940 --> 00:10:37,060
Oh, it doesn't actually let me do it.

217
00:10:37,070 --> 00:10:39,880
It says your local changes to the following files would be overwritten.

218
00:10:39,890 --> 00:10:44,930
Please commit your changes or stash them before you merge so it doesn't even let me get the newest version,

219
00:10:44,930 --> 00:10:46,640
the newest work that Steve has done.

220
00:10:46,640 --> 00:10:49,760
So I need to commit or stash.

221
00:10:49,760 --> 00:10:52,880
I guess we could stash, but that's fine.

222
00:10:52,880 --> 00:10:54,140
So get stash.

223
00:10:55,520 --> 00:10:57,050
So now I can take a look.

224
00:10:57,050 --> 00:10:59,210
I can do a git pull or origin main again.

225
00:10:59,420 --> 00:11:00,560
We're all just working.

226
00:11:00,560 --> 00:11:02,210
We're stuck on this one branch.

227
00:11:02,630 --> 00:11:06,230
All right, now I get that new commit, hopefully from Stevie.

228
00:11:06,320 --> 00:11:07,700
Let's just take a look.

229
00:11:08,090 --> 00:11:09,890
We have the nav bar.

230
00:11:09,920 --> 00:11:13,010
It is showing up and it's not working.

231
00:11:13,070 --> 00:11:13,460
Right.

232
00:11:13,460 --> 00:11:16,070
I go back here, it's still broken.

233
00:11:16,070 --> 00:11:17,240
And that was the point.

234
00:11:17,240 --> 00:11:21,680
Stevie wanted help, and just to get help, he had to break the main branch.

235
00:11:21,710 --> 00:11:22,970
Our only branch.

236
00:11:22,970 --> 00:11:26,930
I mean, it's not truly broken, but he had to add this incomplete code to it.

237
00:11:26,930 --> 00:11:29,150
This isn't working and it's not ready for production.

238
00:11:29,150 --> 00:11:31,970
I will get in trouble from my boss.

239
00:11:31,970 --> 00:11:33,500
I can't do this sort of thing.

240
00:11:33,500 --> 00:11:36,380
So in the next video, we're going to talk about a much better workflow.