# Git in GitHub Desktop

Clonen, committen, pushen en pullen met de app van GitHub zelf. Dezelfde Git als in Git basics, in één venster.

Multimedia & Creatieve Technologie · 2.1 Programming principles · Extra · Git · versie 1.0.1 · 2026-09-30

Tags: git, github

Slides: <https://slides.mctantwerp.be/nl/programming-principles/git-in-github-desktop>

Speaker notes: <https://slides.mctantwerp.be/nl/programming-principles/git-in-github-desktop.notes.md>

<!-- slide 2 -->

## Agenda

1. Opzetten: Aanmelden en een repo binnenhalen
2. Committen: Vinkjes, summary, undo en history
3. Push en pull: De knop rechtsboven
4. Merge conflicts: Oplossen in je editor, afwerken in Desktop

<!-- slide 3 -->

**Een app, geen andere Git.**

GitHub Desktop doet niets wat je in Git basics niet in de terminal deed. Het verschil met VS Code: je ziet je hele repo in één venster, maar je schrijft er geen code in.

<!-- slide 4 -->

## 1. Opzetten

*Eén keer aanmelden, dan elke repo in een paar klikken.*

<!-- slide 5 -->

### Installeren en aanmelden

- **[01 Downloaden](https://github.com/apps/desktop)**: github.com/apps/desktop, voor macOS en Windows.
- **02 Aanmelden**: Met je GitHub-account. Zo ziet Desktop je repos en mag hij pushen.
- **03 Naam en e-mail**: Settings, Git. Dezelfde als in je `git config`, anders tellen je commits niet mee op je profiel.

> [!NOTE]
> Desktop brengt zijn eigen Git mee. De Git in je terminal heb je voor de lessen toch nodig, dus installeer die ook.

<!-- slide 6 -->

### Een repo binnenhalen

*Via het menu File*

| In Desktop | Wat Git doet | Wanneer |
| --- | --- | --- |
| Clone repository | `git clone` | De repo staat al op GitHub. Kies hem uit de lijst of plak de URL |
| Add local repository | niets | De map is al een repo op je laptop, Desktop moet hem alleen leren kennen |
| New repository | `git init` en een eerste commit | Een nieuw project. Daarna Publish repository om het op GitHub te zetten |

<!-- slide 7 -->

### Het venster

*Bovenaan: welke repo, welke branch, en de knop die met origin praat*

<!-- slide 8 -->

## 2. Committen

*Aanvinken wat mee moet, een boodschap, klaar.*

<!-- slide 9 -->

### Het vinkje is stagen

- Aangevinkt is `git add`. Uitgevinkt blijft staan, maar gaat niet mee in de commit
- Een staging area zie je niet, het vinkje doet dat werk
- Per regel kan ook: klik in de diff op de regelnummers die je niet wil meenemen
- Het icoontje rechts zegt wat er gebeurde: • aangepast, + nieuw, − verwijderd

<!-- slide 10 -->

### Committen

*Linksonder, onder de lijst met bestanden*

#### De commit

- Summary is je commit message, en is verplicht. Dit is `git commit -m`
- Description is optioneel, voor wat niet in één regel past
- Commit to main maakt de commit. Alleen lokaal, GitHub weet nog van niets

#### Toch niet goed?

- Na een commit verschijnt onderaan een knop Undo
- Die haalt de laatste commit terug, je wijzigingen blijven staan
- Alleen zolang je niet gepusht hebt. Daarna is het revert, zie verder

<!-- slide 11 -->

### Rechtsklik op een bestand

*Drie keuzes die je vaker nodig hebt dan je denkt*

- **Discard changes**: Een aangepast bestand gaat terug naar de laatste commit, een nieuw bestand wordt verwijderd. Geen undo.
- **Ignore file**: Zet het bestand in `.gitignore`. Voor renders, exports, node_modules en die video van 2 GB.
- **Open in editor**: Opent het bestand in VS Code of de editor die je koos bij Settings, Integrations.

<!-- slide 12 -->

### History

- Elke commit, nieuwste bovenaan. Dit is `git log`
- Klik op een commit en je ziet welke bestanden hij aanraakte, en hoe
- Het pijltje omhoog: nog niet gepusht
- Rechtsklik, Revert changes in commit maakt een nieuwe commit die het ongedaan maakt. Dat is `git revert`, en dat mag ook na een push

<!-- slide 13 -->

## 3. Push en pull

*Eén knop rechtsboven, die van naam verandert.*

<!-- slide 14 -->

### De knop rechtsboven

| Knop | Wat Git doet |
| --- | --- |
| Fetch origin | `git fetch`: kijkt of origin iets nieuws heeft, en telt het |
| Pull origin ↓ | `git pull`: haalt die commits binnen en merget ze |
| Push origin ↑ | `git push`: jouw commits naar GitHub |
| Publish repository | De eerste `git push` van een repo die nog niet op GitHub staat |

<!-- slide 15 -->

**Fetch is geen pull.**

Fetch kijkt alleen. Je bestanden veranderen pas als je daarna op Pull origin klikt. Hebben jullie allebei gecommit, dan moet je eerst pullen voor je kan pushen, net als in de terminal.

<!-- slide 16 -->

## 4. Merge conflicts

*Desktop toont waar het knelt. Oplossen doe je in je editor.*

<!-- slide 17 -->

### Conflicten oplossen

*Pull origin, en jij en Alex speelden hetzelfde vakje*

- Open het bestand in je editor. Kies tussen de conflict markers en haal ze weg
- Bewaar. Desktop ziet zelf dat er geen markers meer in zitten
- Continue merge maakt de merge commit. Daarna Push origin

<!-- slide 18 -->

### Kiezen zonder editor

*Het pijltje naast Open in Visual Studio Code*

- **Use the modified file from main**: Jouw versie van het hele bestand wint. Alles wat van origin kwam, verdwijnt eruit.
- **Use the modified file from origin/main**: De versie van origin wint. Jouw wijzigingen in dat bestand verdwijnen.

> [!WARNING]
> Dat kiest per bestand, niet per regel. Voor een tekstbestand met twee conflicten ben je beter af in je editor. Hoe dat daar gaat, staat in [Git in VS Code](/nl/programming-principles/git-in-vscode).

<!-- slide 19 -->

### Desktop of VS Code

*Allebei prima. Ze gebruiken dezelfde repo, dus je kan wisselen.*

#### GitHub Desktop

- Je werkt aan iets dat geen code is: design, video, documentatie
- Je wil een rustig overzicht van je history
- Conflicten los je toch in een editor op

#### VS Code

- Je schrijft code en wil niet van venster wisselen
- Stagen per regel en conflicten oplossen zitten in dezelfde editor
- Minder overzicht over de hele history

<!-- slide 20 -->

### Opdracht: Tic tac toe in GitHub Desktop

*20 minuten, Per 2*

Dezelfde opdracht als in Git basics, nu zonder terminal.

1. Clone je tic-tac-toe repo met File, Clone repository
2. Speel een ronde met alleen Commit, Fetch, Pull en Push origin
3. Pak allebei hetzelfde vakje zonder te fetchen, en los het conflict op
4. Bekijk het resultaat in History en zoek de merge commit

## Begrippen

- **git fetch**: Kijkt of origin commits heeft die jij nog niet hebt, en telt ze. Je bestanden veranderen pas bij een pull. In GitHub Desktop is dat de knop Fetch origin. (slide 14)

## Links en bronnen

### In de presentatie

- [Downloaden](https://github.com/apps/desktop) (slide 5)
