/
index.html
185 lines (183 loc) · 10.9 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UV-Compatible" content="IE-edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="index.css">
</head>
<body>
<div class="directions-container">
<h1>How to Make Your First Open Source Github Contribution 💙</h1>
<ol>
<li>
Fork and clone the repository to your local environment.
</li>
<br>
<li>
Start by making a pull request. This will keep
all the files locally up-to-date with the remote
repository, in the circumstance other developers you may be working with
have made any new changes. To do this, start off by confirming you are in the
main branch, and then in your command line type:
<br>
<br>
<section id="terminal__body">
<div id="terminal__prompt">
<span id="terminal__prompt--user">user@Users-MacBook_Air: git pull origin main</span>
<!-- <span id="terminal__prompt--location"></span>
<span id="terminal__prompt--bling"></span> -->
<span id="terminal__prompt--cursor"></span>
</div>
</section>
<br>
Running this command will pull all the files from the remote branch,
updating your local branch to match any changes made. It's always a good idea to do this,
especially when working with others as you don't know what changes could have been made since you
last accessed the branch.
</li>
<br>
<li>
After you've confirmed everything is up-to-date, you're going to check out a new
branch, this will be your staging area. If you're adding a new feature to any application, you want to preserve its original
state, this avoids big bugs and annoyed developers down the line. To do this, in the command line type:
<br>
<br>
<section id="terminal__body">
<div id="terminal__prompt">
<span id="terminal__prompt--user">user@Users-MacBook_Air: git checkout -b (YOUR BRANCH NAME)</span>
<span id="terminal__prompt--cursor"></span>
</div>
</section>
<br>
When naming your branch, it's good practice to name it after what you're doing/in relation to the
changes being made. So, if you were to make a pull request to add a README.md file into a repo, you might
name that branch 'readme-md'.
<p>
If you've done it correctly, you should have received the following message in your terminal:
</p>
<section id="terminal__body">
<div id="terminal__prompt">
<span id="terminal__prompt--user">switched to new branch '(YOUR BRANCH NAME)'</span>
<span id="terminal__prompt--cursor"></span>
</div>
</section>
</li>
<br>
<li>
Once you are inside your newly created branch, you can finally add in your own code! So, contribute!
Go! Be Free!
</li>
<br>
<li>
After you've made the most meaningful contributions of your life, you're going to want to save all those beautiful changes.
Now we're going to do something that should hopefully feel a little familiar. In your terminal type:
<br>
<br>
<section id="terminal__body">
<div id="terminal__prompt">
<span id="terminal__prompt--user">user@Users-MacBook_Air: git add .</span>
<span id="terminal__prompt--cursor"></span>
</div>
</section>
</li>
<br>
<li>
Followed by, you guessed it, 'git commit'. While you may not always make the most meaningful commit messages for your own code/repositories,
(even though you should), you <strong>ALWAYS</strong> have to make meaningful commit messages when contributing to another developer's code or
in your work place. Not only is it professional and coder common courtesy, it also gives an idea as to what was done with the code at that staging period.
This helps decrease debugging time and everyone else will understand what the heck is going on inside the application.
<br>
<br>
<section id="terminal__body">
<div id="terminal__prompt">
<span id="terminal__prompt--user">user@Users-MacBook_Air: git commit -m "A MEANINGFUL COMMIT MESSAGE EXPLANING WHAT YOU ADDED"</span>
<span id="terminal__prompt--cursor"></span>
</div>
</section>
</li>
<br>
<li>
<strong class="strong__text">WAIT! DON'T PUSH IT YET!</strong> (I had to add this in here for those of us who like to jump ahead sometimes)
Now that I hopefully have everyone's attention, you never want to just push your contribution up to the main
branch. This goes back the coder common courtesy and professionalism explained before. Not to mention, you may have some
unhappy developers if you overwrote/added code that wasn't approved of first.
<p>
To avoid this, you'll instead push your changes to your newly created branch. This can be done by adjusting the good ol'
'git push' command to the following:
</p>
<section id="terminal__body">
<div id="terminal__prompt">
<span id="terminal__prompt--user">user@Users-MacBook_Air: git push origin (YOUR BRANCH NAME)</span>
<span id="terminal__prompt--cursor"></span>
</div>
</section>
<p>
You should receive a message back in your terminal confirming that your code was pushed up to <strong>your</strong>
newly created branch.
</p>
</li>
<li>
<p>If you head on back over to the repository you're working on, you should see new notification
that the repository was recently updated, along with your branch name. There should also be a button that says
'Compare & pull request'. Go ahead and click it.
</p>
<p>
You should be lead to a page that displays your commit message!
You'll see an option to leave a message underneath your commit. If you are working with others, it is great coder common
courtesy to leave a nice little message further detailing your commit and why you added it in the first place. Again, this avoids
bugs and confusion later.
</p>
</li>
<li>
After you've left a message, you're going to create a pull request. You should see a 'Create pull request' button
underneath the message box, give that a click. By doing this, you're putting a request to the repository owner that you
would like to push your changes to the main branch of the repository. Doing so will also notify all the other developers working
on this repository that a new push request has been made. You can even assign reviewers to be notified of your push request, which can be done under the 'reviewers'
tab.
</li>
<br>
<li>
If everything went smoothly and you contributed something (somewhat) meaningful, your code will get pushed, merging with the main branch.
<p>
Congratulations, you just made your first contribution. Do a dance to celebrate.🎉
</p>
</li>
</ol>
<center>
<button class="resource-button">
<a href="https://www.youtube.com/watch?v=MnUd31TvBoU">
Youtube "How To"
</a>
</button><br><br>
<button class="resource-button">
<a href="https://git-scm.com/book/en/v2/Git-Branching-Basic-Branching-and-Merging">
Git Docs
</a>
</button>
</center>
</div> <br> <br>
<div class="i-wuz-here">
<div class="i-wuz-here-container">
<h2 class="i-wuz-here-title">
I wuz here:
</h2>
<p style="padding: 1rem">
// add in your code here
</p>
<span class="BryanJazoBranch">
Bryan Jazo Was Here - Love it and sorry.
</span><br />
<span class="nicollBranch">
Nicoll Was Here - Going Wild and this is great practice!
</span>
<br>
<span class='itsjillbb'>
Jill Was Here! What an incredible idea!
</span>
<br>
<span class='shelbs'>Hi this is the coolest idea, thanks for setting it up! ❤️ Shelby</span>
<br>
<span class="roy">Roy was here. Because of course I was!!</span>
</div>
</div>
</body>