Skip to content

Commit

Permalink
docs: slides through forks
Browse files Browse the repository at this point in the history
  • Loading branch information
@srearl
srearl committed May 9, 2024
1 parent c0daf08 commit b461698
Show file tree
Hide file tree
Showing 11 changed files with 137 additions and 78 deletions.
Empty file added .github/workflows/publish.yml
View file
Empty file.
4 changes: 2 additions & 2 deletions _freeze/git_primer/execute-results/html.json
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
{
"hash": "c2e1463a15061c2fe71a8ad81256c523",
"hash": "6927ef67b25b42689bd9bf68a81b5e68",
"result": {
"engine": "knitr",
"markdown": "---\nformat:\n revealjs: \n theme:\n - dark\n - custom.scss\n---\n\n\n::: custom_title\n\nversion control with git <span style=\"color:#f34c26\">{{< fa brands git-alt size=1x >}}</span> and GitHub <span style=\"color:#74C0FC\">{{< fa brands github size=1x >}}</span>\n\n:::\n\n\n```{mermaid}\n%%| label: opening-slide\n%%| fig-width: 10000000\n%%{init: { 'logLevel': 'debug', 'theme': 'dark' , 'themeVariables': {\n'commitLabelFontSize': '16px'\n} } }%%\ngitGraph\n commit id: \"initialize\"\n commit id: \"add README\"\n commit id: \"add model\"\n branch microbial\n checkout microbial\n commit id: \"microbial params\"\n branch chemistry\n checkout chemistry\n commit id: \"chemistry params\"\n checkout microbial\n merge chemistry\n checkout main\n merge microbial\n commit id: \"one-pool model\"\n```\n\n\n\n## {#what_is_it data-menu-title=\"what is it\"}\n\n\n**what it is:**\n\n * an [open-source]{style=\"color: yellow;\"}, [distributed]{style=\"color: yellow;\"} version control system designed for [speed and efficiency]{style=\"color: yellow;\"}[^1]\n\n<br>\n\n**what it does:**\n\n * watches repositories (like a directory) for changes\n \n * asks that you describe changes when they are made\n \n * identifies conflicts, and forces you to resolve them\n\n\n[^1]: [introduction-to-git](https://speakerdeck.com/schacon/introduction-to-git?slide=13)\n\n\n## {#git_github data-menu-title=\"github is not git\" .center}\n\n:::{.r-stack}\n\n<span style=\"color:#f34c26\">{{< fa brands git-alt size=5x >}}</span>\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\n<span style=\"font-size:100px;\">!=</span>\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\n<span style=\"color:#74C0FC\">{{< fa brands github size=5x >}}</span>\n\n:::\n\n\n## {#not_just_github data-menu-title=\"not just github\" .center}\n\n:::{.r-stack}\n\n<span style=\"color:#f34c26\">{{< fa brands gitlab size=5x >}}</span>\n<span style=\"color:#f34c26\">{{< fa brands github size=5x >}}</span>\n<span style=\"color:#74C0FC\">{{< fa brands bitbucket size=5x >}}</span>\n\n:::\n\n\n## Quarto\n\nQuarto enables you to weave together content and executable code into a finished presentation. To learn more about Quarto presentations see <https://quarto.org/docs/presentations/>.\n\n## Bullets\n\nWhen you click the **Render** button a document will be generated that includes:\n\n- Content authored with markdown\n- Output from executable code\n\n## Code\n\nWhen you click the **Render** button a presentation will be generated that includes both content and the output of embedded code. You can embed code like this:\n\n\n::: {.cell}\n::: {.cell-output .cell-output-stdout}\n\n```\n[1] 2\n```\n\n\n:::\n:::\n",
"markdown": "---\nformat:\n revealjs: \n theme:\n - dark\n - custom.scss\n---\n\n\n::: custom_title\n\nversion control with git <span style=\"color:#f34c26\">{{< fa brands git-alt size=1x >}}</span> and GitHub <span style=\"color:#74C0FC\">{{< fa brands github size=1x >}}</span>\n\n:::\n\n\n```{mermaid}\n%%| label: opening-slide\n%%| fig-width: 10000000\n%%{init: { 'logLevel': 'debug', 'theme': 'dark' , 'themeVariables': {\n'commitLabelFontSize': '16px'\n} } }%%\ngitGraph\n commit id: \"initialize\"\n commit id: \"add README\"\n commit id: \"add model\"\n branch microbial\n checkout microbial\n commit id: \"microbial params\"\n branch chemistry\n checkout chemistry\n commit id: \"chemistry params\"\n checkout microbial\n merge chemistry\n checkout main\n merge microbial\n commit id: \"one-pool model\"\n```\n\n\n\n## {#what_is_it data-menu-title=\"what is it\"}\n\n\n**what it is:**\n\n * an [open-source]{style=\"color:yellow;\"}, [distributed]{style=\"color:yellow;\"} version control system designed for [speed and efficiency]{style=\"color:yellow;\"}[^1]\n\n<br>\n\n**what it does:**\n\n * watches repositories (like a directory) for changes\n \n * asks that you describe changes when they are made\n \n * identifies conflicts, and forces you to resolve them\n\n\n[^1]: [introduction-to-git](https://speakerdeck.com/schacon/introduction-to-git?slide=13)\n\n\n## {#git_github data-menu-title=\"github is not git\" .center}\n\n::: {.r-stack}\n\n<span style=\"color:#f34c26\">{{< fa brands git-alt size=5x >}}</span>\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\n<span style=\"font-size:2em;\">!=</span>\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\n<span style=\"color:#74C0FC\">{{< fa brands github size=5x >}}</span>\n\n:::\n\n<br>\n\n::: left\n\n::: smaller\n\n- Git: version control software used to track files in a directory (a repository)\n + Git creates the versioned history of a repository\n- GitHub: website that allows users to store their Git repositories and share them with others (i.e., a graphical user interface)\n\n:::\n\n:::\n\n\n## {#not_just_github data-menu-title=\"not just github\" .center}\n\n::: {.r-stack}\n<span style=\"color:#f34c26\">{{< fa brands gitlab size=5x >}}</span>\n<span style=\"color:#74C0FC\">{{< fa brands github size=5x >}}</span>\n<span style=\"color:#1d78f3\">{{< fa brands bitbucket size=5x >}}</span>\n[self host]{style=\"font-size:1.6em;\"}\n:::\n\n\n## [git]{style=\"color:#f34c26\"} organization\n\n::: smaller\nthe repository (think directory) is the fundamental organizational unit\n:::\n\n::: {style=\"background:white; width:40%; display:block; margin-left:auto; margin-right:auto\"}\n![](images/organization_git.png){fig-align=\"center\"}\n:::\n\n## [GitHub]{style=\"color:#74C0FC\"} organization\n\n::: {style=\"font-size:0.6em;\"}\n* repositories can be [public]{style=\"color:gray\"} (controlled write access) or [private]{style=\"color:gray\"} (controlled read access)\n* repository owner can provide write access to other accounts\n* [organizations]{style=\"color:gray\"} can link many accounts\n + accounts within organizations can be organized into [teams]{style=\"color:gray\"} for additional organization and access control\n:::\n\n::: {style=\"background:white; width:80%; display:block; margin-left:auto; margin-right:auto\"}\n![](images/organization_github.png){fig-align=\"center\"}\n:::\n\n\n## Bullets\n\nWhen you click the **Render** button a document will be generated that includes:\n\n- Content authored with markdown\n- Output from executable code\n\n## Code\n\nWhen you click the **Render** button a presentation will be generated that includes both content and the output of embedded code. You can embed code like this:\n\n\n::: {.cell}\n::: {.cell-output .cell-output-stdout}\n\n```\n[1] 2\n```\n\n\n:::\n:::\n",
"supporting": [
"git_primer_files"
],
Expand Down
2 changes: 1 addition & 1 deletion _freeze/git_primer/libs/revealjs/dist/theme/quarto.css
View file

Large diffs are not rendered by default.

8 changes: 8 additions & 0 deletions custom.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,14 @@ $code-color: #7a4aa6;
left: 50%;
}

.left {
text-align: left;
}

.smaller_text {
font-size: 0.8em;
}

// none of the approaches to making the mermaid diagram larger were successful

.mermaid svg {
Expand Down
137 changes: 80 additions & 57 deletions git_primer.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
<link href="git_primer_files/libs/quarto-html/quarto-syntax-highlighting-dark.css" rel="stylesheet" id="quarto-text-highlighting-styles">
<link href="git_primer_files/libs/quarto-contrib/fontawesome6-0.1.0/all.css" rel="stylesheet">
<link href="git_primer_files/libs/quarto-contrib/fontawesome6-0.1.0/latex-fontsize.css" rel="stylesheet"><meta charset="utf-8">
<meta name="generator" content="quarto-1.4.550">
<meta name="generator" content="quarto-1.4.553">

<title>git_primer</title>
<meta name="apple-mobile-web-app-capable" content="yes">
Expand Down Expand Up @@ -367,7 +367,7 @@
<h2></h2>
<p><strong>what it is:</strong></p>
<ul>
<li>an <span style="color: yellow;">open-source</span>, <span style="color: yellow;">distributed</span> version control system designed for <span style="color: yellow;">speed and efficiency</span><sup>1</sup></li>
<li>an <span style="color:yellow;">open-source</span>, <span style="color:yellow;">distributed</span> version control system designed for <span style="color:yellow;">speed and efficiency</span><sup>1</sup></li>
</ul>
<p><br></p>
<p><strong>what it does:</strong></p>
Expand All @@ -380,33 +380,72 @@ <h2></h2>
<section id="git_github" class="slide level2 center" data-menu-title="github is not git">
<h2></h2>
<div class="r-stack">
<p><span style="color:#f34c26"><i class="fa-brands fa-git-alt fa-5x" aria-label="git-alt"></i></span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="font-size:100px;">!=</span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#74C0FC"><i class="fa-brands fa-github fa-5x" aria-label="github"></i></span></p>
<p><span style="color:#f34c26"><i class="fa-brands fa-git-alt fa-5x" aria-label="git-alt"></i></span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="font-size:2em;">!=</span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="color:#74C0FC"><i class="fa-brands fa-github fa-5x" aria-label="github"></i></span></p>
</div>
<p><br></p>
<div class="left">
<div class="smaller_text">
<ul>
<li>Git: version control software used to track files in a directory (a repository)
<ul>
<li>Git creates the versioned history of a repository</li>
</ul></li>
<li>GitHub: website that allows users to store their Git repositories and share them with others (i.e., a graphical user interface)</li>
</ul>
</div>
</div>
</section>
<section id="not_just_github" class="slide level2 center" data-menu-title="not just github">
<h2></h2>
<div class="r-stack">
<p><span style="color:#f34c26"><i class="fa-brands fa-gitlab fa-5x" aria-label="gitlab"></i></span> <span style="color:#f34c26"><i class="fa-brands fa-github fa-5x" aria-label="github"></i></span> <span style="color:#74C0FC"><i class="fa-brands fa-bitbucket fa-5x" aria-label="bitbucket"></i></span></p>
<p><span style="color:#f34c26"><i class="fa-brands fa-gitlab fa-5x" aria-label="gitlab"></i></span> <span style="color:#74C0FC"><i class="fa-brands fa-github fa-5x" aria-label="github"></i></span> <span style="color:#1d78f3"><i class="fa-brands fa-bitbucket fa-5x" aria-label="bitbucket"></i></span> <span style="font-size:1.6em;">self host</span></p>
</div>
</section>
<section id="quarto" class="slide level2">
<h2>Quarto</h2>
<p>Quarto enables you to weave together content and executable code into a finished presentation. To learn more about Quarto presentations see <a href="https://quarto.org/docs/presentations/" class="uri">https://quarto.org/docs/presentations/</a>.</p>
<section id="git-organization" class="slide level2">
<h2><span style="color:#f34c26">git</span> organization</h2>
<div class="smaller_text">
<p>the repository (think directory) is the fundamental organizational unit</p>
</div>
<div style="background:white; width:40%; display:block; margin-left:auto; margin-right:auto">
<div class="quarto-figure quarto-figure-center">
<figure>
<p><img data-src="images/organization_git.png" class="quarto-figure quarto-figure-center"></p>
</figure>
</div>
</div>
</section>
<section id="bullets" class="slide level2">
<h2>Bullets</h2>
<p>When you click the <strong>Render</strong> button a document will be generated that includes:</p>
<section id="github-organization" class="slide level2">
<h2><span style="color:#74C0FC">GitHub</span> organization</h2>
<div style="font-size:0.6em;">
<ul>
<li>Content authored with markdown</li>
<li>Output from executable code</li>
<li>repositories can be <span style="color:yellow">public</span> (controlled write access) or <span style="color:yellow">private</span> (controlled read access)</li>
<li>repository owner can provide write access to other accounts</li>
<li><span style="color:yellow">organizations</span> can link many accounts
<ul>
<li>accounts within organizations can be organized into <span style="color:yellow">teams</span> for additional organization and access control</li>
</ul></li>
</ul>
</div>
<div style="background:white; width:80%; display:block; margin-left:auto; margin-right:auto">
<div class="quarto-figure quarto-figure-center">
<figure>
<p><img data-src="images/organization_github.png" class="quarto-figure quarto-figure-center"></p>
</figure>
</div>
</div>
</section>
<section id="code" class="slide level2">
<h2>Code</h2>
<p>When you click the <strong>Render</strong> button a presentation will be generated that includes both content and the output of embedded code. You can embed code like this:</p>
<div class="cell">
<div class="cell-output cell-output-stdout">
<pre><code>[1] 2</code></pre>
<section id="synchronization-collaboration-and-communication-with-github" class="slide level2 smaller">
<h2>synchronization, collaboration, and communication with <span style="color:#74C0FC">GitHub</span></h2>
<div style="background:white;">
<div class="quarto-layout-panel" data-layout-ncol="2">
<div class="quarto-layout-row">
<div class="quarto-layout-cell" style="flex-basis: 50.0%;justify-content: center;">
<p><img data-src="images/git_team.png" style="width:80.0%"></p>
</div>
<div class="quarto-layout-cell" style="flex-basis: 50.0%;justify-content: center;">
<p><img data-src="images/git_team_pull.png" style="width:90.0%"></p>
</div>
</div>
</div>
</div>
<div class="quarto-auto-generated-content">
Expand Down Expand Up @@ -626,44 +665,6 @@ <h2>Code</h2>
]
});
</script>

<script>
// htmlwidgets need to know to resize themselves when slides are shown/hidden.
// Fire the "slideenter" event (handled by htmlwidgets.js) when the current
// slide changes (different for each slide format).
(function () {
// dispatch for htmlwidgets
function fireSlideEnter() {
const event = window.document.createEvent("Event");
event.initEvent("slideenter", true, true);
window.document.dispatchEvent(event);
}

function fireSlideChanged(previousSlide, currentSlide) {
fireSlideEnter();

// dispatch for shiny
if (window.jQuery) {
if (previousSlide) {
window.jQuery(previousSlide).trigger("hidden");
}
if (currentSlide) {
window.jQuery(currentSlide).trigger("shown");
}
}
}

// hookup for slidy
if (window.w3c_slidy) {
window.w3c_slidy.add_observer(function (slide_num) {
// slide_num starts at position 1
fireSlideChanged(null, w3c_slidy.slides[slide_num - 1]);
});
}

})();
</script>

<script id="quarto-html-after-body" type="application/javascript">
window.document.addEventListener("DOMContentLoaded", function (event) {
const toggleBodyColorMode = (bsSheetEl) => {
Expand Down Expand Up @@ -740,6 +741,24 @@ <h2>Code</h2>
// clear code selection
e.clearSelection();
});
var localhostRegex = new RegExp(/^(?:http|https):\/\/localhost\:?[0-9]*\//);
var mailtoRegex = new RegExp(/^mailto:/);
var filterRegex = new RegExp('/' + window.location.host + '/');
var isInternal = (href) => {
return filterRegex.test(href) || localhostRegex.test(href) || mailtoRegex.test(href);
}
// Inspect non-navigation links and adorn them if external
var links = window.document.querySelectorAll('a[href]:not(.nav-link):not(.navbar-brand):not(.toc-action):not(.sidebar-link):not(.sidebar-item-toggle):not(.pagination-link):not(.no-external):not([aria-hidden]):not(.dropdown-item):not(.quarto-navigation-tool)');
for (var i=0; i<links.length; i++) {
const link = links[i];
if (!isInternal(link.href)) {
// undo the damage that might have been done by quarto-nav.js in the case of
// links that we want to consider external
if (link.dataset.originalHref !== undefined) {
link.href = link.dataset.originalHref;
}
}
}
function tippyHover(el, contentFn, onTriggerFn, onUntriggerFn) {
const config = {
allowHTML: true,
Expand Down Expand Up @@ -776,7 +795,11 @@ <h2>Code</h2>
try { href = new URL(href).hash; } catch {}
const id = href.replace(/^#\/?/, "");
const note = window.document.getElementById(id);
return note.innerHTML;
if (note) {
return note.innerHTML;
} else {
return "";
}
});
}
const findCites = (el) => {
Expand Down
62 changes: 45 additions & 17 deletions git_primer.qmd
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ gitGraph

**what it is:**

* an [open-source]{style="color: yellow;"}, [distributed]{style="color: yellow;"} version control system designed for [speed and efficiency]{style="color: yellow;"}[^1]
* an [open-source]{style="color:yellow;"}, [distributed]{style="color:yellow;"} version control system designed for [speed and efficiency]{style="color:yellow;"}[^1]

<br>

Expand All @@ -59,45 +59,73 @@ gitGraph

## {#git_github data-menu-title="github is not git" .center}

:::{.r-stack}
::: {.r-stack}

<span style="color:#f34c26">{{< fa brands git-alt size=5x >}}</span>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<span style="font-size:100px;">!=</span>
<span style="font-size:2em;">!=</span>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<span style="color:#74C0FC">{{< fa brands github size=5x >}}</span>

:::

<br>

## {#not_just_github data-menu-title="not just github" .center}
::: left

::: smaller_text

- Git: version control software used to track files in a directory (a repository)
+ Git creates the versioned history of a repository
- GitHub: website that allows users to store their Git repositories and share them with others (i.e., a graphical user interface)

:::

:::

:::{.r-stack}

## {#not_just_github data-menu-title="not just github" .center}

::: {.r-stack}
<span style="color:#f34c26">{{< fa brands gitlab size=5x >}}</span>
<span style="color:#74C0FC">{{< fa brands github size=5x >}}</span>
<span style="color:#1d78f3">{{< fa brands bitbucket size=5x >}}</span>

[self host]{style="font-size:1.6em;"}
:::


## Quarto
## [git]{style="color:#f34c26"} organization

Quarto enables you to weave together content and executable code into a finished presentation. To learn more about Quarto presentations see <https://quarto.org/docs/presentations/>.
::: smaller_text
the repository (think directory) is the fundamental organizational unit
:::

## Bullets
::: {style="background:white; width:40%; display:block; margin-left:auto; margin-right:auto"}
![](images/organization_git.png){fig-align="center"}
:::

When you click the **Render** button a document will be generated that includes:
## [GitHub]{style="color:#74C0FC"} organization

- Content authored with markdown
- Output from executable code
::: {style="font-size:0.6em;"}
* repositories can be [public]{style="color:yellow"} (controlled write access) or [private]{style="color:yellow"} (controlled read access)
* repository owner can provide write access to other accounts
* [organizations]{style="color:yellow"} can link many accounts
+ accounts within organizations can be organized into [teams]{style="color:yellow"} for additional organization and access control
:::

## Code
::: {style="background:white; width:80%; display:block; margin-left:auto; margin-right:auto"}
![](images/organization_github.png){fig-align="center"}
:::

When you click the **Render** button a presentation will be generated that includes both content and the output of embedded code. You can embed code like this:

```{r}
1 + 1
```
## synchronization, collaboration, and communication with [GitHub]{style="color:#74C0FC"} {.smaller}

::: {style="background:white;"}
::: {layout-ncol=2}

![](images/git_team.png){width=80%}

![](images/git_team_pull.png){width=90%}

:::
:::
2 changes: 1 addition & 1 deletion git_primer_files/libs/revealjs/dist/theme/quarto.css
View file

Large diffs are not rendered by default.

Binary file added images/git_team.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/git_team_pull.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/organization_git.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/organization_github.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit b461698

Please sign in to comment.