-
Notifications
You must be signed in to change notification settings - Fork 0
/
git_workshop.html
187 lines (181 loc) · 10.3 KB
/
git_workshop.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
186
187
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="generator" content="pandoc">
<title>Wrap-up</title>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">
<link rel="stylesheet" href="reveal.js//css/reveal.css">
<style type="text/css">
code{white-space: pre-wrap;}
span.smallcaps{font-variant: small-caps;}
span.underline{text-decoration: underline;}
div.column{display: inline-block; vertical-align: top; width: 50%;}
</style>
<link rel="stylesheet" href="reveal.js//css/theme/black.css" id="theme">
<!-- Printing and PDF exports -->
<script>
var link = document.createElement( 'link' );
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = window.location.search.match( /print-pdf/gi ) ? 'reveal.js//css/print/pdf.css' : 'reveal.js//css/print/paper.css';
document.getElementsByTagName( 'head' )[0].appendChild( link );
</script>
<!--[if lt IE 9]>
<script src="reveal.js//lib/js/html5shiv.js"></script>
<![endif]-->
</head>
<body>
<div class="reveal">
<div class="slides">
<section id="title-slide">
<h1 class="title">Wrap-up</h1>
</section>
<section id="golden-git-rules" class="slide level2">
<h2>Golden Git rules</h2>
<ul>
<li><span style="color:rgba(251, 69, 23)">push</span> often</li>
<li><span style="color:rgba(251, 69, 23)">pull</span> before add (avoid ‘empty’ merge commits)</li>
<li>if undoing, <span style="color:rgba(251, 69, 23)">git status</span> first</li>
<li>Write <span style="color:rgba(251, 69, 23)">descriptive</span> commit messages</li>
</ul>
</section>
<section><section id="when-git-goes-wrong" class="title-slide slide level1"><h1>When git goes wrong…</h1></section><section id="section" class="slide level2">
<h2></h2>
<p><img src="images/git_conflict2.jpeg" height="400"></p>
</section><section id="reset" class="slide level2">
<h2>Reset</h2>
<p><span style="color:rgba(251, 69, 23)">git checkout –– <file></span> to undo local changes</p>
<p><span style="color:rgba(251, 69, 23)">git reset HEAD <file></span> to unstage (undo add) a file</p>
<p><span style="color:rgba(251, 69, 23)">git reset HEAD^</span> to undo your latest commit</p>
</section><section id="section-1" class="slide level2">
<h2></h2>
<p><img src="images/terminal_gitstatus.png" height="600" style="background:none; border:none; box-shadow:none;"></p>
</section><section id="section-2" class="slide level2">
<h2></h2>
<p><img src="images/git_flow.png" height="400" style="background:none; border:none; box-shadow:none;"></p>
</section><section id="reset-1" class="slide level2">
<h2>Reset</h2>
<ul>
<li><span style="color:rgba(251, 69, 23)">git status</span> to check what you have locally</li>
<li><span style="color:rgba(251, 69, 23)">git reflog</span> to find commit number</li>
<li><span style="color:rgba(251, 69, 23)">git reset –soft commit#</span> to reset local state</li>
<li><span style="color:rgba(251, 69, 23)">git reset –hard commit#</span> 🚨 to dismiss local state</li>
</ul>
</section><section id="section-3" class="slide level2">
<h2></h2>
<p>git reset –soft commit#/HEAD^ <img src="images/git_flow_resetsoft.png" height="400" style="background:none; border:none; box-shadow:none;"></p>
</section><section id="section-4" class="slide level2">
<h2></h2>
<p><img src="images/gitpushforce.jpg" height="400"></p>
</section><section id="rebasing" class="slide level2">
<h2>Rebasing</h2>
<ul>
<li><span style="color:rgba(251, 69, 23)">git rebase</span> changes <strong>your</strong> git history!</li>
<li><span style="color:rgba(251, 69, 23)">git rebase -interactive</span> to clean you <strong>local</strong> branch history before merging</li>
</ul>
</section><section id="section-5" class="slide level2">
<h2></h2>
<p><img src="images/pull.png" height="600" style="background:none; border:none; box-shadow:none;"></p>
</section><section id="section-6" class="slide level2">
<h2></h2>
<p><img src="images/rebase.png" height="600" style="background:none; border:none; box-shadow:none;"></p>
</section></section>
<section><section id="where-to-go-next" class="title-slide slide level1"><h1>Where to go next?</h1></section><section id="learn-more" class="slide level2" data-background-iframe="https://learngitbranching.js.org/" style="position: absolute; width: 50%; right: 0; box-shadow: 0 1px 4px rgba(0,0,0,0.5), 0 5px 25px rgba(0,0,0,0.2); background-color: rgba(0, 0, 0, 0.9); color: #fff; padding: 20px; font-size: 20px; text-align: left;">
<h2>Learn more!</h2>
</section><section id="practice-makes-perfect" class="slide level2">
<h2>Practice makes perfect 💪</h2>
<p>Start using Git version control</p>
</section></section>
<section><section id="code-git-ide-integration" class="title-slide slide level1"><h1>Code (Git IDE integration)</h1></section><section id="integrated-development-environment" class="slide level2">
<h2>Integrated Development Environment</h2>
<ul>
<li>Matlab > R2014b</li>
<li>Pycharm, Spyder</li>
<li>RStudio</li>
<li>(atom)</li>
</ul>
</section><section id="matlab" class="slide level2">
<h2>Matlab</h2>
<video height="600" controls>
<source src="media/matlab_gitintegration.mp4" type="video/mp4">
<p>Your browser does not support the video tag. </video></p>
</section><section id="pycharm" class="slide level2">
<h2>Pycharm</h2>
<p><img src="images/Pycharm-git.png" height="600" style="background:none; border:none; box-shadow:none;"></p>
</section><section id="rstudio" class="slide level2">
<h2>RStudio</h2>
<p><img src="images/Rstudio-git.png" height="400" style="background:none; border:none; box-shadow:none;"></p>
</section></section>
<section><section id="text-documents" class="title-slide slide level1" data-background="./images/typing_pic.jpg"><h1>Text Documents</h1></section><section id="section-7" class="slide level2">
<h2></h2>
<p><img src="images/word_binary.png" height="600" style="background:none; border:none; box-shadow:none;"></p>
</section><section id="git-markdown-pandoc" class="slide level2" data-background-iframe="https://pandoc.org/index.html" style="position: absolute; width: 50%; right: 0; box-shadow: 0 1px 4px rgba(0,0,0,0.5), 0 5px 25px rgba(0,0,0,0.2); background-color: rgba(0, 0, 0, 0.9); color: #fff; padding: 20px; font-size: 20px; text-align: left;">
<h2>Git + Markdown + Pandoc</h2>
<p><img src="images/giticon.png" height="100" style="background:none; border:none; box-shadow:none;"><img src="images/markdown_cover.png" height="100" style="background:none; border:none; box-shadow:none;"></p>
</section><section id="section-8" class="slide level2">
<h2></h2>
<p><img src="images/atom_markdown.png" height="600" style="background:none; border:none; box-shadow:none;"></p>
<aside class="notes">
<p>Keep content and form separated. For Manuscript this means, if you update figures you don’t have to re copy-paste them into word</p>
</aside>
</section><section id="why-bother" class="slide level2">
<h2>Why bother?</h2>
<p><span style="color:rgb(250,87,40)"><strong>Flexibility</strong></span> separating content & form</p>
<p><span style="color:rgb(250,87,40)"><strong>Peace of mind</strong></span> rewrite without regrets</p>
<p><span style="color:rgb(250,87,40)"><strong>Reproducibility</strong></span> remember feedback related changes</p>
<p><span style="color:rgb(250,87,40)"><strong>Collaboration</strong></span> ask for feedback through pull requests</p>
</section><section id="atom-text-editor" class="slide level2">
<h2>Atom text editor</h2>
<video height="600" controls>
<source src="media/atom_gitintegration.mp4" type="video/mp4">
<p>Your browser does not support the video tag. </video></p>
</section></section>
<section><section id="slides" class="title-slide slide level1" data-background="./images/presenting_pic.jpg" style="color:black;"><h1>Slides</h1></section><section id="git-pandoc-revealjs" class="slide level2">
<h2>Git + (pandoc + revealjs)</h2>
<p>pandoc -t revealjs -s -o outputfile<span style="color:rgb(250,87,40)">.html</span> inputfile<span style="color:rgb(250,87,40)">.md</span></p>
<p><a href="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/hakimel/reveal.js/">git clone https://github.com/hakimel/reveal.js/</a></p>
<p>Publish your slides through <a href="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/aranas/presentations">GitHub Pages</a></p>
</section><section id="web-based" class="slide level2" data-background-iframe="https://openscience-nijmegen.nl/" style="position: absolute; width: 40%; right: 0; box-shadow: 0 1px 4px rgba(0,0,0,0.5), 0 5px 25px rgba(0,0,0,0.2); background-color: rgba(0, 0, 0, 0.9); color: #fff; padding: 20px; font-size: 20px; text-align: left;">
<h2>Web-based</h2>
<p>You can easily embed other web content and interact live</p>
</section></section>
<section><section id="project-management" class="title-slide slide level1" data-background="./images/projectman_pic.jpeg"><h1>Project management</h1></section><section id="section-9" class="slide level2">
<h2></h2>
<ul>
<li>Issues <a href="https://github.com/Radboud-University/osc-nijmegen/issues/52">(example: this workshop!)</a></li>
<li>Pull requests</li>
<li>Milestones</li>
<li>Project boards <a href="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/unicef/magicbox">(example: UNICEF magicbox)</a></li>
<li>Wiki <a href="https://github.com/guard/guard/wiki">(example: guard)</a></li>
</ul>
<!-- Note:
assignees, labels, commit -m "fixes \#12", interactive check boxes
wikis can be -->
</section></section>
<section><section id="thanks" class="title-slide slide level1"><h1>Thanks</h1></section><section id="section-10" class="slide level2">
<h2></h2>
<p><img src="images/keepcalmandgit.jpg" height="500"></p>
</section></section>
</div>
</div>
<script src="reveal.js//lib/js/head.min.js"></script>
<script src="reveal.js//js/reveal.js"></script>
<script>
// Full list of configuration options available at:
// https://github.com/hakimel/reveal.js#configuration
Reveal.initialize({
// Push each slide change to the browser history
history: true,
// Optional reveal.js plugins
dependencies: [
{ src: 'reveal.js//lib/js/classList.js', condition: function() { return !document.body.classList; } },
{ src: 'reveal.js//plugin/zoom-js/zoom.js', async: true },
{ src: 'reveal.js//plugin/notes/notes.js', async: true }
]
});
</script>
</body>
</html>