beta branch page

Author: libjohn

docs/handson_branch.html

@@ -30,6 +30,49 @@
 <script src="site_libs/font-awesome-5.0.13/js/fa-v4-shims.min.js"></script>
 
 
+<style type="text/css">code{white-space: pre;}</style>
+<style type="text/css">
+div.sourceCode { overflow-x: auto; }
+table.sourceCode, tr.sourceCode, td.lineNumbers, td.sourceCode {
+  margin: 0; padding: 0; vertical-align: baseline; border: none; }
+table.sourceCode { width: 100%; line-height: 100%; background-color: #f8f8f8; }
+td.lineNumbers { text-align: right; padding-right: 4px; padding-left: 4px; color: #aaaaaa; border-right: 1px solid #aaaaaa; }
+td.sourceCode { padding-left: 5px; }
+pre, code { background-color: #f8f8f8; }
+code > span.kw { color: #204a87; font-weight: bold; } /* Keyword */
+code > span.dt { color: #204a87; } /* DataType */
+code > span.dv { color: #0000cf; } /* DecVal */
+code > span.bn { color: #0000cf; } /* BaseN */
+code > span.fl { color: #0000cf; } /* Float */
+code > span.ch { color: #4e9a06; } /* Char */
+code > span.st { color: #4e9a06; } /* String */
+code > span.co { color: #8f5902; font-style: italic; } /* Comment */
+code > span.ot { color: #8f5902; } /* Other */
+code > span.al { color: #ef2929; } /* Alert */
+code > span.fu { color: #000000; } /* Function */
+code > span.er { color: #a40000; font-weight: bold; } /* Error */
+code > span.wa { color: #8f5902; font-weight: bold; font-style: italic; } /* Warning */
+code > span.cn { color: #000000; } /* Constant */
+code > span.sc { color: #000000; } /* SpecialChar */
+code > span.vs { color: #4e9a06; } /* VerbatimString */
+code > span.ss { color: #4e9a06; } /* SpecialString */
+code > span.im { } /* Import */
+code > span.va { color: #000000; } /* Variable */
+code > span.cf { color: #204a87; font-weight: bold; } /* ControlFlow */
+code > span.op { color: #ce5c00; font-weight: bold; } /* Operator */
+code > span.pp { color: #8f5902; font-style: italic; } /* Preprocessor */
+code > span.ex { } /* Extension */
+code > span.at { color: #c4a000; } /* Attribute */
+code > span.do { color: #8f5902; font-weight: bold; font-style: italic; } /* Documentation */
+code > span.an { color: #8f5902; font-weight: bold; font-style: italic; } /* Annotation */
+code > span.cv { color: #8f5902; font-weight: bold; font-style: italic; } /* CommentVar */
+code > span.in { color: #8f5902; font-weight: bold; font-style: italic; } /* Information */
+</style>
+<style type="text/css">
+  pre:not([class]) {
+    background-color: white;
+  }
+</style>
 
 
 <style type="text/css">
@@ -323,21 +366,91 @@ <h1 class="title toc-ignore">Git: Branch / Merge / Revert</h1>
 </div>
 
 
+<p>This document follows set-up from the <a href="handson.html">previous document</a></p>
+<div id="standard-edit" class="section level2">
+<h2>Standard Edit</h2>
+<ul>
+<li>Add your name and a bulleted list with three of your favorite foods</li>
+<li>Commit your changes</li>
+</ul>
+</div>
+<div id="branch" class="section level2">
+<h2>Branch</h2>
 <ol style="list-style-type: decimal">
-<li>Make Branch “version2”
-<ol style="list-style-type: decimal">
-<li>checkout version2</li>
-<li>Add stuff (todo.md)</li>
-</ol></li>
-<li>Checkout Main Branch
-<ol style="list-style-type: decimal">
-<li>update README.Rmd</li>
-<li>Look at the various tracks</li>
-</ol></li>
-<li>Merge.</li>
-<li>Conflict</li>
-<li>Revert</li>
+<li><p>Create a branch <em>version2</em></p>
+<ul>
+<li>The funny icon is used to <strong>create</strong> and <strong>checkout</strong> a branch</li>
+<li>By clicking <strong>Create</strong>, <code>git checkout &lt;&lt;branch-name&gt;&gt;</code> is invoked</li>
+<li>Create a new text that lists 3 favorite movies save it as <code>movies.md</code></li>
+<li>Commit your changes</li>
+</ul></li>
+</ol>
+<p><img src="images/branch_create.png" style="display: block; margin: auto;" /></p>
+<ol start="2" style="list-style-type: decimal">
+<li><p>Checkout the <em>master</em> branch</p>
+<ul>
+<li>Watch the <strong>Files</strong> tab as you switch back to the <em>master</em> branch. Where is the <code>movies.md</code> file?</li>
+</ul></li>
+</ol>
+<p><img src="images/branch_checkout.png" style="display: block; margin: auto;" /></p>
+<ol start="3" style="list-style-type: decimal">
+<li><p>Checkout the <em>version2</em> branch again</p>
+<ul>
+<li>Edit the README.md file by adding 3 of your favorite books</li>
+<li>Commit your changes</li>
+<li>Push your changes</li>
+</ul></li>
+<li><p>Observe the visual representations of the branching and updating. &lt;<Git - Clock>&gt; -OR- GitHub &gt; Settings &gt; Insights &gt; Network</p></li>
 </ol>
+</div>
+<div id="merge" class="section level2">
+<h2>Merge</h2>
+<ol start="5" style="list-style-type: decimal">
+<li><p>Checkout the <em>master</em> branch</p>
+<ul>
+<li>In the Terminal window type: <code>git merge version2</code></li>
+<li>You should see a terminal response similar to below…</li>
+<li>Then, Push your changes</li>
+</ul></li>
+</ol>
+<div class="sourceCode"><pre class="sourceCode bash"><code class="sourceCode bash"><span class="ex">Updating</span> 83fb5bb..08c9267
+<span class="ex">Fast-forward</span>
+ <span class="ex">README.md</span> <span class="kw">|</span> <span class="ex">8</span> +++++++-
+ <span class="ex">movies.md</span> <span class="kw">|</span> <span class="ex">5</span> +++++
+ <span class="ex">2</span> files changed, 12 insertions(+), <span class="ex">1</span> deletion(-)
+ <span class="ex">create</span> mode 100644 movies.md</code></pre></div>
+<ol start="6" style="list-style-type: decimal">
+<li>Observe the visual representations of the version history</li>
+</ol>
+</div>
+<div id="conflict" class="section level2">
+<h2>Conflict</h2>
+<ol start="7" style="list-style-type: decimal">
+<li>Edit README.md in <em>master</em> by changing your name. Commit then Push.</li>
+<li>Edit README.md in <em>version2</em> by changing the name to something different from the step above. Commit then Push.</li>
+<li>Checkout <em>master</em>, then <code>git merge version2</code></li>
+<li>Fix Conflicts, then Save. ; Commit and Push.</li>
+</ol>
+</div>
+<div id="revert" class="section level2">
+<h2>Revert</h2>
+<ol start="11" style="list-style-type: decimal">
+<li>Checkout <em>master</em></li>
+<li>Create New text file, <code>colors.md</code> and list three of your favorite colors</li>
+<li>Commit and Push</li>
+<li>Add a fourth color to <code>colors.md</code> ; Commit and Push</li>
+<li>Observe the visual representations of the version history</li>
+<li>Now <em>revert</em> the last change because you changed your mind and you don’t have four favorite colors. In the terminal window type…</li>
+</ol>
+<div class="sourceCode"><pre class="sourceCode bash"><code class="sourceCode bash"><span class="fu">git</span> revert HEAD</code></pre></div>
+<ul>
+<li><code>:wq</code></li>
+</ul>
+<ol start="17" style="list-style-type: decimal">
+<li>Commit and Push.</li>
+<li>Observe the visual representations of the version history</li>
+</ol>
+</div>
 
 &nbsp;
 

docs/images/branch_checkout.png

@@ -5,10 +5,6 @@ output:
     self_contained: false
 ---
 
-```{r, message=FALSE, warning=FALSE, include=FALSE}
-library(tidyverse)
-```
-
 ### Generate SSH Keys 
 
 This step was covered in the [Outline Section](outline.html#generate_ssh_keys_in_advance_of_the_workshop).  This must be done on each workstation you use to *push*.  

docs/images/branch_create.png

@@ -5,17 +5,86 @@ output:
     self_contained: false
 ---
 
-```{r, message=FALSE, warning=FALSE, include=FALSE}
-library(tidyverse)
+This document follows set-up from the [previous document](handson.html)
+
+## Standard Edit
+
+- Add your name and a bulleted list with three of your favorite foods
+- Commit your changes
+
+## Branch
+1. Create a branch *version2*
+
+    - The funny icon is used to **create** and **checkout** a branch
+    - By clicking **Create**, `git checkout <<branch-name>>` is invoked
+    - Create a new text that lists 3 favorite movies save it as `movies.md`
+    - Commit your changes
+    
+```{r echo=FALSE, fig.align='center'}
+knitr::include_graphics('images/branch_create.png')
 ```
+    
+2. Checkout the *master* branch
+
+    - Watch the **Files** tab as you switch back to the *master* branch.  Where is the `movies.md` file?
+
+```{r echo=FALSE, fig.align='center'}
+knitr::include_graphics('images/branch_checkout.png')
+```
+
+3. Checkout the *version2* branch again
+
+    - Edit the README.md file by adding 3 of your favorite books
+    - Commit your changes
+    - Push your changes
+    
+4. Observe the visual representations of the branching and updating.  <<Git - Clock>> -OR- GitHub > Settings > Insights > Network
+
+## Merge
+    
+5. Checkout the *master* branch
+
+    - In the Terminal window type:  `git merge version2`
+    - You should see a terminal response similar to below...
+    - Then, Push your changes
+    
+``` bash
+Updating 83fb5bb..08c9267
+Fast-forward
+ README.md | 8 +++++++-
+ movies.md | 5 +++++
+ 2 files changed, 12 insertions(+), 1 deletion(-)
+ create mode 100644 movies.md
+
+```
+
+6. Observe the visual representations of the version history
+
+## Conflict
+
+7. Edit README.md in *master* by changing your name. Commit then Push.
+8. Edit README.md in *version2* by changing the name to something different from the step above. Commit then Push.
+9. Checkout *master*, then `git merge version2`
+10. Fix Conflicts, then Save. ; Commit and Push.
+
+## Revert
+
+11. Checkout *master*
+12. Create New text file, `colors.md` and list three of your favorite colors
+13. Commit and Push
+14. Add a fourth color to `colors.md` ; Commit and Push
+15. Observe the visual representations of the version history
+16. Now *revert* the last change because you changed your mind and you don't have four favorite colors.  In the terminal window type...
+
+``` bash
+git revert HEAD
+```
+
+- `:wq`
+
+17. Commit and Push.
+1. Observe the visual representations of the version history
+
+    
 
-1. Make Branch "version2"
-    1. checkout version2
-    1. Add stuff (todo.md)
-1. Checkout Main Branch
-    1. update README.Rmd
-    1. Look at the various tracks
-1. Merge.
-1. Conflict
-1. Revert