update slides
This commit is contained in:
Heerko
parent
8e00d7a739
commit
55e0949649
29
html_output/2026-01-08_hrko.html
Normal file
29
html_output/2026-01-08_hrko.html
Normal file
|
|
@ -0,0 +1,29 @@
|
||||||
|
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><title>Braids - Intro to Git</title><meta charset="UTF-8"></meta><meta name="generator" content="Hovercraft! 1.0 http://regebro.github.com/hovercraft"></meta><meta name="author" content="H&D"></meta><link rel="stylesheet" href="css/hovercraft.css" media="all"></link><link rel="stylesheet" href="css/highlight.css" media="all"></link><link rel="stylesheet" href="slides.css" media="screen,projection"></link><script type="text/x-mathjax-config">
|
||||||
|
MathJax.Hub.Config({
|
||||||
|
showProcessingMessages: false,
|
||||||
|
messageStyle: "none",
|
||||||
|
TeX : { extensions : ['color.js'] }
|
||||||
|
});
|
||||||
|
</script></head><body class="impress-not-supported"><div id="impress-help"></div><div class="header"><p>Soilpunk 🌏🤘 - Joulethief</p></div><div id="impress"><div class="step step-level-1" step="0" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="0" data-y="0" data-z="0"><h1 id="git-as-archiving-myspace-style-pages-90-min">Git as Archiving: MySpace-Style Pages (90 min)</h1><div class="notes"><p>Goal: introduce Git as an archiving practice (history, provenance, selection),
|
||||||
|
then do a playful branch-based website exercise published live.</p></div></div><div class="step step-level-1" step="1" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="1600" data-y="0" data-z="0"><h1 id="agenda-90-min">Agenda (90 min)</h1><ol><li>Context: what Git is, what it does, who uses it (10 min)</li><li>Install + quick sanity check (10 min)</li><li>Core concepts + core commands (20 min)</li><li>Forgejo: accounts + clone/push permissions (10 min)</li><li>Exercise: branch a page, publish live, iterate (35 min)</li><li>Wrap-up: good practices + next steps (5 min)</li></ol></div><div class="step step-level-1" step="2" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="3200" data-y="0" data-z="0"><h1 id="what-is-git">What is Git</h1><ul><li>Distributed version control system</li><li>Tracks changes over time</li><li>Enables:
|
||||||
|
- history (time)
|
||||||
|
- collaboration (many authors)
|
||||||
|
- experimentation (branches)
|
||||||
|
- traceability (who/what/when/why)</li></ul><p>Archiving analogy:</p><ul><li>commit = deposit with metadata</li><li>log = inventory / finding aid</li><li>branch = parallel dossier / alternative interpretation</li></ul></div><div class="step step-level-1" step="3" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="4800" data-y="0" data-z="0"><h1 id="what-git-is-not">What Git is not</h1><ul><li>Not a backup system (though it can help)</li><li>Not a file sync tool</li><li>Not a CMS</li><li>Not magic: it stores snapshots + metadata, you still choose what to record</li></ul></div><div class="step step-level-1" step="4" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="6400" data-y="0" data-z="0"><h1 id="ecosystem">Ecosystem</h1><ul><li>Git = the tool + file format</li><li>Hosting platforms:
|
||||||
|
- GitHub, GitLab, Bitbucket
|
||||||
|
- Forgejo / Gitea (self-hosted)</li></ul><p>Typical workflow terms:</p><ul><li>remote (server copy)</li><li>clone (get a copy)</li><li>push (send your commits)</li><li>pull/fetch (receive updates)</li></ul></div><div class="step step-level-1" step="5" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="8000" data-y="0" data-z="0"><h1 id="workshop-outcome">Workshop outcome</h1><p>Each participant will:</p><ul><li>clone a repo</li><li>create a branch</li><li>edit a simple profile website</li><li>commit changes with a clear message</li><li>push branch to Forgejo</li><li>see it appear in the live gallery</li></ul></div><div class="step step-level-1" step="6" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="9600" data-y="0" data-z="0"><h1 id="install-git">Install Git</h1><p>Check first:</p><pre class="highlight code bash">git<span class="w"> </span>--version</pre><p>If missing:</p><ul><li>macOS: Xcode Command Line Tools</li><li>Windows: Git for Windows</li><li>Linux: package manager (apt/dnf/pacman)</li></ul><p>Minimum requirement: you can run git in a terminal.</p></div><div class="step step-level-1" step="7" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="11200" data-y="0" data-z="0"><h1 id="configure-identity-once">Configure identity (once)</h1><pre class="highlight code bash">git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>user.name<span class="w"> </span><span class="s2">"Your Name"</span><span class="w">
|
||||||
|
</span>git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>user.email<span class="w"> </span><span class="s2">"you@example.com"</span></pre><p>Check:</p><pre class="highlight code bash">git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>--list</pre><div class="notes"><p>This shows up in commit metadata (provenance).</p></div></div><div class="step step-level-1" step="8" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="12800" data-y="0" data-z="0"><h1 id="core-concept-three-areas">Core concept: three areas</h1><ol><li>Working tree: your files right now</li><li>Staging area (index): selection for the next deposit</li><li>Repository history: commits (deposits)</li></ol><p>This is why Git feels "archival":</p><ul><li>you intentionally select what becomes part of the record.</li></ul></div><div class="step step-level-1" step="9" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="14400" data-y="0" data-z="0"><h1 id="commands-the-essential-set">Commands: the essential set</h1><p>You listed most, but for usability we add 3:</p><ul><li>git status (always)</li><li>git log (history)</li><li>git diff (what changed)</li></ul><p>Recommended minimal set for today:</p><ul><li>init, status, add, commit, branch/checkout, push, pull</li><li>plus: log, diff</li></ul></div><div class="step step-level-1" step="10" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="16000" data-y="0" data-z="0"><h1 id="command-git-init">Command: git init</h1><p>Create a repository in the current folder.</p><pre class="highlight code bash">git<span class="w"> </span>init</pre><p>Creates a .git/ directory containing history + metadata.</p><div class="notes"><p>For the exercise we will use git clone instead of git init.</p></div></div><div class="step step-level-1" step="11" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="17600" data-y="0" data-z="0"><h1 id="command-git-status-your-dashboard">Command: git status (your dashboard)</h1><pre class="highlight code bash">git<span class="w"> </span>status</pre><p>Shows:</p><ul><li>current branch</li><li>staged vs unstaged changes</li><li>untracked files</li></ul><p>If you only remember one command: remember this.</p></div><div class="step step-level-1" step="12" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="19200" data-y="0" data-z="0"><h1 id="command-git-add-selection">Command: git add (selection)</h1><p>Stage files for the next commit (deposit).</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>index.html<span class="w">
|
||||||
|
</span>git<span class="w"> </span>add<span class="w"> </span>assets/</pre><p>Stage everything (use carefully):</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>.</pre><div class="notes"><p>Staging is curatorial: select what belongs together.</p></div></div><div class="step step-level-1" step="13" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="20800" data-y="0" data-z="0"><h1 id="command-git-commit-deposit-metadata">Command: git commit (deposit + metadata)</h1><pre class="highlight code bash">git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Add MySpace-style profile page"</span></pre><p>Good commit message pattern:</p><ul><li>What changed</li><li>Why it changed (reason/intent)</li><li>Scope stays small</li></ul></div><div class="step step-level-1" step="14" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="22400" data-y="0" data-z="0"><h1 id="command-git-diff-what-changed">Command: git diff (what changed)</h1><p>Unstaged changes:</p><pre class="highlight code bash">git<span class="w"> </span>diff</pre><p>Staged changes:</p><pre class="highlight code bash">git<span class="w"> </span>diff<span class="w"> </span>--staged</pre></div><div class="step step-level-1" step="15" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="24000" data-y="0" data-z="0"><h1 id="command-git-log-inventory">Command: git log (inventory)</h1><pre class="highlight code bash">git<span class="w"> </span>log<span class="w"> </span>--oneline<span class="w"> </span>--decorate<span class="w"> </span>--graph<span class="w"> </span>-n<span class="w"> </span><span class="m">10</span></pre><p>Gives a quick "finding aid" of deposits.</p></div><div class="step step-level-1" step="16" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="25600" data-y="0" data-z="0"><h1 id="command-git-branch-and-git-checkout">Command: git branch and git checkout</h1><p>List branches:</p><pre class="highlight code bash">git<span class="w"> </span>branch</pre><p>Create a branch:</p><pre class="highlight code bash">git<span class="w"> </span>branch<span class="w"> </span>people/yourname</pre><p>Switch to branch:</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>people/yourname</pre><p>Shortcut (create + switch):</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>-b<span class="w"> </span>people/yourname</pre><div class="notes"><p>Branches are parallel dossiers: safe space for changes.</p></div></div><div class="step step-level-1" step="17" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="27200" data-y="0" data-z="0"><h1 id="command-git-push-git-pull">Command: git push / git pull</h1><p>Push your branch to the server:</p><pre class="highlight code bash">git<span class="w"> </span>push<span class="w"> </span>-u<span class="w"> </span>origin<span class="w"> </span>people/yourname</pre><p>Pull updates from server:</p><pre class="highlight code bash">git<span class="w"> </span>pull</pre><div class="notes"><p>During the exercise you mostly push your branch.
|
||||||
|
Pull is mainly for getting new changes on main (if needed).</p></div></div><div class="step step-level-1" step="18" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="28800" data-y="0" data-z="0"><h1 id="optional-git-rm">Optional: git rm</h1><p>Remove a tracked file and stage the removal:</p><pre class="highlight code bash">git<span class="w"> </span>rm<span class="w"> </span>old.html<span class="w">
|
||||||
|
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Remove old page"</span></pre><p>For this workshop you probably will not need it.</p></div><div class="step step-level-1" step="19" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="30400" data-y="0" data-z="0"><h1 id="forgejo-what-we-use-today">Forgejo: what we use today</h1><ul><li>Forgejo hosts the central repository (remote)</li><li>You will:
|
||||||
|
- create an account
|
||||||
|
- clone via HTTPS/SSH
|
||||||
|
- push your branch</li></ul><p>Rules for today:</p><ul><li>do NOT push to main</li><li>create your branch under people/<slug></li></ul></div><div class="step step-level-1" step="20" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="32000" data-y="0" data-z="0"><h1 id="forgejo-account-setup">Forgejo: account setup</h1><ol><li>Create account at: git.<your-domain></li><li>Confirm you can sign in</li><li>Add SSH key (optional) OR use HTTPS credentials</li></ol><p>We will provide:</p><ul><li>repo URL</li><li>branch naming convention</li><li>live gallery URL: braids.<your-domain></li></ul></div><div class="step step-level-1" step="21" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="33600" data-y="0" data-z="0"><h1 id="exercise-overview">Exercise overview</h1><p>You will build a deliberately simple “MySpace-style” page:</p><ul><li>"Hi, I'm …"</li><li>one gif</li><li>one link</li><li>optional: background, glitter, bad taste encouraged</li></ul><p>Workflow loop:</p><p>clone -> branch -> edit -> status -> add -> commit -> push -> view -> iterate</p></div><div class="step step-level-1" step="22" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="35200" data-y="0" data-z="0"><h1 id="exercise-step-1-clone">Exercise: step 1 (clone)</h1><pre class="highlight code bash">git<span class="w"> </span>clone<span class="w"> </span><REPO_URL><span class="w">
|
||||||
|
</span><span class="nb">cd</span><span class="w"> </span><REPO_NAME></pre><p>Sanity check:</p><pre class="highlight code bash">git<span class="w"> </span>status<span class="w">
|
||||||
|
</span>git<span class="w"> </span>branch</pre></div><div class="step step-level-1" step="23" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="36800" data-y="0" data-z="0"><h1 id="exercise-step-2-create-your-branch">Exercise: step 2 (create your branch)</h1><p>Choose a slug: lowercase, no spaces. Example: people/alex.</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>-b<span class="w"> </span>people/<your-slug></pre><p>Confirm:</p><pre class="highlight code bash">git<span class="w"> </span>status</pre></div><div class="step step-level-1" step="24" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="38400" data-y="0" data-z="0"><h1 id="exercise-step-3-edit-the-page">Exercise: step 3 (edit the page)</h1><p>Edit the root index.html (and optionally style.css, assets/).</p><p>Make a visible change first:</p><ul><li>your name</li><li>one gif</li><li>one link</li></ul><p>Then check changes:</p><pre class="highlight code bash">git<span class="w"> </span>diff<span class="w">
|
||||||
|
</span>git<span class="w"> </span>status</pre></div><div class="step step-level-1" step="25" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="40000" data-y="0" data-z="0"><h1 id="exercise-step-4-stage-commit">Exercise: step 4 (stage + commit)</h1><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>index.html<span class="w">
|
||||||
|
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Customize profile page for <your-slug>"</span></pre><p>If you added assets:</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>assets/<span class="w">
|
||||||
|
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Add assets for <your-slug>"</span></pre><div class="notes"><p>Small commits win. One change = one deposit.</p></div></div><div class="step step-level-1" step="26" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="41600" data-y="0" data-z="0"><h1 id="exercise-step-5-push-your-branch">Exercise: step 5 (push your branch)</h1><pre class="highlight code bash">git<span class="w"> </span>push<span class="w"> </span>-u<span class="w"> </span>origin<span class="w"> </span>people/<your-slug></pre><p>If prompted for credentials, use your Forgejo login method.</p></div><div class="step step-level-1" step="27" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="43200" data-y="0" data-z="0"><h1 id="exercise-step-6-view-live">Exercise: step 6 (view live)</h1><p>Open the gallery:</p><ul><li>https://braids.<your-domain>/</li></ul><p>Find your card:</p><ul><li>people/<your-slug>/</li></ul><p>Iterate:</p><p>edit -> status -> add -> commit -> push -> refresh</p></div><div class="step step-level-1" step="28" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="44800" data-y="0" data-z="0"><h1 id="common-problems-fast-fixes">Common problems (fast fixes)</h1><p>Wrong branch:</p><pre class="highlight code bash">git<span class="w"> </span>branch<span class="w">
|
||||||
|
</span>git<span class="w"> </span>checkout<span class="w"> </span>people/<your-slug></pre><p>Nothing staged:</p><pre class="highlight code bash">git<span class="w"> </span>status<span class="w">
|
||||||
|
</span>git<span class="w"> </span>add<span class="w"> </span>index.html</pre><p>Push rejected (main protected):</p><ul><li>You are on main. Switch to your branch.</li></ul><p>Auth issues:</p><ul><li>HTTPS: check username/token/password</li><li>SSH: check key added to Forgejo + ssh -T</li></ul></div><div class="step step-level-1" step="29" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="46400" data-y="0" data-z="0"><h1 id="concept-recap-in-archiving-terms">Concept recap in archiving terms</h1><ul><li>commit = deposit (with minimal metadata)</li><li>log = inventory / chain of custody</li><li>diff = conservation report (what changed)</li><li>branch = parallel dossier</li><li>push = deposit to institutional archive (remote)</li></ul></div><div class="step step-level-1" step="30" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="48000" data-y="0" data-z="0"><h1 id="suggested-good-enough-commit-messages">Suggested “good enough” commit messages</h1><p>Bad:</p><ul><li>"update"</li><li>"stuff"</li><li>"changes"</li></ul><p>Better:</p><ul><li>"Add animated gif and profile link"</li><li>"Change background and typography"</li><li>"Fix broken image path"</li><li>"Refactor layout: move link block above gif"</li></ul><p>Rule: message should still make sense in 6 months.</p></div><div class="step step-level-1" step="31" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="49600" data-y="0" data-z="0"><h1 id="optional-extension-if-time-remains">Optional extension (if time remains)</h1><ul><li>Compare two branches visually (gallery view)</li><li>Add a second commit that intentionally breaks something,
|
||||||
|
then fix it with a third commit</li><li>Show git log to narrate your work as a documented process</li></ul></div><div class="step step-level-1" step="32" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="51200" data-y="0" data-z="0"><h1 id="wrap-up">Wrap-up</h1><p>You should now be able to:</p><ul><li>create a branch safely</li><li>record changes as commits</li><li>publish to a remote</li><li>read history and differences</li></ul><p>Next steps:</p><ul><li>merging via PRs (review workflow)</li><li>tags/releases (archival milestones)</li><li>basic collaboration patterns (feature branches)</li></ul><div class="notes"><p>End: remind participants their branches will be removed after the workshop.</p></div></div></div><script type="text/javascript" src="js/impress.js"></script><script type="text/javascript" src="js/gotoSlide.js"></script><script type="text/javascript" src="js/hovercraft.js"></script></body></html>
|
||||||
30
html_output/2026-01-09_hrko.html
Normal file
30
html_output/2026-01-09_hrko.html
Normal file
|
|
@ -0,0 +1,30 @@
|
||||||
|
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><title>Braids - Intro to Git</title><meta charset="UTF-8"></meta><meta name="generator" content="Hovercraft! 1.0 http://regebro.github.com/hovercraft"></meta><meta name="author" content="H&D"></meta><link rel="stylesheet" href="css/hovercraft.css" media="all"></link><link rel="stylesheet" href="css/highlight.css" media="all"></link><link rel="stylesheet" href="slides.css" media="screen,projection"></link><script type="text/x-mathjax-config">
|
||||||
|
MathJax.Hub.Config({
|
||||||
|
showProcessingMessages: false,
|
||||||
|
messageStyle: "none",
|
||||||
|
TeX : { extensions : ['color.js'] }
|
||||||
|
});
|
||||||
|
</script></head><body class="impress-not-supported"><div id="impress-help"></div><div class="header"><p>Braids - Intro to Git</p></div><div id="impress"><div class="step step-level-1" step="0" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="0" data-y="0" data-z="0"><h1 id="braids-intro-to-git">Braids - Intro to Git</h1><div class="notes"><p>Goal: introduce Git as an archiving practice,
|
||||||
|
then do a little branch-based website exercise published live.</p></div></div><div class="step step-level-1" step="1" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="1600" data-y="0" data-z="0"><h1 id="agenda-90-min">Agenda (90 min)</h1><ol><li>Context: what Git is, what it does, who uses it (10 min)</li><li>Install Git (10 min)</li><li>Core concepts + core commands (20 min)</li><li>Forgejo: accounts + clone/push permissions (10 min)</li><li>Exercise: branch a page, publish live, iterate (35 min)</li><li>Wrap-up: good practices + next steps (5 min)</li></ol></div><div class="step step-level-1" step="2" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="3200" data-y="0" data-z="0"><h1 id="what-is-git">What is Git</h1><ul><li>Distributed version control system</li><li>Tracks changes over time</li><li>Enables:
|
||||||
|
- history (time)
|
||||||
|
- collaboration (many authors)
|
||||||
|
- experimentation (branches)
|
||||||
|
- traceability (who/what/when/why)</li></ul><p>Archiving analogy:</p><ul><li>commit = deposit with metadata</li><li>log = inventory / finding aid</li><li>branch = parallel dossier / alternative interpretation</li></ul></div><div class="step step-level-1" step="3" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="4800" data-y="0" data-z="0"><h1 id="what-git-is-not">What Git is not</h1><ul><li>Not a backup system (though it can help)</li><li>Not a file sync tool</li><li>Not a CMS</li><li>Not magic: it stores snapshots + metadata, you still choose what to record</li></ul></div><div class="step step-level-1" step="4" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="6400" data-y="0" data-z="0"><h1 id="ecosystem">Ecosystem</h1><ul><li>Git = the tool + file format</li><li>Hosting platforms:
|
||||||
|
- GitHub, GitLab, Bitbucket
|
||||||
|
- Forgejo / Gitea (self-hosted)</li></ul></div><div class="step step-level-1" step="5" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="8000" data-y="0" data-z="0"><h1 id="typical-workflow">Typical workflow</h1><ul><li>remote (server copy)</li><li>clone (get a copy)</li><li>push (send your commits back to the server)</li><li>pull/fetch (receive updates)</li></ul></div><div class="step step-level-1" step="6" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="9600" data-y="0" data-z="0"><h1 id="workshop-outcome">Workshop outcome</h1><p>Each participant will:</p><ul><li>clone a repo</li><li>create a branch</li><li>edit a simple profile website</li><li>commit changes with a clear message</li><li>push branch to Forgejo</li><li>see it appear in the live gallery</li></ul></div><div class="step step-level-1" step="7" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="11200" data-y="0" data-z="0"><h1 id="install-git">Install Git</h1><p>Check first:</p><pre class="highlight code bash">git<span class="w"> </span>--version</pre><p>If missing:</p><ul><li>macOS: Xcode Command Line Tools</li><li>Windows: Git for Windows</li><li>Linux: package manager (apt/dnf/pacman)</li></ul><p>Minimum requirement: you can run git in a terminal.</p></div><div class="step step-level-1" step="8" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="12800" data-y="0" data-z="0"><h1 id="configure-identity-once">Configure identity (once)</h1><pre class="highlight code bash">git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>user.name<span class="w"> </span><span class="s2">"Your Name"</span><span class="w">
|
||||||
|
</span>git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>user.email<span class="w"> </span><span class="s2">"you@example.com"</span></pre><p>Check:</p><pre class="highlight code bash">git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>--list</pre><div class="notes"><p>This shows up in commit metadata (provenance).</p></div></div><div class="step step-level-1" step="9" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="14400" data-y="0" data-z="0"><h1 id="core-concept-three-areas">Core concept: three areas</h1><ol><li>Working tree: your files right now</li><li>Staging area (index): selection for the next deposit</li><li>Repository history: commits (deposits)</li></ol><p>This is why Git feels "archival":</p><ul><li>you intentionally select what becomes part of the record.</li></ul></div><div class="step step-level-1" step="10" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="16000" data-y="0" data-z="0"><h1 id="commands-the-essential-set">Commands: the essential set</h1><ul><li>git status (always)</li><li>git init (initalise a repo)</li><li>git commit (store changes in the repo)</li><li>git add (add files to the commit)</li><li>git branch (take a detour)</li><li>git merge (merge branches)</li><li>git checkout (get the repo at a specific state)</li><li>git fetch (sync with a repo online)</li><li>git pull (sync with a repo online and merge)</li><li>git diff (what changed)</li><li>git log (history)</li><li>plus: log, diff</li></ul></div><div class="step step-level-1" step="11" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="17600" data-y="0" data-z="0"><h1 id="command-git-init">Command: git init</h1><p>Create a repository in the current folder.
|
||||||
|
Use this when you are creating and working on your own projects.</p><pre class="highlight code bash">git<span class="w"> </span>init</pre><p>Creates a .git/ directory containing history + metadata.</p><div class="notes"><p>For the exercise we will use git clone instead of git init.</p></div></div><div class="step step-level-1" step="12" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="19200" data-y="0" data-z="0"><h1 id="command-git-clone">Command: git clone</h1><p>Cloen (copy) a repository in the current folder.</p><pre class="highlight code bash">git<span class="w"> </span>clone<span class="w"> </span>https://git.hackersanddesigners.nl/hrk/braids<span class="w"> </span><destination></pre><p>Downloads a repo from the web, complete with the full commit history and all changes.</p></div><div class="step step-level-1" step="13" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="20800" data-y="0" data-z="0"><h1 id="command-git-status-your-dashboard">Command: git status (your dashboard)</h1><pre class="highlight code bash">git<span class="w"> </span>status</pre><p>Shows:</p><ul><li>current branch</li><li>staged vs unstaged changes</li><li>untracked files</li></ul></div><div class="step step-level-1" step="14" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="22400" data-y="0" data-z="0"><h1 id="command-git-add-select-files">Command: git add (select files)</h1><p>Stage files for the next commit.</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>index.html<span class="w">
|
||||||
|
</span>git<span class="w"> </span>add<span class="w"> </span>assets/</pre><p>Stage everything (use carefully):</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>.</pre><div class="notes"><p>Staging is curatorial: select what belongs together.</p></div></div><div class="step step-level-1" step="15" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="24000" data-y="0" data-z="0"><h1 id="command-git-commit">Command: git commit</h1><pre class="highlight code bash">git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Added name to my page"</span></pre><p>Good commit message pattern:</p><ul><li>What changed</li><li>Why it changed (reason/intent)</li><li>Scope stays small</li></ul><h1 id="command-git-log-inventory">Command: git log (inventory)</h1><pre class="highlight code bash">git<span class="w"> </span>log<span class="w"> </span>--oneline<span class="w"> </span>--graph</pre><p>Gives a quick "finding aid" of earlier commits. Press 'q' to exit.</p></div><div class="step step-level-1" step="16" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="25600" data-y="0" data-z="0"><h1 id="command-git-branch-and-git-checkout">Command: git branch and git checkout</h1><p>List branches:</p><pre class="highlight code bash">git<span class="w"> </span>branch</pre><p>Create a branch:</p><pre class="highlight code bash">git<span class="w"> </span>branch<span class="w"> </span>people/yourname</pre><p>Switch to branch:</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>people/yourname</pre><p>Shortcut (create + switch):</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>-b<span class="w"> </span>people/yourname</pre><div class="notes"><p>Branches are parallel dossiers: safe space for changes.</p></div></div><div class="step step-level-1" step="17" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="27200" data-y="0" data-z="0"><h1 id="command-git-push-git-pull">Command: git push / git pull</h1><p>Push your branch to the server:</p><pre class="highlight code bash">git<span class="w"> </span>push<span class="w"> </span>-u<span class="w"> </span>origin<span class="w"> </span>people/yourname</pre><p>Pull updates from server:</p><pre class="highlight code bash">git<span class="w"> </span>pull</pre><div class="notes"><p>During the exercise you mostly push your branch.
|
||||||
|
Pull is mainly for getting new changes on main (if needed).</p></div></div><div class="step step-level-1" step="18" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="28800" data-y="0" data-z="0"><h1 id="optional-git-rm">Optional: git rm</h1><p>Remove a tracked file and stage the removal:</p><pre class="highlight code bash">git<span class="w"> </span>rm<span class="w"> </span>old.html<span class="w">
|
||||||
|
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Remove old page"</span></pre><p>For this workshop you probably will not need it.</p></div><div class="step step-level-1" step="19" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="30400" data-y="0" data-z="0"><h1 id="forgejo-what-we-use-today">Forgejo: what we use today</h1><ul><li>Forgejo hosts the central repository (remote)</li><li>You will:
|
||||||
|
- create an account
|
||||||
|
- clone via HTTPS
|
||||||
|
- push your branch</li></ul><p>Share your username with us so we can add you as a collaborator</p><p>Rules for today:</p><ul><li>do NOT push to main</li><li>create your branch under people/<slug></li></ul></div><div class="step step-level-1" step="20" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="32000" data-y="0" data-z="0"><h1 id="forgejo-account-setup">Forgejo: account setup</h1><ol><li>Create account at: git.hackersanddesigners.nl</li><li>Confirm you can sign in</li></ol><p>We will provide:</p><ul><li><a href="https://git.hackersanddesigners.nl/hrk/braids">https://git.hackersanddesigners.nl/hrk/braids</a></li><li>branch naming convention</li><li>live gallery URL: braids.hackersanddesigners.nl</li></ul></div><div class="step step-level-1" step="21" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="33600" data-y="0" data-z="0"><h1 id="exercise-overview">Exercise overview</h1><p>You will build a (deliberately) simple page:</p><ul><li>"Hi, I'm …"</li><li>maybe a gif?</li><li>a link?</li><li>optional: background, glitter, bad taste encouraged</li></ul><p>Workflow loop:</p><p>clone -> branch -> edit -> status -> add -> commit -> push -> view -> iterate</p></div><div class="step step-level-1" step="22" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="35200" data-y="0" data-z="0"><h1 id="exercise-step-1-clone">Exercise: step 1 (clone)</h1><p>cd to a logical location in your computer, then:</p><pre class="highlight code bash">git<span class="w"> </span>clone<span class="w"> </span>https://git.hackersanddesigners.nl/hrk/braids<span class="w">
|
||||||
|
</span><span class="nb">cd</span><span class="w"> </span>braids</pre><p>If everything went well, check the repo with:</p><pre class="highlight code bash">git<span class="w"> </span>status<span class="w">
|
||||||
|
</span>git<span class="w"> </span>branch</pre></div><div class="step step-level-1" step="23" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="36800" data-y="0" data-z="0"><h1 id="exercise-step-2-create-your-branch">Exercise: step 2 (create your branch)</h1><p>Choose a slug: lowercase, no spaces. This can be your name or an alias. Example: change people/<your-slug> in the command below to people/alex.</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>-b<span class="w"> </span>people/<your-slug></pre><p>Confirm:</p><pre class="highlight code bash">git<span class="w"> </span>status</pre></div><div class="step step-level-1" step="24" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="38400" data-y="0" data-z="0"><h1 id="exercise-step-3-edit-the-page">Exercise: step 3 (edit the page)</h1><p>Edit the root index.html (and optionally style.css, assets/).</p><p>Make a visible change first:</p><ul><li>Change the name to your name (or your alias)</li></ul><p>Then check changes:</p><pre class="highlight code bash">git<span class="w"> </span>diff<span class="w">
|
||||||
|
</span>git<span class="w"> </span>status</pre></div><div class="step step-level-1" step="25" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="40000" data-y="0" data-z="0"><h1 id="exercise-step-4-stage-commit">Exercise: step 4 (stage + commit)</h1><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>index.html<span class="w">
|
||||||
|
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Customize profile page for <your-slug>"</span></pre><p>If you added assets:</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>assets/<span class="w">
|
||||||
|
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Add assets for <your-slug>"</span></pre><div class="notes"><p>Small commits win. One change = one deposit.</p></div></div><div class="step step-level-1" step="26" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="41600" data-y="0" data-z="0"><h1 id="exercise-step-5-push-your-branch">Exercise: step 5 (push your branch)</h1><pre class="highlight code bash">git<span class="w"> </span>push<span class="w"> </span>-u<span class="w"> </span>origin<span class="w"> </span>people/<your-slug></pre><p>(Again, change <your-slug>!)</p><p>If prompted for credentials, use your Forgejo login method.</p></div><div class="step step-level-1" step="27" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="43200" data-y="0" data-z="0"><h1 id="exercise-step-6-view-live">Exercise: step 6 (view live)</h1><p>Open the gallery:</p><ul><li>https://braids.hackersanddesigners.nl/</li></ul><p>Find your card:</p><ul><li>people/<your-slug>/</li></ul><p>Iterate:</p><p>edit -> status -> add -> commit -> push -> refresh</p></div><div class="step step-level-1" step="28" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="44800" data-y="0" data-z="0"><h1 id="common-problems-fast-fixes">Common problems (fast fixes)</h1><p>Wrong branch:</p><pre class="highlight code bash">git<span class="w"> </span>branch<span class="w">
|
||||||
|
</span>git<span class="w"> </span>checkout<span class="w"> </span>people/<your-slug></pre><p>Nothing staged:</p><pre class="highlight code bash">git<span class="w"> </span>status<span class="w">
|
||||||
|
</span>git<span class="w"> </span>add<span class="w"> </span>index.html</pre><p>Push rejected (main protected):</p><ul><li>You are on main. Switch to your branch.</li></ul><p>Auth issues:</p><ul><li>HTTPS: check username/password</li></ul></div><div class="step step-level-1" step="29" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="46400" data-y="0" data-z="0"><h1 id="concept-recap-in-archiving-terms">Concept recap in archiving terms</h1><ul><li>commit = deposit (with minimal metadata)</li><li>log = inventory / chain of custody</li><li>diff = conservation report (what changed)</li><li>branch = parallel dossier</li><li>push = share publicly / deposit to institutional archive (remote)</li></ul></div><div class="step step-level-1" step="30" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="48000" data-y="0" data-z="0"><h1 id="suggested-good-enough-commit-messages">Suggested “good enough” commit messages</h1><p>Bad:</p><ul><li>"update"</li><li>"stuff"</li><li>"changes"</li></ul><p>Better:</p><ul><li>"Add animated gif and profile link"</li><li>"Change background and typography"</li><li>"Fix broken image path"</li></ul><p>Rule: message should still make sense in 6 months.</p></div><div class="step step-level-1" step="31" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="49600" data-y="0" data-z="0"><h1 id="optional-extension-if-time-remains">Optional extension (if time remains)</h1><ul><li>Compare two branches visually (gallery view)</li><li>Add a second commit that intentionally breaks something,
|
||||||
|
then fix it with a third commit</li><li>Show git log to narrate your work as a documented process</li></ul></div><div class="step step-level-1" step="32" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="51200" data-y="0" data-z="0"><h1 id="wrap-up">Wrap-up</h1><p>You should now be able to:</p><ul><li>create a branch safely</li><li>record changes as commits</li><li>publish to a remote</li><li>read history and differences</li></ul><p>Learn more:</p><ul><li><a href="https://learngitbranching.js.org/">Learn Git Branching</a></li><li><a href="https://ohmygit.org/">Oh My Git</a></li></ul><div class="notes"><p>End: remind participants their branches will be removed after the workshop.</p></div></div></div><script type="text/javascript" src="js/impress.js"></script><script type="text/javascript" src="js/gotoSlide.js"></script><script type="text/javascript" src="js/hovercraft.js"></script></body></html>
|
||||||
|
|
@ -4,26 +4,27 @@
|
||||||
messageStyle: "none",
|
messageStyle: "none",
|
||||||
TeX : { extensions : ['color.js'] }
|
TeX : { extensions : ['color.js'] }
|
||||||
});
|
});
|
||||||
</script></head><body class="impress-not-supported"><div id="impress-help"></div><div class="header"><p>Braids - Intro to Git</p></div><div id="impress"><div class="step step-level-1" step="0" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="0" data-y="0" data-z="0"><h1 id="braids-intro-to-git">Braids - Intro to Git</h1><div class="notes"><p>Goal: introduce Git as an archiving practice (history, provenance, selection),
|
</script></head><body class="impress-not-supported"><div id="impress-help"></div><div class="header"><p>Braids - Intro to Git</p></div><div id="impress"><div class="step step-level-1" step="0" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="0" data-y="0" data-z="0"><h1 id="braids-intro-to-git">Braids - Intro to Git</h1><div class="notes"><p>Goal: introduce Git as an archiving practice,
|
||||||
then do a playful branch-based website exercise published live.</p></div></div><div class="step step-level-1" step="1" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="1600" data-y="0" data-z="0"><h1 id="agenda-90-min">Agenda (90 min)</h1><ol><li>Context: what Git is, what it does, who uses it (10 min)</li><li>Install + quick sanity check (10 min)</li><li>Core concepts + core commands (20 min)</li><li>Forgejo: accounts + clone/push permissions (10 min)</li><li>Exercise: branch a page, publish live, iterate (35 min)</li><li>Wrap-up: good practices + next steps (5 min)</li></ol></div><div class="step step-level-1" step="2" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="3200" data-y="0" data-z="0"><h1 id="what-is-git">What is Git</h1><ul><li>Distributed version control system</li><li>Tracks changes over time</li><li>Enables:
|
then do a little branch-based website exercise published live.</p></div></div><div class="step step-level-1" step="1" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="1600" data-y="0" data-z="0"><h1 id="agenda-90-min">Agenda (90 min)</h1><ol><li>Context: what Git is, what it does, who uses it (10 min)</li><li>Install Git (10 min)</li><li>Core concepts + core commands (20 min)</li><li>Forgejo: accounts + clone/push permissions (10 min)</li><li>Exercise: branch a page, publish live, iterate (35 min)</li><li>Wrap-up: good practices + next steps (5 min)</li></ol></div><div class="step step-level-1" step="2" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="3200" data-y="0" data-z="0"><h1 id="what-is-git">What is Git</h1><ul><li>Distributed version control system</li><li>Tracks changes over time</li><li>Enables:
|
||||||
- history (time)
|
- history (time)
|
||||||
- collaboration (many authors)
|
- collaboration (many authors)
|
||||||
- experimentation (branches)
|
- experimentation (branches)
|
||||||
- traceability (who/what/when/why)</li></ul><p>Archiving analogy:</p><ul><li>commit = deposit with metadata</li><li>log = inventory / finding aid</li><li>branch = parallel dossier / alternative interpretation</li></ul></div><div class="step step-level-1" step="3" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="4800" data-y="0" data-z="0"><h1 id="what-git-is-not">What Git is not</h1><ul><li>Not a backup system (though it can help)</li><li>Not a file sync tool</li><li>Not a CMS</li><li>Not magic: it stores snapshots + metadata, you still choose what to record</li></ul></div><div class="step step-level-1" step="4" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="6400" data-y="0" data-z="0"><h1 id="ecosystem">Ecosystem</h1><ul><li>Git = the tool + file format</li><li>Hosting platforms:
|
- traceability (who/what/when/why)</li></ul><p>Archiving analogy:</p><ul><li>commit = deposit with metadata</li><li>log = inventory / finding aid</li><li>branch = parallel dossier / alternative interpretation</li></ul></div><div class="step step-level-1" step="3" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="4800" data-y="0" data-z="0"><h1 id="what-git-is-not">What Git is not</h1><ul><li>Not a backup system (though it can help)</li><li>Not a file sync tool</li><li>Not a CMS</li><li>Not magic: it stores snapshots + metadata, you still choose what to record</li></ul></div><div class="step step-level-1" step="4" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="6400" data-y="0" data-z="0"><h1 id="ecosystem">Ecosystem</h1><ul><li>Git = the tool + file format</li><li>Hosting platforms:
|
||||||
- GitHub, GitLab, Bitbucket
|
- GitHub, GitLab, Bitbucket
|
||||||
- Forgejo / Gitea (self-hosted)</li></ul></div><div class="step step-level-1" step="5" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="8000" data-y="0" data-z="0"><h1 id="typical-workflow">Typical workflow</h1><ul><li>remote (server copy)</li><li>clone (get a copy)</li><li>push (send your commits back to the server)</li><li>pull/fetch (receive updates)</li></ul></div><div class="step step-level-1" step="6" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="9600" data-y="0" data-z="0"><h1 id="workshop-outcome">Workshop outcome</h1><p>Each participant will:</p><ul><li>clone a repo</li><li>create a branch</li><li>edit a simple profile website</li><li>commit changes with a clear message</li><li>push branch to Forgejo</li><li>see it appear in the live gallery</li></ul></div><div class="step step-level-1" step="7" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="11200" data-y="0" data-z="0"><h1 id="install-git">Install Git</h1><p>Check first:</p><pre class="highlight code bash">git<span class="w"> </span>--version</pre><p>If missing:</p><ul><li>macOS: Xcode Command Line Tools</li><li>Windows: Git for Windows</li><li>Linux: package manager (apt/dnf/pacman)</li></ul><p>Minimum requirement: you can run git in a terminal.</p></div><div class="step step-level-1" step="8" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="12800" data-y="0" data-z="0"><h1 id="configure-identity-once">Configure identity (once)</h1><pre class="highlight code bash">git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>user.name<span class="w"> </span><span class="s2">"Your Name"</span><span class="w">
|
- Forgejo / Gitea (self-hosted)</li></ul></div><div class="step step-level-1" step="5" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="8000" data-y="0" data-z="0"><h1 id="typical-workflow">Typical workflow</h1><ul><li>remote (server copy)</li><li>clone (get a copy)</li><li>push (send your commits back to the server)</li><li>pull/fetch (receive updates)</li></ul></div><div class="step step-level-1" step="6" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="9600" data-y="0" data-z="0"><h1 id="workshop-outcome">Workshop outcome</h1><p>Each participant will:</p><ul><li>clone a repo</li><li>create a branch</li><li>edit a simple profile website</li><li>commit changes with a clear message</li><li>push branch to Forgejo</li><li>see it appear in the live gallery</li></ul></div><div class="step step-level-1" step="7" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="11200" data-y="0" data-z="0"><h1 id="install-git">Install Git</h1><p>Check first:</p><pre class="highlight code bash">git<span class="w"> </span>--version</pre><p>If missing:</p><ul><li>macOS: Xcode Command Line Tools</li><li>Windows: Git for Windows</li><li>Linux: package manager (apt/dnf/pacman)</li></ul><p>Minimum requirement: you can run git in a terminal.</p></div><div class="step step-level-1" step="8" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="12800" data-y="0" data-z="0"><h1 id="configure-identity-once">Configure identity (once)</h1><pre class="highlight code bash">git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>user.name<span class="w"> </span><span class="s2">"Your Name"</span><span class="w">
|
||||||
</span>git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>user.email<span class="w"> </span><span class="s2">"you@example.com"</span></pre><p>Check:</p><pre class="highlight code bash">git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>--list</pre><div class="notes"><p>This shows up in commit metadata (provenance).</p></div></div><div class="step step-level-1" step="9" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="14400" data-y="0" data-z="0"><h1 id="core-concept-three-areas">Core concept: three areas</h1><ol><li>Working tree: your files right now</li><li>Staging area (index): selection for the next deposit</li><li>Repository history: commits (deposits)</li></ol><p>This is why Git feels "archival":</p><ul><li>you intentionally select what becomes part of the record.</li></ul></div><div class="step step-level-1" step="10" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="16000" data-y="0" data-z="0"><h1 id="commands-the-essential-set">Commands: the essential set</h1><ul><li>git status (always)</li><li>git init (initalise a repo)</li><li>git commit (store changes in the repo)</li><li>git add (add files to the commit)</li><li>git branch (take a detour)</li><li>git merge (merge branches)</li><li>git checkout (get the repo at a specific state)</li><li>git fetch (sync with a repo online)</li><li>git pull (sync with a repo online and merge)</li><li>git diff (what changed)</li><li>git log (history)</li><li>plus: log, diff</li></ul></div><div class="step step-level-1" step="11" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="17600" data-y="0" data-z="0"><h1 id="command-git-init">Command: git init</h1><p>Create a repository in the current folder.</p><pre class="highlight code bash">git<span class="w"> </span>init</pre><p>Creates a .git/ directory containing history + metadata.</p><div class="notes"><p>For the exercise we will use git clone instead of git init.</p></div></div><div class="step step-level-1" step="12" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="19200" data-y="0" data-z="0"><h1 id="command-git-clone">Command: git clone</h1><p>Cloen (copy) a repository in the current folder.</p><pre class="highlight code bash">git<span class="w"> </span>clone<span class="w"> </span><repo_url><span class="w"> </span><destination></pre><p>Downloads a repo from the web, complete with the full commit history and all changes.</p></div><div class="step step-level-1" step="13" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="20800" data-y="0" data-z="0"><h1 id="command-git-status-your-dashboard">Command: git status (your dashboard)</h1><pre class="highlight code bash">git<span class="w"> </span>status</pre><p>Shows:</p><ul><li>current branch</li><li>staged vs unstaged changes</li><li>untracked files</li></ul></div><div class="step step-level-1" step="14" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="22400" data-y="0" data-z="0"><h1 id="command-git-add-select-files">Command: git add (select files)</h1><p>Stage files for the next commit.</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>index.html<span class="w">
|
</span>git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>user.email<span class="w"> </span><span class="s2">"you@example.com"</span></pre><p>Check:</p><pre class="highlight code bash">git<span class="w"> </span>config<span class="w"> </span>--global<span class="w"> </span>--list</pre><div class="notes"><p>This shows up in commit metadata (provenance).</p></div></div><div class="step step-level-1" step="9" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="14400" data-y="0" data-z="0"><h1 id="core-concept-three-areas">Core concept: three areas</h1><ol><li>Working tree: your files right now</li><li>Staging area (index): selection for the next deposit</li><li>Repository history: commits (deposits)</li></ol><p>This is why Git feels "archival":</p><ul><li>you intentionally select what becomes part of the record.</li></ul></div><div class="step step-level-1" step="10" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="16000" data-y="0" data-z="0"><h1 id="commands-the-essential-set">Commands: the essential set</h1><ul><li>git status (always)</li><li>git init (initalise a repo)</li><li>git commit (store changes in the repo)</li><li>git add (add files to the commit)</li><li>git branch (take a detour)</li><li>git merge (merge branches)</li><li>git checkout (get the repo at a specific state)</li><li>git fetch (sync with a repo online)</li><li>git pull (sync with a repo online and merge)</li><li>git diff (what changed)</li><li>git log (history)</li><li>plus: log, diff</li></ul></div><div class="step step-level-1" step="11" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="17600" data-y="0" data-z="0"><h1 id="command-git-init">Command: git init</h1><p>Create a repository in the current folder.
|
||||||
</span>git<span class="w"> </span>add<span class="w"> </span>assets/</pre><p>Stage everything (use carefully):</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>.</pre><div class="notes"><p>Staging is curatorial: select what belongs together.</p></div></div><div class="step step-level-1" step="15" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="24000" data-y="0" data-z="0"><h1 id="command-git-commit">Command: git commit</h1><pre class="highlight code bash">git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Added name to my page"</span></pre><p>Good commit message pattern:</p><ul><li>What changed</li><li>Why it changed (reason/intent)</li><li>Scope stays small</li></ul></div><div class="step step-level-1" step="16" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="25600" data-y="0" data-z="0"><h1 id="command-git-diff-what-changed">Command: git diff (what changed)</h1><p>Unstaged changes:</p><pre class="highlight code bash">git<span class="w"> </span>diff</pre><p>Staged changes:</p><pre class="highlight code bash">git<span class="w"> </span>diff<span class="w"> </span>--staged</pre></div><div class="step step-level-1" step="17" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="27200" data-y="0" data-z="0"><h1 id="command-git-log-inventory">Command: git log (inventory)</h1><pre class="highlight code bash">git<span class="w"> </span>log<span class="w"> </span>--oneline<span class="w"> </span>--graph</pre><p>Gives a quick "finding aid" of earlier commits. Press 'q' to exit.</p></div><div class="step step-level-1" step="18" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="28800" data-y="0" data-z="0"><h1 id="command-git-branch-and-git-checkout">Command: git branch and git checkout</h1><p>List branches:</p><pre class="highlight code bash">git<span class="w"> </span>branch</pre><p>Create a branch:</p><pre class="highlight code bash">git<span class="w"> </span>branch<span class="w"> </span>people/yourname</pre><p>Switch to branch:</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>people/yourname</pre><p>Shortcut (create + switch):</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>-b<span class="w"> </span>people/yourname</pre><div class="notes"><p>Branches are parallel dossiers: safe space for changes.</p></div></div><div class="step step-level-1" step="19" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="30400" data-y="0" data-z="0"><h1 id="command-git-push-git-pull">Command: git push / git pull</h1><p>Push your branch to the server:</p><pre class="highlight code bash">git<span class="w"> </span>push<span class="w"> </span>-u<span class="w"> </span>origin<span class="w"> </span>people/yourname</pre><p>Pull updates from server:</p><pre class="highlight code bash">git<span class="w"> </span>pull</pre><div class="notes"><p>During the exercise you mostly push your branch.
|
Use this when you are creating and working on your own projects.</p><pre class="highlight code bash">git<span class="w"> </span>init</pre><p>Creates a .git/ directory containing history + metadata.</p><div class="notes"><p>For the exercise we will use git clone instead of git init.</p></div></div><div class="step step-level-1" step="12" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="19200" data-y="0" data-z="0"><h1 id="command-git-clone">Command: git clone</h1><p>Cloen (copy) a repository in the current folder.</p><pre class="highlight code bash">git<span class="w"> </span>clone<span class="w"> </span>https://git.hackersanddesigners.nl/hrk/braids<span class="w"> </span><destination></pre><p>Downloads a repo from the web, complete with the full commit history and all changes.</p></div><div class="step step-level-1" step="13" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="20800" data-y="0" data-z="0"><h1 id="command-git-status-your-dashboard">Command: git status (your dashboard)</h1><pre class="highlight code bash">git<span class="w"> </span>status</pre><p>Shows:</p><ul><li>current branch</li><li>staged vs unstaged changes</li><li>untracked files</li></ul></div><div class="step step-level-1" step="14" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="22400" data-y="0" data-z="0"><h1 id="command-git-add-select-files">Command: git add (select files)</h1><p>Stage files for the next commit.</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>index.html<span class="w">
|
||||||
Pull is mainly for getting new changes on main (if needed).</p></div></div><div class="step step-level-1" step="20" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="32000" data-y="0" data-z="0"><h1 id="optional-git-rm">Optional: git rm</h1><p>Remove a tracked file and stage the removal:</p><pre class="highlight code bash">git<span class="w"> </span>rm<span class="w"> </span>old.html<span class="w">
|
</span>git<span class="w"> </span>add<span class="w"> </span>assets/</pre><p>Stage everything (use carefully):</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>.</pre><div class="notes"><p>Staging is curatorial: select what belongs together.</p></div></div><div class="step step-level-1" step="15" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="24000" data-y="0" data-z="0"><h1 id="command-git-commit">Command: git commit</h1><pre class="highlight code bash">git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Added name to my page"</span></pre><p>Good commit message pattern:</p><ul><li>What changed</li><li>Why it changed (reason/intent)</li><li>Scope stays small</li></ul><h1 id="command-git-log-inventory">Command: git log (inventory)</h1><pre class="highlight code bash">git<span class="w"> </span>log<span class="w"> </span>--oneline<span class="w"> </span>--graph</pre><p>Gives a quick "finding aid" of earlier commits. Press 'q' to exit.</p></div><div class="step step-level-1" step="16" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="25600" data-y="0" data-z="0"><h1 id="command-git-branch-and-git-checkout">Command: git branch and git checkout</h1><p>List branches:</p><pre class="highlight code bash">git<span class="w"> </span>branch</pre><p>Create a branch:</p><pre class="highlight code bash">git<span class="w"> </span>branch<span class="w"> </span>people/yourname</pre><p>Switch to branch:</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>people/yourname</pre><p>Shortcut (create + switch):</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>-b<span class="w"> </span>people/yourname</pre><div class="notes"><p>Branches are parallel dossiers: safe space for changes.</p></div></div><div class="step step-level-1" step="17" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="27200" data-y="0" data-z="0"><h1 id="command-git-push-git-pull">Command: git push / git pull</h1><p>Push your branch to the server:</p><pre class="highlight code bash">git<span class="w"> </span>push<span class="w"> </span>-u<span class="w"> </span>origin<span class="w"> </span>people/yourname</pre><p>Pull updates from server:</p><pre class="highlight code bash">git<span class="w"> </span>pull</pre><div class="notes"><p>During the exercise you mostly push your branch.
|
||||||
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Remove old page"</span></pre><p>For this workshop you probably will not need it.</p></div><div class="step step-level-1" step="21" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="33600" data-y="0" data-z="0"><h1 id="forgejo-what-we-use-today">Forgejo: what we use today</h1><ul><li>Forgejo hosts the central repository (remote)</li><li>You will:
|
Pull is mainly for getting new changes on main (if needed).</p></div></div><div class="step step-level-1" step="18" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="28800" data-y="0" data-z="0"><h1 id="optional-git-rm">Optional: git rm</h1><p>Remove a tracked file and stage the removal:</p><pre class="highlight code bash">git<span class="w"> </span>rm<span class="w"> </span>old.html<span class="w">
|
||||||
|
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Remove old page"</span></pre><p>For this workshop you probably will not need it.</p></div><div class="step step-level-1" step="19" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="30400" data-y="0" data-z="0"><h1 id="forgejo-what-we-use-today">Forgejo: what we use today</h1><ul><li>Forgejo hosts the central repository (remote)</li><li>You will:
|
||||||
- create an account
|
- create an account
|
||||||
- clone via HTTPS/SSH
|
- clone via HTTPS
|
||||||
- push your branch</li></ul><p>Rules for today:</p><ul><li>do NOT push to main</li><li>create your branch under people/<slug></li></ul></div><div class="step step-level-1" step="22" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="35200" data-y="0" data-z="0"><h1 id="forgejo-account-setup">Forgejo: account setup</h1><ol><li>Create account at: git.<your-domain></li><li>Confirm you can sign in</li><li>Add SSH key (optional) OR use HTTPS credentials</li></ol><p>We will provide:</p><ul><li>repo URL</li><li>branch naming convention</li><li>live gallery URL: braids.<your-domain></li></ul></div><div class="step step-level-1" step="23" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="36800" data-y="0" data-z="0"><h1 id="exercise-overview">Exercise overview</h1><p>You will build a deliberately simple “MySpace-style” page:</p><ul><li>"Hi, I'm …"</li><li>one gif</li><li>one link</li><li>optional: background, glitter, bad taste encouraged</li></ul><p>Workflow loop:</p><p>clone -> branch -> edit -> status -> add -> commit -> push -> view -> iterate</p></div><div class="step step-level-1" step="24" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="38400" data-y="0" data-z="0"><h1 id="exercise-step-1-clone">Exercise: step 1 (clone)</h1><pre class="highlight code bash">git<span class="w"> </span>clone<span class="w"> </span><REPO_URL><span class="w">
|
- push your branch</li></ul><p>Share your username with us so we can add you as a collaborator</p><p>Rules for today:</p><ul><li>do NOT push to main</li><li>create your branch under people/<slug></li></ul></div><div class="step step-level-1" step="20" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="32000" data-y="0" data-z="0"><h1 id="forgejo-account-setup">Forgejo: account setup</h1><ol><li>Create account at: git.hackersanddesigners.nl</li><li>Confirm you can sign in</li></ol><p>We will provide:</p><ul><li><a href="https://git.hackersanddesigners.nl/hrk/braids">https://git.hackersanddesigners.nl/hrk/braids</a></li><li>branch naming convention</li><li>live gallery URL: braids.hackersanddesigners.nl</li></ul></div><div class="step step-level-1" step="21" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="33600" data-y="0" data-z="0"><h1 id="exercise-overview">Exercise overview</h1><p>You will build a (deliberately) simple page:</p><ul><li>"Hi, I'm …"</li><li>maybe a gif?</li><li>a link?</li><li>optional: background, glitter, bad taste encouraged</li></ul><p>Workflow loop:</p><p>clone -> branch -> edit -> status -> add -> commit -> push -> view -> iterate</p></div><div class="step step-level-1" step="22" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="35200" data-y="0" data-z="0"><h1 id="exercise-step-1-clone">Exercise: step 1 (clone)</h1><p>cd to a logical location in your computer, then:</p><pre class="highlight code bash">git<span class="w"> </span>clone<span class="w"> </span>https://git.hackersanddesigners.nl/hrk/braids<span class="w">
|
||||||
</span><span class="nb">cd</span><span class="w"> </span><REPO_NAME></pre><p>Sanity check:</p><pre class="highlight code bash">git<span class="w"> </span>status<span class="w">
|
</span><span class="nb">cd</span><span class="w"> </span>braids</pre><p>If everything went well, check the repo with:</p><pre class="highlight code bash">git<span class="w"> </span>status<span class="w">
|
||||||
</span>git<span class="w"> </span>branch</pre></div><div class="step step-level-1" step="25" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="40000" data-y="0" data-z="0"><h1 id="exercise-step-2-create-your-branch">Exercise: step 2 (create your branch)</h1><p>Choose a slug: lowercase, no spaces. Example: people/alex.</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>-b<span class="w"> </span>people/<your-slug></pre><p>Confirm:</p><pre class="highlight code bash">git<span class="w"> </span>status</pre></div><div class="step step-level-1" step="26" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="41600" data-y="0" data-z="0"><h1 id="exercise-step-3-edit-the-page">Exercise: step 3 (edit the page)</h1><p>Edit the root index.html (and optionally style.css, assets/).</p><p>Make a visible change first:</p><ul><li>your name</li><li>one gif</li><li>one link</li></ul><p>Then check changes:</p><pre class="highlight code bash">git<span class="w"> </span>diff<span class="w">
|
</span>git<span class="w"> </span>branch</pre></div><div class="step step-level-1" step="23" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="36800" data-y="0" data-z="0"><h1 id="exercise-step-2-create-your-branch">Exercise: step 2 (create your branch)</h1><p>Choose a slug: lowercase, no spaces. This can be your name or an alias. Example: change people/<your-slug> in the command below to people/alex.</p><pre class="highlight code bash">git<span class="w"> </span>checkout<span class="w"> </span>-b<span class="w"> </span>people/<your-slug></pre><p>Confirm:</p><pre class="highlight code bash">git<span class="w"> </span>status</pre></div><div class="step step-level-1" step="24" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="38400" data-y="0" data-z="0"><h1 id="exercise-step-3-edit-the-page">Exercise: step 3 (edit the page)</h1><p>Edit the root index.html (and optionally style.css, assets/).</p><p>Make a visible change first:</p><ul><li>Change the name to your name (or your alias)</li></ul><p>Then check changes:</p><pre class="highlight code bash">git<span class="w"> </span>diff<span class="w">
|
||||||
</span>git<span class="w"> </span>status</pre></div><div class="step step-level-1" step="27" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="43200" data-y="0" data-z="0"><h1 id="exercise-step-4-stage-commit">Exercise: step 4 (stage + commit)</h1><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>index.html<span class="w">
|
</span>git<span class="w"> </span>status</pre></div><div class="step step-level-1" step="25" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="40000" data-y="0" data-z="0"><h1 id="exercise-step-4-stage-commit">Exercise: step 4 (stage + commit)</h1><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>index.html<span class="w">
|
||||||
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Customize profile page for <your-slug>"</span></pre><p>If you added assets:</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>assets/<span class="w">
|
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Customize profile page for <your-slug>"</span></pre><p>If you added assets:</p><pre class="highlight code bash">git<span class="w"> </span>add<span class="w"> </span>assets/<span class="w">
|
||||||
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Add assets for <your-slug>"</span></pre><div class="notes"><p>Small commits win. One change = one deposit.</p></div></div><div class="step step-level-1" step="28" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="44800" data-y="0" data-z="0"><h1 id="exercise-step-5-push-your-branch">Exercise: step 5 (push your branch)</h1><pre class="highlight code bash">git<span class="w"> </span>push<span class="w"> </span>-u<span class="w"> </span>origin<span class="w"> </span>people/<your-slug></pre><p>If prompted for credentials, use your Forgejo login method.</p></div><div class="step step-level-1" step="29" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="46400" data-y="0" data-z="0"><h1 id="exercise-step-6-view-live">Exercise: step 6 (view live)</h1><p>Open the gallery:</p><ul><li>https://braids.<your-domain>/</li></ul><p>Find your card:</p><ul><li>people/<your-slug>/</li></ul><p>Iterate:</p><p>edit -> status -> add -> commit -> push -> refresh</p></div><div class="step step-level-1" step="30" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="48000" data-y="0" data-z="0"><h1 id="common-problems-fast-fixes">Common problems (fast fixes)</h1><p>Wrong branch:</p><pre class="highlight code bash">git<span class="w"> </span>branch<span class="w">
|
</span>git<span class="w"> </span>commit<span class="w"> </span>-m<span class="w"> </span><span class="s2">"Add assets for <your-slug>"</span></pre><div class="notes"><p>Small commits win. One change = one deposit.</p></div></div><div class="step step-level-1" step="26" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="41600" data-y="0" data-z="0"><h1 id="exercise-step-5-push-your-branch">Exercise: step 5 (push your branch)</h1><pre class="highlight code bash">git<span class="w"> </span>push<span class="w"> </span>-u<span class="w"> </span>origin<span class="w"> </span>people/<your-slug></pre><p>(Again, change <your-slug>!)</p><p>If prompted for credentials, use your Forgejo login method.</p></div><div class="step step-level-1" step="27" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="43200" data-y="0" data-z="0"><h1 id="exercise-step-6-view-live">Exercise: step 6 (view live)</h1><p>Open the gallery:</p><ul><li>https://braids.hackersanddesigners.nl/</li></ul><p>Find your card:</p><ul><li>people/<your-slug>/</li></ul><p>Iterate:</p><p>edit -> status -> add -> commit -> push -> refresh</p></div><div class="step step-level-1" step="28" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="44800" data-y="0" data-z="0"><h1 id="common-problems-fast-fixes">Common problems (fast fixes)</h1><p>Wrong branch:</p><pre class="highlight code bash">git<span class="w"> </span>branch<span class="w">
|
||||||
</span>git<span class="w"> </span>checkout<span class="w"> </span>people/<your-slug></pre><p>Nothing staged:</p><pre class="highlight code bash">git<span class="w"> </span>status<span class="w">
|
</span>git<span class="w"> </span>checkout<span class="w"> </span>people/<your-slug></pre><p>Nothing staged:</p><pre class="highlight code bash">git<span class="w"> </span>status<span class="w">
|
||||||
</span>git<span class="w"> </span>add<span class="w"> </span>index.html</pre><p>Push rejected (main protected):</p><ul><li>You are on main. Switch to your branch.</li></ul><p>Auth issues:</p><ul><li>HTTPS: check username/token/password</li><li>SSH: check key added to Forgejo + ssh -T</li></ul></div><div class="step step-level-1" step="31" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="49600" data-y="0" data-z="0"><h1 id="concept-recap-in-archiving-terms">Concept recap in archiving terms</h1><ul><li>commit = deposit (with minimal metadata)</li><li>log = inventory / chain of custody</li><li>diff = conservation report (what changed)</li><li>branch = parallel dossier</li><li>push = deposit to institutional archive (remote)</li></ul></div><div class="step step-level-1" step="32" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="51200" data-y="0" data-z="0"><h1 id="suggested-good-enough-commit-messages">Suggested “good enough” commit messages</h1><p>Bad:</p><ul><li>"update"</li><li>"stuff"</li><li>"changes"</li></ul><p>Better:</p><ul><li>"Add animated gif and profile link"</li><li>"Change background and typography"</li><li>"Fix broken image path"</li><li>"Refactor layout: move link block above gif"</li></ul><p>Rule: message should still make sense in 6 months.</p></div><div class="step step-level-1" step="33" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="52800" data-y="0" data-z="0"><h1 id="optional-extension-if-time-remains">Optional extension (if time remains)</h1><ul><li>Compare two branches visually (gallery view)</li><li>Add a second commit that intentionally breaks something,
|
</span>git<span class="w"> </span>add<span class="w"> </span>index.html</pre><p>Push rejected (main protected):</p><ul><li>You are on main. Switch to your branch.</li></ul><p>Auth issues:</p><ul><li>HTTPS: check username/password</li></ul></div><div class="step step-level-1" step="29" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="46400" data-y="0" data-z="0"><h1 id="concept-recap-in-archiving-terms">Concept recap in archiving terms</h1><ul><li>commit = deposit (with minimal metadata)</li><li>log = inventory / chain of custody</li><li>diff = conservation report (what changed)</li><li>branch = parallel dossier</li><li>push = share publicly / deposit to institutional archive (remote)</li></ul></div><div class="step step-level-1" step="30" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="48000" data-y="0" data-z="0"><h1 id="suggested-good-enough-commit-messages">Suggested “good enough” commit messages</h1><p>Bad:</p><ul><li>"update"</li><li>"stuff"</li><li>"changes"</li></ul><p>Better:</p><ul><li>"Add animated gif and profile link"</li><li>"Change background and typography"</li><li>"Fix broken image path"</li></ul><p>Rule: message should still make sense in 6 months.</p></div><div class="step step-level-1" step="31" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="49600" data-y="0" data-z="0"><h1 id="optional-extension-if-time-remains">Optional extension (if time remains)</h1><ul><li>Compare two branches visually (gallery view)</li><li>Add a second commit that intentionally breaks something,
|
||||||
then fix it with a third commit</li><li>Show git log to narrate your work as a documented process</li></ul></div><div class="step step-level-1" step="34" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="54400" data-y="0" data-z="0"><h1 id="wrap-up">Wrap-up</h1><p>You should now be able to:</p><ul><li>create a branch safely</li><li>record changes as commits</li><li>publish to a remote</li><li>read history and differences</li></ul><p>Next steps:</p><ul><li>merging via PRs (review workflow)</li><li>tags/releases (archival milestones)</li><li>basic collaboration patterns (feature branches)</li></ul><div class="notes"><p>End: remind participants their branches will be removed after the workshop.</p></div></div></div><script type="text/javascript" src="js/impress.js"></script><script type="text/javascript" src="js/gotoSlide.js"></script><script type="text/javascript" src="js/hovercraft.js"></script></body></html>
|
then fix it with a third commit</li><li>Show git log to narrate your work as a documented process</li></ul></div><div class="step step-level-1" step="32" data-rotate-x="0" data-rotate-y="0" data-rotate-z="0" data-scale="1" data-x="51200" data-y="0" data-z="0"><h1 id="wrap-up">Wrap-up</h1><p>You should now be able to:</p><ul><li>create a branch safely</li><li>record changes as commits</li><li>publish to a remote</li><li>read history and differences</li></ul><p>Learn more:</p><ul><li><a href="https://learngitbranching.js.org/">Learn Git Branching</a></li><li><a href="https://ohmygit.org/">Oh My Git</a></li></ul><div class="notes"><p>End: remind participants their branches will be removed after the workshop.</p></div></div></div><script type="text/javascript" src="js/impress.js"></script><script type="text/javascript" src="js/gotoSlide.js"></script><script type="text/javascript" src="js/hovercraft.js"></script></body></html>
|
||||||
53
slides.rst
53
slides.rst
|
|
@ -170,6 +170,7 @@ Command: git init
|
||||||
=================
|
=================
|
||||||
|
|
||||||
Create a repository in the current folder.
|
Create a repository in the current folder.
|
||||||
|
Use this when you are creating and working on your own projects.
|
||||||
|
|
||||||
.. code-block:: bash
|
.. code-block:: bash
|
||||||
|
|
||||||
|
|
@ -191,7 +192,7 @@ Cloen (copy) a repository in the current folder.
|
||||||
|
|
||||||
.. code-block:: bash
|
.. code-block:: bash
|
||||||
|
|
||||||
git clone <repo_url> <destination>
|
git clone https://git.hackersanddesigners.nl/hrk/braids <destination>
|
||||||
|
|
||||||
Downloads a repo from the web, complete with the full commit history and all changes.
|
Downloads a repo from the web, complete with the full commit history and all changes.
|
||||||
|
|
||||||
|
|
@ -247,24 +248,25 @@ Good commit message pattern:
|
||||||
- Why it changed (reason/intent)
|
- Why it changed (reason/intent)
|
||||||
- Scope stays small
|
- Scope stays small
|
||||||
|
|
||||||
----
|
..
|
||||||
|
----
|
||||||
|
|
||||||
Command: git diff (what changed)
|
Command: git diff (what changed)
|
||||||
================================
|
================================
|
||||||
|
|
||||||
Unstaged changes:
|
Unstaged changes:
|
||||||
|
|
||||||
.. code-block:: bash
|
.. code-block:: bash
|
||||||
|
|
||||||
git diff
|
git diff
|
||||||
|
|
||||||
Staged changes:
|
Staged changes:
|
||||||
|
|
||||||
.. code-block:: bash
|
.. code-block:: bash
|
||||||
|
|
||||||
git diff --staged
|
git diff --staged
|
||||||
|
|
||||||
----
|
----
|
||||||
|
|
||||||
Command: git log (inventory)
|
Command: git log (inventory)
|
||||||
============================
|
============================
|
||||||
|
|
@ -352,9 +354,11 @@ Forgejo: what we use today
|
||||||
- Forgejo hosts the central repository (remote)
|
- Forgejo hosts the central repository (remote)
|
||||||
- You will:
|
- You will:
|
||||||
- create an account
|
- create an account
|
||||||
- clone via HTTPS/SSH
|
- clone via HTTPS
|
||||||
- push your branch
|
- push your branch
|
||||||
|
|
||||||
|
Share your username with us so we can add you as a collaborator
|
||||||
|
|
||||||
Rules for today:
|
Rules for today:
|
||||||
|
|
||||||
- do NOT push to `main`
|
- do NOT push to `main`
|
||||||
|
|
@ -367,11 +371,10 @@ Forgejo: account setup
|
||||||
|
|
||||||
1. Create account at: `git.hackersanddesigners.nl`
|
1. Create account at: `git.hackersanddesigners.nl`
|
||||||
2. Confirm you can sign in
|
2. Confirm you can sign in
|
||||||
3. Add SSH key (optional) OR use HTTPS credentials
|
|
||||||
|
|
||||||
We will provide:
|
We will provide:
|
||||||
|
|
||||||
- repo URL
|
- https://git.hackersanddesigners.nl/hrk/braids
|
||||||
- branch naming convention
|
- branch naming convention
|
||||||
- live gallery URL: `braids.hackersanddesigners.nl`
|
- live gallery URL: `braids.hackersanddesigners.nl`
|
||||||
|
|
||||||
|
|
@ -380,11 +383,11 @@ We will provide:
|
||||||
Exercise overview
|
Exercise overview
|
||||||
=================
|
=================
|
||||||
|
|
||||||
You will build a deliberately simple “MySpace-style” page:
|
You will build a (deliberately) simple page:
|
||||||
|
|
||||||
- "Hi, I'm …"
|
- "Hi, I'm …"
|
||||||
- one gif
|
- maybe a gif?
|
||||||
- one link
|
- a link?
|
||||||
- optional: background, glitter, bad taste encouraged
|
- optional: background, glitter, bad taste encouraged
|
||||||
|
|
||||||
Workflow loop:
|
Workflow loop:
|
||||||
|
|
@ -396,12 +399,14 @@ clone -> branch -> edit -> status -> add -> commit -> push -> view -> iterate
|
||||||
Exercise: step 1 (clone)
|
Exercise: step 1 (clone)
|
||||||
========================
|
========================
|
||||||
|
|
||||||
|
`cd` to a logical location in your computer, then:
|
||||||
|
|
||||||
.. code-block:: bash
|
.. code-block:: bash
|
||||||
|
|
||||||
git clone <REPO_URL>
|
git clone https://git.hackersanddesigners.nl/hrk/braids
|
||||||
cd <REPO_NAME>
|
cd braids
|
||||||
|
|
||||||
Sanity check:
|
If everything went well, check the repo with:
|
||||||
|
|
||||||
.. code-block:: bash
|
.. code-block:: bash
|
||||||
|
|
||||||
|
|
@ -413,7 +418,7 @@ Sanity check:
|
||||||
Exercise: step 2 (create your branch)
|
Exercise: step 2 (create your branch)
|
||||||
=====================================
|
=====================================
|
||||||
|
|
||||||
Choose a slug: lowercase, no spaces. Example: `people/alex`.
|
Choose a slug: lowercase, no spaces. This can be your name or an alias. Example: change `people/<your-slug>` in the command below to `people/alex`.
|
||||||
|
|
||||||
.. code-block:: bash
|
.. code-block:: bash
|
||||||
|
|
||||||
|
|
@ -434,9 +439,7 @@ Edit the root `index.html` (and optionally `style.css`, `assets/`).
|
||||||
|
|
||||||
Make a visible change first:
|
Make a visible change first:
|
||||||
|
|
||||||
- your name
|
- Change the name to your name (or your alias)
|
||||||
- one gif
|
|
||||||
- one link
|
|
||||||
|
|
||||||
Then check changes:
|
Then check changes:
|
||||||
|
|
||||||
|
|
@ -475,6 +478,8 @@ Exercise: step 5 (push your branch)
|
||||||
|
|
||||||
git push -u origin people/<your-slug>
|
git push -u origin people/<your-slug>
|
||||||
|
|
||||||
|
(Again, change <your-slug>!)
|
||||||
|
|
||||||
If prompted for credentials, use your Forgejo login method.
|
If prompted for credentials, use your Forgejo login method.
|
||||||
|
|
||||||
----
|
----
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue