-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathtips-tricks.html
More file actions
346 lines (294 loc) · 19.4 KB
/
Copy pathtips-tricks.html
File metadata and controls
346 lines (294 loc) · 19.4 KB
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
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tips & Tricks — Git & GitHub Handbook</title>
<meta name="description"
content="Git aliases, stashing, interactive rebase, cherry-picking, useful GitHub CLI shortcuts, and a first taste of GitHub Actions.">
<link rel="stylesheet" href="style.css">
</head>
<body>
<button id="navToggle" class="nav-toggle" aria-label="Toggle table of contents">☰ Contents</button>
<div id="navOverlay" class="nav-overlay"></div>
<div class="app">
<nav class="sidebar" id="sidebar" aria-label="Table of contents">
<div class="sidebar-inner">
<a href="index.html" class="brand">
<span class="brand-mark">git</span>
<span class="brand-sub">& github</span>
</a>
<p class="sidebar-tagline">A no-nonsense guide for people who've never touched a terminal.</p>
<div class="site-nav">
<p class="site-nav-label">Guides</p>
<ul class="site-nav-list">
<li><a href="index.html">Home</a></li>
<li><a href="git-basics.html">1. Git Basics</a></li>
<li><a href="github-guide.html">2. GitHub Essentials</a></li>
<li><a href="collaboration.html">3. Working with Others</a></li>
<li><a href="profile.html">4. Profile & Portfolio</a></li>
<li><a href="tips-tricks.html" class="current">5. Tips & Tricks</a></li>
</ul>
</div>
<p class="toc-label">On this page</p>
<ul class="toc-list">
<li><a href="#aliases">Git Aliases</a></li>
<li><a href="#gitconfig">Global .gitconfig</a></li>
<li><a href="#stash">Stashing Work</a></li>
<li><a href="#rebase">Interactive Rebase</a></li>
<li><a href="#cherrypick">Cherry-Picking</a></li>
<li><a href="#log">Log & Blame Tricks</a></li>
<li><a href="#ghshortcuts">GitHub Search & Shortcuts</a></li>
<li><a href="#actions">A Taste of GitHub Actions</a></li>
<li><a href="#cheat5">Cheat Sheet</a></li>
</ul>
<a class="sidebar-footer-link" href="https://www.linkedin.com/in/muhammad-hamza-naqi-569741403/"
target="_blank" rel="noopener noreferrer">Connect with the author →</a>
</div>
</nav>
<main class="main" id="top">
<div class="content">
<header class="hero">
<p class="eyebrow">Part 5 of 5 · Beginner's Handbook</p>
<h1>Tips & Tricks</h1>
<p class="lede">You've got the fundamentals. This part is a grab bag of things that save real
time once the basics are automatic — shortcuts, cleanup tools, and a peek at automation.</p>
</header>
<hr>
<div class="note-card">
<p><b>New here?</b> This part assumes you're comfortable with the everyday commit/push cycle
from <a href="git-basics.html">Part 1</a>. Each trick below is independent, so feel free to
skip around.</p>
</div>
<section id="aliases">
<h3><span class="num">01</span> Git Aliases — Shorten Your Commands</h3>
<p>Tired of typing <code>git status</code> fifty times a day? Give it a shortcut:</p>
<div class="term">
<div class="term-bar"><span class="dot dot-r"></span><span class="dot dot-y"></span><span
class="dot dot-g"></span><span class="term-title">terminal</span></div>
<div class="term-body">
<div class="line"><span class="prompt">$</span><span class="cmd">git config --global
alias.st status</span></div>
<div class="line"><span class="prompt">$</span><span class="cmd">git config --global
alias.co checkout</span></div>
<div class="line"><span class="prompt">$</span><span class="cmd">git config --global
alias.br branch</span></div>
<div class="line"><span class="prompt">$</span><span class="cmd">git config --global
alias.cm "commit -m"</span></div>
</div>
</div>
<p>Now <code>git st</code>, <code>git co main</code>, and <code>git cm "message"</code> all
work exactly like the full commands.</p>
</section>
<hr>
<section id="gitconfig">
<h3><span class="num">02</span> Useful Global Settings</h3>
<div class="term">
<div class="term-bar"><span class="dot dot-r"></span><span class="dot dot-y"></span><span
class="dot dot-g"></span><span class="term-title">terminal</span></div>
<div class="term-body">
<div class="line comment"># set your default editor for commit messages</div>
<div class="line"><span class="prompt">$</span><span class="cmd">git config --global
core.editor "code --wait"</span></div>
<div class="line comment"># always create main (not master) on git init</div>
<div class="line"><span class="prompt">$</span><span class="cmd">git config --global
init.defaultBranch main</span></div>
<div class="line comment"># keep pull history simple by rebasing instead of merge
commits</div>
<div class="line"><span class="prompt">$</span><span class="cmd">git config --global
pull.rebase true</span></div>
<div class="line comment"># pretty colored output everywhere</div>
<div class="line"><span class="prompt">$</span><span class="cmd">git config --global
color.ui auto</span></div>
</div>
</div>
<p>All of these live in a plain text file at <code>~/.gitconfig</code> you can also just open
and edit directly.</p>
</section>
<hr>
<section id="stash">
<h3><span class="num">03</span> Stashing — Shelve Work Without Committing</h3>
<p>Say you're mid-change and suddenly need to switch branches to fix something urgent, but
you're not ready to commit. <code>git stash</code> tucks your uncommitted changes away so
your working directory is clean again:</p>
<div class="term">
<div class="term-bar"><span class="dot dot-r"></span><span class="dot dot-y"></span><span
class="dot dot-g"></span><span class="term-title">terminal</span></div>
<div class="term-body">
<div class="line"><span class="prompt">$</span><span class="cmd">git stash</span></div>
<div class="line output">Saved working directory and index state WIP on feature-x</div>
<div class="line comment"># ...switch branches, fix the urgent thing, come back...</div>
<div class="line"><span class="prompt">$</span><span class="cmd">git stash list</span>
</div>
<div class="line"><span class="prompt">$</span><span class="cmd">git stash pop</span>
</div>
</div>
</div>
<p><code>git stash pop</code> re-applies your changes and removes them from the stash list.
Use <code>git stash apply</code> instead if you want to re-apply without removing it, in
case you need the same stash on another branch too.</p>
</section>
<hr>
<section id="rebase">
<h3><span class="num">04</span> Interactive Rebase — Clean Up History Before Pushing</h3>
<p>Made three messy "wip" commits in a row and want to squash them into one clean commit before
opening a PR? Interactive rebase lets you rewrite recent, <i>not-yet-pushed</i> history:</p>
<div class="term">
<div class="term-bar"><span class="dot dot-r"></span><span class="dot dot-y"></span><span
class="dot dot-g"></span><span class="term-title">terminal</span></div>
<div class="term-body">
<div class="line"><span class="prompt">$</span><span class="cmd">git rebase -i
HEAD~3</span></div>
</div>
</div>
<p>This opens a list of your last three commits in your editor, each prefixed with
<code>pick</code>. Change the word next to any commit you want to fold into the one above to
<code>squash</code> (or the shorthand <code>s</code>), save, and Git combines them and lets
you write a single clean commit message — the same idea as squash-merging a pull request
(see <a href="collaboration.html#review">Part 3</a>), just done locally before you even push.
</p>
<div class="note-card">
<p><b>Golden rule:</b> only rebase commits you haven't pushed yet, or that you're certain no
one else has pulled. Rebasing shared history rewrites it, which causes real headaches for
anyone who already has the old version.</p>
</div>
</section>
<hr>
<section id="cherrypick">
<h3><span class="num">05</span> Cherry-Picking a Single Commit</h3>
<p>Need just <i>one</i> specific commit from another branch, without merging everything else
from it? Grab its commit hash and cherry-pick it onto your current branch:</p>
<div class="term">
<div class="term-bar"><span class="dot dot-r"></span><span class="dot dot-y"></span><span
class="dot dot-g"></span><span class="term-title">terminal</span></div>
<div class="term-body">
<div class="line"><span class="prompt">$</span><span class="cmd">git log
other-branch --oneline</span></div>
<div class="line output">a1b2c3d fix off-by-one error in pagination</div>
<div class="line"><span class="prompt">$</span><span class="cmd">git cherry-pick
a1b2c3d</span></div>
</div>
</div>
<p>Common use case: a hotfix was committed on a feature branch by mistake, and you need it on
<code>main</code> right now without waiting for the whole feature to be ready.</p>
</section>
<hr>
<section id="log">
<h3><span class="num">06</span> Log & Blame Tricks</h3>
<div class="term">
<div class="term-bar"><span class="dot dot-r"></span><span class="dot dot-y"></span><span
class="dot dot-g"></span><span class="term-title">terminal</span></div>
<div class="term-body">
<div class="line comment"># one line per commit, easy to scan</div>
<div class="line"><span class="prompt">$</span><span class="cmd">git log --oneline</span>
</div>
<div class="line comment"># a visual branch/merge graph in the terminal</div>
<div class="line"><span class="prompt">$</span><span class="cmd">git log --oneline
--graph --all</span></div>
<div class="line comment"># who last touched each line of a file, and in which
commit</div>
<div class="line"><span class="prompt">$</span><span class="cmd">git blame
filename.js</span></div>
</div>
</div>
</section>
<hr>
<section id="ghshortcuts">
<h3><span class="num">07</span> GitHub Search & Keyboard Shortcuts</h3>
<p>A few things that speed up browsing GitHub itself, not the terminal:</p>
<ul>
<li>Press <code>t</code> on any repo page to fuzzy-search and jump straight to a file by
name.</li>
<li>Press <code>.</code> (period) on any repo page to open it in a full web-based VS Code
editor, right in the browser.</li>
<li>Press <code>/</code> anywhere on GitHub to jump to the search bar.</li>
<li>In search, <code>filename:package.json org:your-org</code> style qualifiers narrow
results — GitHub's search supports dozens of these (<code>is:pr</code>,
<code>is:open</code>, <code>author:username</code>, <code>language:python</code>, and
more).</li>
</ul>
</section>
<hr>
<section id="actions">
<h3><span class="num">08</span> A Taste of GitHub Actions</h3>
<p><b>GitHub Actions</b> runs automated steps every time something happens in your repo — most
commonly, running tests automatically on every push or pull request (these are the "status
checks" mentioned in <a href="collaboration.html#pr">Part 3</a>). It's a big topic on its
own, but the entry point is small: a <b>YAML</b> file — a plain-text format that uses
indentation to show structure, similar to how Python uses indentation instead of curly
braces — placed in a specific folder.</p>
<div class="file">
<div class="file-bar">.github/workflows/test.yml</div>
<div class="file-body">
name: Run Tests<br>
on: [push, pull_request]<br>
jobs:<br>
test:<br>
runs-on: ubuntu-latest<br>
steps:<br>
- uses: actions/checkout@v4<br>
- run: npm install<br>
- run: npm test
</div>
</div>
<p>This particular example assumes a Node.js project — swap <code>npm install</code> and
<code>npm test</code> for whatever commands actually install and test your own project.
Commit the file and push it — GitHub picks it up automatically and runs it on every future
push, showing a green check or red cross right on your commits and pull requests. Combined
with the branch protection rule from <a href="collaboration.html#protect">Part 3</a> that
requires status checks to pass, this is how teams stop broken code from being merged. You
can also check on a run without leaving the terminal using the GitHub CLI from
<a href="github-guide.html#cli">Part 2</a> — see the cheat sheet below.</p>
</section>
<hr>
<section id="cheat5">
<h3><span class="num">09</span> Tips & Tricks Cheat Sheet</h3>
<table class="git-cheat-sheet">
<tr>
<td class="command">git stash / git stash pop</td>
<td>Shelve uncommitted changes, then bring them back later</td>
</tr>
<tr>
<td class="command">git rebase -i HEAD~n</td>
<td>Interactively edit, squash, or reorder your last n commits</td>
</tr>
<tr>
<td class="command">git cherry-pick <hash></td>
<td>Apply one specific commit from another branch onto the current one</td>
</tr>
<tr>
<td class="command">git log --oneline --graph --all</td>
<td>Visualize branch and merge history in the terminal</td>
</tr>
<tr>
<td class="command">git blame <file></td>
<td>See who last changed each line, and in which commit</td>
</tr>
<tr>
<td class="command">git config --global alias.<name> "<command>"</td>
<td>Create a shortcut for any Git command</td>
</tr>
<tr>
<td class="command">gh run list</td>
<td>See recent GitHub Actions runs for the current repo, from the terminal</td>
</tr>
</table>
</section>
<hr>
<div class="note-card">
<p><b>That's the whole handbook.</b> Head back to <a href="index.html">the home page</a> any
time you need to jump to a different chapter.</p>
</div>
<hr>
<footer class="page-footer">
<p>Prepared by <b>Muhammad Hamza Naqi</b></p>
<a class="linkedin-btn" href="https://www.linkedin.com/in/muhammad-hamza-naqi-569741403/"
target="_blank" rel="noopener noreferrer">Connect on LinkedIn</a>
</footer>
</div>
</main>
</div>
<button id="backTop" class="back-top" aria-label="Back to top">↑</button>
<script src="script.js"></script>
</body>
</html>