8. Git

In WTUX en WTIS maken we gebruik van Git. Git is een versiebeheer-systeem (Engels: version control system of VCS). Dit betekent dat Git je kan helpen om van je bestanden een historie op te bouwen.

Dit voorkomt dus een lijst bestanden als:

  • webpagina_eerste_versie.html
  • webpagina_tweede_versie.html
  • webpagina_tweede_versie2.0_final_concept.html
  • webpagina_tweede_versie2.0_final_concept_echt_ingeleverd.html

En zorgt er dus voor dat je wel "terug in de tijd" kan naar een oudere versie van een document. Een bijkomend voordeel is dat je met een VCS melding kan maken van wat de veranderingen per bestand is.

BTTF

8.1 Installeren en inloggen

In de WT* courses gaan we beginnen met Github for Desktop. Om daarmee van start te gaan moet je een account aanmaken en de software downloaden.

Als je alles hebt gedownload ziet het er waarschijnlijk als volgt uit:

Github for Desktop: Startscherm

Druk op login om een account te maken op github.com of als je die al hebt om in te loggen.

Je browser wil je dan weer terugbrengen naar de applicatie en vraagt om toestemming: GfD: Toestemming

8.2 Accepteer de opdracht

Als dat klaar is kun je de opdracht accepteren van je docent: GfD: Accepteer opdracht

Dan even wachten tot alles is klaar gezet: GfD: Geaccepteerd

Refresh nog even om uiteindelijk in je "repository" terecht te komen. GfD: Repository

8.3 Clone de repository

De repository is nu waar al je bestanden gaan leven. Clone deze online versie van je repository nu met de groene knop: "Code" en klik dan op "Open with Github Desktop".

Open with GD

Geef weer toestemming om dit te openen in Github Deskopt: GfD: Toestemming

Druk nu op de "Clone" knop in Github Desktop GD: clone

8.4 Repository nu openen in je editor

Om nu aan de slag te gaan willen we code gaan schrijven in een editor. Als het goed is heb je al Visual Studio Code of VSC geïnstalleerd om daarin je code te gaan schrijven. (Zo niet, doe dat eerst even voor de volgende stap).

Nu moeten we Github Desktop nog vertellen welke editor we graag gebruiken. Ga naar "Preferences" en kies daar de nieuw geïnstalleerde editor: GD settings

Klik nu op "Open in Visual Studio Code": GD open in editor

En vertrouw de auteurs (dat ben ik en dat ben jij): GD trust

8.5 Tijd om aan het werk te gaan

Nu kunnen we daadwerkelijk wijzigingen maken en die opslaan.

Maak een kleine simpele wijziging om het mechanisme te testen: VSC maak wijziging

Na het opslaan zul je zien dat VSC de verandering ook waarneemt ten opzichte van de voorgaande "commit". VSC save

Schrijf nu op wat je gedaan hebt in het veld naast je avatar: GD veranderingen committen

En klik dan op de "Commit" knop

GD Commit knop

Om de changes nu niet alleen lokaal maar ook in de cloud op te slaan bij Github drukken op "Push Changes": GD Push changes

8.6 Veranderingen online verifiëren

We gaan even naar onze repository op github terug om te kijken of het alles gelukt is (gehighlight op plaatje is het linkje waar je op kan drukken om de changes te gaan zien): GH repo

Als je nu op de middelste kolom geklikt hebt kom je uit bij het bestand dat je hebt gewijzigd: GH changes

8.7 Conclusie

De workflow is dus altijd:

  • (changes pullen (als je samenwerkt met een ander aan dezelfde codebase))
  • bestanden aanpassen
  • veranderingen committen met een bericht
  • changes pushen

8.8 Meer Git

Git is ontzettend krachtig en bevat een heleboel opties die we niet kunnen behandelen in deze course. Veel hiervan gebeurt ook vanaf de commandline. Als je meer informatie wilt is het Git Handbook een goede optie.