1
00:00:00,180 --> 00:00:07,860
Now, drag and drop option is pretty cool, but one issue with that one is if I want to change something

2
00:00:07,860 --> 00:00:15,120
about my project, meaning anything starting from Cyesis all the way to Joske Cryptologic, every time

3
00:00:15,420 --> 00:00:17,120
I would need to make those changes.

4
00:00:17,250 --> 00:00:20,370
Then again, I would need to run my local build.

5
00:00:20,610 --> 00:00:25,400
And of course I would need to update that on that as well.

6
00:00:25,710 --> 00:00:28,060
And it gets somewhat annoying.

7
00:00:28,410 --> 00:00:36,210
So a better option would be setting up a GitHub repo, then connect our project to the repo, and then

8
00:00:36,210 --> 00:00:43,080
every time we'll have some kind of change in the project, we will push those updates to the GitHub

9
00:00:43,530 --> 00:00:45,690
and file automatically.

10
00:00:45,900 --> 00:00:47,860
We'll pick it up from there.

11
00:00:48,420 --> 00:00:53,910
Now, since this is an advanced course, I'm not going to cover how to create a up account.

12
00:00:54,480 --> 00:00:55,190
As I say, not.

13
00:00:55,200 --> 00:00:55,970
It is pretty, though.

14
00:00:56,340 --> 00:01:03,180
And what are the basic commands that we are going to be using in this video?

15
00:01:03,450 --> 00:01:09,840
If you need to study that, please just go to your search engine and within a matter of minutes you'll

16
00:01:09,840 --> 00:01:11,580
find all the answers.

17
00:01:11,940 --> 00:01:15,880
So I'm going to navigate to the GitHub and I'm going to create a new report.

18
00:01:16,310 --> 00:01:21,080
So you here again, I'll call this temporary just because I'll delete it, of course.

19
00:01:21,450 --> 00:01:26,910
So we're looking for temporary and then I'll call this a react project.

20
00:01:27,330 --> 00:01:30,180
And of course, you have option, public or private.

21
00:01:30,600 --> 00:01:32,280
I'm going to go with public.

22
00:01:33,570 --> 00:01:40,620
And then once we create this report, what we're looking for are of these commands so we can just copy

23
00:01:40,620 --> 00:01:47,860
and paste them like so now I'm going to navigate back to my project and I'll clear my integrity.

24
00:01:47,890 --> 00:01:52,010
Tomorrow, I'll initialize a new IT repository.

25
00:01:52,320 --> 00:01:54,960
I'll say that I would like to add everything here.

26
00:01:55,200 --> 00:02:03,120
And as far as the committee, which is going to say initial online comment, OK, good, we are in good

27
00:02:03,120 --> 00:02:03,540
shape.

28
00:02:03,760 --> 00:02:09,180
And now of course, I'm going to clear the terminal again and then I'll just pass these three commands.

29
00:02:09,510 --> 00:02:16,860
And essentially what we're doing, we're setting up that GitHub repo, the one that I just created to

30
00:02:16,860 --> 00:02:19,070
be our remote YORO.

31
00:02:19,350 --> 00:02:24,960
So essentially, every time we'll push some changes, they will be pushed to the curb.

32
00:02:25,230 --> 00:02:28,490
And I can check that out by now beginning to get up there.

33
00:02:28,500 --> 00:02:36,480
And of course, I can refresh and there is a this is my project and from here I would want to navigate

34
00:02:36,480 --> 00:02:37,590
back to the fly.

35
00:02:37,860 --> 00:02:41,620
And then I remember that second option, new side project.

36
00:02:41,910 --> 00:02:44,880
We click here and then we look for to get up.

37
00:02:45,330 --> 00:02:48,240
And then, of course, I already authorized it.

38
00:02:48,480 --> 00:02:52,200
If you're doing this for the first time, I might prompt you to do that.

39
00:02:52,410 --> 00:03:00,210
And then we're looking for react and then arm sorry it was time for already and then react and then

40
00:03:00,210 --> 00:03:00,780
project.

41
00:03:01,140 --> 00:03:06,420
I believe I was my name for Repo and there it is.

42
00:03:06,420 --> 00:03:09,030
Now I have my repo so I click over here.

43
00:03:09,890 --> 00:03:14,730
And then notice how we have this option of just deploying the site.

44
00:03:15,050 --> 00:03:21,020
So in this case, not LFI is running the building, we're not doing that locally.

45
00:03:21,170 --> 00:03:27,230
And also right away, it tells us, well, what is going to be the directory again, not a file.

46
00:03:27,230 --> 00:03:28,920
Do all of that for us.

47
00:03:29,240 --> 00:03:32,770
So we literally just need to click on deploy site.

48
00:03:32,990 --> 00:03:34,520
That's all we have to do.

49
00:03:34,910 --> 00:03:42,560
And what's really cool is that every time we'll have some kind of change will be able to push it so

50
00:03:42,560 --> 00:03:47,690
they get help online from their little file, will pick it up online.

51
00:03:47,750 --> 00:03:51,130
Just do the rebuild and I'll show you that in a second.

52
00:03:51,470 --> 00:03:57,590
First, please understand that, of course, now the bill process will take a little bit of time because

53
00:03:57,830 --> 00:04:04,400
the I doing that and while we're still on the subject, first I would want to change the site name.

54
00:04:05,530 --> 00:04:09,940
So here I'm going to go with temporary and then react.

55
00:04:10,860 --> 00:04:17,250
Project number two, my show, and as far as the Gocha, so the second Gotcher that I would want to

56
00:04:17,250 --> 00:04:20,200
cover, you need to change in a package.

57
00:04:20,220 --> 00:04:27,560
Jason, you build command where by default you'll just have a react script build.

58
00:04:28,020 --> 00:04:34,080
I can tell you right away that for all the projects, I already changed that for the package, Jason.

59
00:04:34,530 --> 00:04:41,460
So if you take a look at any project in the report, you'll find in a package, Jason, that command

60
00:04:41,460 --> 00:04:44,390
changed where essentially you just need this.

61
00:04:44,700 --> 00:04:48,060
See, I am the equal sign.

62
00:04:48,390 --> 00:04:49,680
So that's what you need to add.

63
00:04:49,950 --> 00:04:57,450
Otherwise, what happens even if you don't have any errors and everything runs smoothly locally when

64
00:04:57,450 --> 00:05:04,050
you're using local host or when you're using the built command, if you use this continuous deployment,

65
00:05:04,290 --> 00:05:07,410
you might get some weird errors.

66
00:05:07,540 --> 00:05:09,090
Again, you just add this.

67
00:05:09,270 --> 00:05:12,690
See, I am not equal on online.

68
00:05:12,720 --> 00:05:15,800
Of course, it has added to the built command.

69
00:05:16,140 --> 00:05:19,700
Now, if you want to check out the build it, go to deploys.

70
00:05:20,190 --> 00:05:25,200
And you can see around here that we have the deploy already.

71
00:05:25,570 --> 00:05:28,460
And of course the site is life.

72
00:05:28,860 --> 00:05:36,420
So if I navigate back to my temporary project, number two, it is going to be the same cocktail's project.

73
00:05:36,660 --> 00:05:44,220
But what's really cool that if I navigate back to my local project and in a source in the next jass,

74
00:05:44,520 --> 00:05:50,400
for some reason I decide that, you know, body won't have this Marine background color.

75
00:05:51,150 --> 00:05:52,950
It's going to have a color of red.

76
00:05:53,160 --> 00:05:58,650
And I'm going to show you locally, I'm just going to right away push it up to the get up again.

77
00:05:58,920 --> 00:06:01,320
I can the commands in the integrated terminal.

78
00:06:01,320 --> 00:06:06,510
Or if you're using visual pseudocode, there's a faster way where you just click on the icon.

79
00:06:06,630 --> 00:06:08,730
You need the message.

80
00:06:09,030 --> 00:06:11,820
So say a big change.

81
00:06:12,150 --> 00:06:17,670
And then, of course, I'll say that I would want to commit that and that I would want to push it up

82
00:06:17,670 --> 00:06:18,060
to the gate.

83
00:06:18,440 --> 00:06:23,160
Again, you can do it in an integrated terminal or you're using visual studio code.

84
00:06:23,430 --> 00:06:25,560
You can do it through the Gowri.

85
00:06:25,890 --> 00:06:32,760
And then if we navigate back, first of all, I can show you that I have the changes in the get up.

86
00:06:32,760 --> 00:06:35,100
Of course I have BCG changed.

87
00:06:35,430 --> 00:06:43,140
And what's really, really, really cool is that Nolfi is starting another build.

88
00:06:43,710 --> 00:06:44,900
So Naglfar checks.

89
00:06:44,910 --> 00:06:48,030
Hey, listen, there were some changes here.

90
00:06:48,030 --> 00:06:49,650
They're all so beautiful.

91
00:06:49,650 --> 00:06:51,330
Now I just need to rebuild the site.

92
00:06:51,660 --> 00:06:55,200
And as you can see, site is ready to go.

93
00:06:55,470 --> 00:06:57,870
And once I open, I don't see the change.

94
00:06:58,740 --> 00:06:59,340
Interesting.

95
00:06:59,640 --> 00:07:00,990
So it may never get back.

96
00:07:00,990 --> 00:07:07,170
And I can see that the background is equal to the color shall be equal to read.

97
00:07:07,350 --> 00:07:12,600
My apologies, Monsarrat, and let's do one more comment.

98
00:07:13,080 --> 00:07:19,070
We're going to go with BCG changed to Red Mark.

99
00:07:19,080 --> 00:07:21,570
So again, same spiel.

100
00:07:22,170 --> 00:07:24,170
Why push it up now?

101
00:07:24,180 --> 00:07:28,230
Again, we can double check and grab our fresh.

102
00:07:28,890 --> 00:07:36,840
I can see that BCG change the red notice if we navigate to the identify which we have deploy now I have

103
00:07:36,840 --> 00:07:37,410
the first one.

104
00:07:37,560 --> 00:07:41,720
The BCG changed and then I have big change to read.

105
00:07:42,180 --> 00:07:49,410
Far as you can see, every time you do something with a project, not a fight, we'll start the rebuild.

106
00:07:49,650 --> 00:07:55,560
So now where you don't have to complete those manual steps, where you have the change and then you

107
00:07:55,560 --> 00:08:00,180
run the build manually and then you do the drag and drop, you want to check it out.

108
00:08:00,190 --> 00:08:05,220
The actual deploy just open up to deploy and then you can scroll down.

109
00:08:05,610 --> 00:08:13,500
And if everything is correct, which it is, we have a site is live, so hopefully now everything works

110
00:08:13,500 --> 00:08:14,760
and I can already see.

111
00:08:14,940 --> 00:08:18,420
Yep, I have my background set too.

112
00:08:18,450 --> 00:08:18,840
All right.

113
00:08:19,350 --> 00:08:21,840
So these are two flavors we can use.

114
00:08:21,840 --> 00:08:27,330
We're not far either drag and drop or we have continuous deployment option.

115
00:08:27,660 --> 00:08:30,420
Just keep in mind about those two gotchas.

116
00:08:30,750 --> 00:08:37,230
One year we have reactor water where we would have to add the underscore redirect.

117
00:08:37,530 --> 00:08:41,310
And the second one is if we're using continuous deployment.

118
00:08:41,310 --> 00:08:42,570
And by the way, this is important.

119
00:08:42,900 --> 00:08:49,230
If you're using local build, you won't have issues or if you're using the continuous deployment, then

120
00:08:49,230 --> 00:08:57,000
you must change your build command and you need to see I am an equal sign in front of the React script

121
00:08:57,000 --> 00:08:57,390
build.