Skip to main content

GIT en GITHUB

1 – Wat is versiecontrole?

🎯 Leerdoelen

  • Je begrijpt wat versiecontrole is en waarom het essentieel is bij softwareontwikkeling.
  • Je kunt een eenvoudig project opslaan in verschillende versies met Git.
  • Je kunt teruggaan naar een vorige versie van je project.
  • Je werkt samen in duo’s om de voordelen van versiecontrole te ontdekken.

💡 Uitleg

Stel: je werkt aan een Python-project en maakt elke dag kleine aanpassingen. Zonder versiecontrole heb je al snel tientallen bestanden, zoals versie_definitief_v3.2_echt_laatste.py. Wat als je collega per ongeluk iets verwijdert, of jijzelf iets overschrijft? Met versiecontrole kun je elk moment terug in de tijd — alsof je een tijdmachine voor je code hebt.

Versiecontrole betekent dat elke wijziging aan je project wordt opgeslagen, samen met de datum, auteur en beschrijving van de wijziging. Zo kun je altijd zien wie wat heeft gedaan, en kun je vorige versies herstellen.

Git: jouw lokale tijdmachine

Met Git wordt versiecontrole automatisch geregeld. Git bewaart ‘snapshots’ van je project, ook wel commits genoemd. Elke commit is een momentopname van de hele projectmap.

# Een nieuw Git-project starten
git init

# Bestanden toevoegen aan de versiecontrole
git add .

# Een nieuwe "snapshot" (commit) maken
git commit -m "Eerste versie van mijn programma"

# Aanpassingen maken in je code en een nieuwe commit maken
git commit -am "Functie toegevoegd voor berekeningen"

Teruggaan naar een eerdere versie

Je kunt met Git niet alleen zien wat je hebt veranderd, maar ook terugrollen naar een vorige versie van je project.

# Alle eerdere versies bekijken
git log

# Teruggaan naar een eerdere commit (tijdelijk)
git checkout commit_id

# Teruggaan naar de laatste versie (main branch)
git switch main

Zo kun je fouten herstellen zonder bestanden te verliezen. Dit maakt Git onmisbaar bij professioneel samenwerken aan software.

🧠 Voorbeeld

# versie 1
print("Hallo wereld!")

# versie 2
naam = input("Wat is je naam? ")
print("Hallo", naam)

# versie 3
print("Welkom terug,", naam, "! Hoe gaat het vandaag?")

Elke versie kun je committen, zodat je later terug kunt naar een eerdere staat, bijvoorbeeld naar de versie zonder invoerfunctie.

🛠️ Opdracht – Versiebeheer in actie (duo-opdracht)

  1. Werk in duo’s.
  2. Maak een nieuwe map op je computer, bijvoorbeeld git_oefening.
  3. Maak een eenvoudig Python-script groet.py en voeg het toe aan een Git-repository.
  4. Maak 3 commits waarin je het script uitbreidt met nieuwe functies (bijv. gebruikersinvoer, extra printregels).
  5. Gebruik git log om alle versies te bekijken.
  6. Kies een oudere commit en gebruik git checkout om tijdelijk terug te gaan in de tijd.
  7. Controleer in VS Code of de oude versie echt terug is gezet.
  8. Keer daarna terug naar de nieuwste versie met git switch main.

💬 Reflectie

  • Wat ging er mis toen jullie probeerden samen te werken zonder Git?
  • Wat vind je het grootste voordeel van kunnen teruggaan naar een vorige versie?
  • Hoe helpt versiecontrole om fouten sneller te herstellen?
  • Waarom denk je dat bedrijven nooit zonder versiecontrole werken?

📤 Inleveren

  • Lever één screenshot in waarop te zien is dat jullie 3 commits hebben gemaakt en dat je via git log de versies kunt zien.
  • Lever daarnaast een korte tekst in (reflectie-versiecontrole-<jouwnaam>.txt) waarin je beschrijft wat je geleerd hebt.
  • Noem beide namen van het duo in het reflectiebestand.

2 – Introductie tot Git in Visual Studio Code

🎯 Leerdoelen

  • Je weet hoe je Git kunt gebruiken binnen Visual Studio Code.
  • Je kunt wijzigingen vastleggen (committen) met een duidelijke beschrijving.
  • Je kunt eerdere versies bekijken via de Timeline of Source Control-tab.
  • Je leert samenwerken in duo’s aan één projectmap met gedeelde commits.

💡 Uitleg

In de vorige les heb je geleerd wat versiecontrole is en hoe Git veranderingen opslaat via de opdrachtregel. In deze les gaan we Git gebruiken via Visual Studio Code (VSC). VSC heeft Git standaard ingebouwd: je kunt commits maken, oude versies bekijken en zelfs terugrollen – allemaal met een paar klikken.

Stappenplan

  1. Open Visual Studio Code.
  2. Maak een nieuwe map aan, bijvoorbeeld vsc_git_demo.
  3. Klik op View → Source Control of op het icoon met het tak-symbool links in de zijbalk.
  4. Klik op Initialize Repository om Git aan te zetten in deze map.
    Source Control pane
  5. Maak een nieuw bestand, bijvoorbeeld app.py, en voeg onderstaande code toe.
# app.py - versie 1
print("Welkom bij Git in VS Code!")
  1. Sla het bestand op. In de Source Control-tab zie je nu dat er één wijziging is.
  2. Typ een commitbericht, bijvoorbeeld Eerste versie toegevoegd, en klik op ✔️ Commit.
  3. Pas het bestand aan:
# app.py - versie 2
naam = input("Wat is je naam? ")
print(f"Hallo {naam}, welkom bij Git in VS Code!")
  1. Commit opnieuw met een nieuw bericht, bijvoorbeeld Gebruikersinvoer toegevoegd.
  2. Herhaal dit proces nog één keer met een kleine aanpassing (bijv. een extra printregel).

Commits bekijken en terugrollen

Je kunt alle commits en hun verschillen bekijken via:

  • Source Control → View & History of via de Timeline-tab in de zijbalk.
  • Rechtsklik op een vorige commit en kies Checkout om tijdelijk terug te gaan.
# In terminal kan het ook:
git log              # toont alle commits
git checkout <commit_id>  # ga terug naar een vorige versie
git switch main      # terug naar de huidige versie

🛠️ Opdracht – Visual Git in actie (duo-opdracht)

  1. Werk in duo’s. Eén student maakt de repository aan, de ander bekijkt mee.
  2. Maak in Visual Studio Code een nieuw Python-bestand vsc_demo.py.
  3. Voeg samen drie versies van de code toe (drie commits):
  • v1 – print een begroeting;
  • v2 – voeg een gebruikersinvoer toe;
  • v3 – voeg een berekening of extra functie toe.
  • Gebruik telkens een duidelijk commitbericht (bijv. “Input toegevoegd”).
  • Gebruik de Timeline om de vorige versies te bekijken.
  • Ga terug naar een eerdere commit via Checkout en test of de oude versie wordt geladen.
  • Keer terug naar de nieuwste versie met Switch Branch → main.
  • 💬 Reflectie

    • Hoe helpt de visuele Git-interface in VS Code om overzicht te houden?
    • Wat vind je makkelijker: werken via de terminal of via de interface?
    • Welke informatie is nuttig in een goed commitbericht?
    • Hoe zou je dit proces gebruiken als je samenwerkt aan een groter project?

    📤 Inleveren

    • Lever een screenshot in van je Source Control-tab waarin minimaal drie commits zichtbaar zijn.
    • Lever ook een korte toelichting in (reflectie-vscode-git-<jouwnaam>.txt) waarin je beschrijft:
      • Wat je hebt geleerd;
      • Wat het verschil is tussen terminal en VSC-interface;
      • Hoe jullie als duo hebben samengewerkt.

    3 – Branches: experimenteren zonder risico

    🎯 Leerdoelen

    • Je begrijpt wat een branch is en waarom branches gebruikt worden.
    • Je kunt zelf een nieuwe branch maken in Visual Studio Code of via de terminal.
    • Je kunt branches samenvoegen (mergen) zonder gegevens te verliezen.
    • Je leert samenwerken in duo’s waarbij ieder aan een eigen branch werkt.

    💡 Uitleg

    In een softwareproject wil je vaak experimenteren zonder de hoofdversie te breken. Daarvoor gebruik je branches (vertakkingen). Elke branch is een eigen versie van de code waarop je onafhankelijk kunt werken.

    De hoofdversie heet meestal main of master. Je kunt een nieuwe branch maken (bijv. feature-login) om iets nieuws te proberen. Als het goed werkt, voeg je die branch later weer samen met de hoofdversie (dat heet mergen).

    Voorbeeld

    # Nieuwe branch aanmaken en erop overschakelen
    git checkout -b feature-login
    
    # Werken op deze branch
    git add .
    git commit -m "Loginfunctie toegevoegd"
    
    # Terug naar main
    git checkout main
    
    # Branch samenvoegen met main
    git merge feature-login
    

    In Visual Studio Code

    1. Open je project in VSC (bijv. vsc_git_demo van vorige les).
    2. Open de Source Control-tab en klik onderaan in de blauwe balk op main.
    3. Kies Create new branch en geef hem een naam, bijvoorbeeld feature-welkom.
    4. Maak nu in de nieuwe branch een kleine aanpassing in je code, bijvoorbeeld:
    # app.py - feature-welkom branch
    naam = input("Wat is je naam? ")
    print(f"Welkom {naam}, fijn dat je er bent!")
    1. Sla de wijziging op en commit met het bericht: Nieuwe welkomstboodschap toegevoegd.
    2. Ga terug naar de branch main via de blauwe balk onderaan.
    3. Klik op het tandwiel in de Source Control-tab → Merge Branch → kies feature-welkom.

    Je wijzigingen worden samengevoegd in de hoofdversie. Gefeliciteerd, je hebt je eerste merge uitgevoerd!

    🛠️ Opdracht – Branch en Merge (Duo)

    Situatie: jullie werken samen aan één project. Jij werkt aan de begroeting, je partner aan een nieuwe functie.

    1. Kies één laptop waarop het project van de vorige les staat.
    2. Maak samen een plan:
      • Student A werkt op branch feature-begroeting
      • Student B werkt op branch feature-berekening
    3. Beide studenten voegen hun eigen stuk code toe, bijvoorbeeld:
    # feature-begroeting
    print("Hallo, welkom terug bij ons programma!")
    
    # feature-berekening
    getal = int(input("Voer een getal in: "))
    print(f"Het kwadraat van {getal} is {getal ** 2}.")
    
    1. Beide branches worden apart gecommit.
    2. Vervolgens worden beide branches één voor één gemerged in main.
    3. Test of het gecombineerde programma werkt.
    4. Simuleer nu een fout:
      • Pas op beide branches print("Welkom!") tegelijk aan met een andere tekst.
      • Merge opnieuw → er ontstaat een merge conflict.
    5. Los het merge conflict op in Visual Studio Code:
      • Kies via “Accept Both Changes” of “Accept Current Change”.
      • Test de uiteindelijke code.

    💬 Reflectie

    • Waarom is het werken met branches veiliger dan direct werken op main?
    • Wat gebeurt er bij een merge conflict, en hoe kun je dat oplossen?
    • Wat zijn goede afspraken als je samenwerkt in één Git-project?
    • Hoe zorg je ervoor dat commitberichten begrijpelijk zijn voor je partner?

    📤 Inleveren

    • Screenshot van je Source Control-tab met ten minste twee branches en één merge.
    • Screenshot van de opgeloste merge-conflictweergave in Visual Studio Code.
    • Korte reflectie in reflectie-branches-<jouwnaam>.txt met antwoorden op bovenstaande vragen.
    • Lever dit in via Canvas per duo (één student levert in namens beiden).

    4 – GitHub en samenwerken op afstand

    🎯 Leerdoelen

    • Je begrijpt wat GitHub is en wat het verschil is met Git.
    • Je kunt een lokale Git-repository koppelen aan GitHub.
    • Je kunt code pushen (uploaden) en pullen (downloaden) via GitHub.
    • Je kunt in duo’s samenwerken via branches en pull requests.

    💡 Uitleg

    Tot nu toe hebben we lokaal gewerkt met Git: al je versies staan op jouw computer. Met GitHub kun je jouw repository online opslaan zodat anderen eraan kunnen meewerken. GitHub is dus een centrale opslagplaats voor Git-projecten. Je kunt daar samen aan code werken, pull requests indienen en elkaars werk reviewen.

    🔍 Verschil tussen Git en GitHub

    GitGitHub
    Versiebeheer op je eigen computerOnline platform om Git-projecten te delen
    Werkt ook zonder internetVereist een account en internetverbinding
    Gebruik via Terminal of VS CodeGebruik via website of geïntegreerd in VS Code

    🌐 Repository koppelen aan GitHub

    1. Maak een account aan op GitHub.com.
    2. Klik op New Repository → geef je project een naam (bijv. python-duo-project).
    3. Laat de opties “Public” en “Add a README” aanstaan.
    4. Klik op Create Repository.
    5. Kopieer de URL die GitHub toont, bijvoorbeeld:
      https://github.com/jouwnaam/python-duo-project.git
    6. Open Visual Studio Code → open je projectmap.
    7. Open de terminal in VSC en voer uit:
    # Koppel je lokale map aan GitHub
    git remote add origin https://github.com/jouwnaam/python-duo-project.git
    
    # Upload de bestaande commits
    git branch -M main
    git push -u origin main
    

    Je project staat nu online! Ga naar GitHub en vernieuw de pagina — je ziet je code, commits en branches verschijnen.

    👥 Samenwerken

    Je kunt nu andere studenten uitnodigen als collaborator:

    1. Ga op GitHub naar Settings → Collaborators.
    2. Klik op Add people en voeg het GitHub-account van je duo toe.
    3. Je partner ontvangt een e-mail en kan daarna ook pushen en pullen.

    🧩 Werken in duo’s (voorbereiding)

    1. Student A maakt de repository aan en voegt student B toe als collaborator.
    2. Student B klikt op “Code → HTTPS” en kiest Clone (kopieer de URL).
    3. In Visual Studio Code → Source Control → Clone Repository en plak de URL.
    4. Beide studenten hebben nu dezelfde code lokaal.

    🛠️ Opdracht – GitHub Push & Pull (Duo)

    Situatie: jullie werken samen aan één Python-bestand dat een klein programma vormt. Jullie zullen elkaars wijzigingen om de beurt uploaden (push) en binnenhalen (pull).

    1. Student A maakt het bestand teamcode.py met deze inhoud:
    # teamcode.py - versie 1
    print("Welkom bij het teamproject!")
    
    1. Student A commit en pusht naar GitHub.
    2. Student B doet git pull of gebruikt de knop Pull in VSC om de nieuwste versie binnen te halen.
    3. Student B voegt code toe:
    # teamcode.py - versie 2
    naam = input("Wat is je naam? ")
    print(f"Hallo {naam}, fijn dat we samenwerken!")
    1. Student B commit en pusht zijn wijziging.
    2. Student A doet opnieuw Pull om de update te ontvangen.
    3. Beide studenten voegen nog één feature toe op hun eigen branch (zie les 3) en mergen die via GitHub.
    4. Controleer in de GitHub-geschiedenis of beide namen zichtbaar zijn bij de commits.

    💬 Reflectie

    • Wat is het voordeel van werken met een gedeelde GitHub-repository?
    • Wat gebeurt er als twee mensen tegelijk dezelfde regel code aanpassen?
    • Wat is het verschil tussen push en pull?
    • Waarom is het belangrijk om regelmatig te synchroniseren?

    📤 Inleveren

    📚 Verdieping (optioneel)

    Voor studenten die verder willen:

    • Leer werken met Pull Requests op GitHub. Maak een branch, push je wijziging, en open een Pull Request via de webinterface.
    • Gebruik Issues om taken te verdelen in jullie duo-project.
    • Bekijk onder Insights → Network hoe Git visualiseert hoe jullie branches zijn samengevoegd.