Workshop Full Stack Before Development

• Applicatie- en mediaontwikkelaar
• MBO
• Studiejaar 2

Workshop - Full stack development

Kennismakingsronde

• Wil ik weten hoe een full stack app in elkaar zit
  > Wat is een Stack?
  > Uit welke lagen is een Applicatie opgebouwd?
  > Voorbeeld
  

Voor het maken van een Full stack App

Kennismakingsronde

Full stack Developer

Kennismakingsronde

Full stack Developer Modern

Kennismakingsronde

Mijn stack

Kennismakingsronde

Mijn (microsoft) stack

C# .Net Core
Logica/Algoritmes
DB connectie maken.
Data manipulatie

HTML
CSS
Bootstrap
Xamarin.forms
WPF
XAML

SQL Server Management Studio

CRUD

Kennismakingsronde

• Maak een overzicht van de technieken/programming languages die je (gaat) leren op school.
• Breng deze technieken onder in 3 lagen:
  > Front End
  > Back End
  > Database
  
• Maak een zo compleet overzicht van de verschillende technieken waarvan jij denkt die nodig te hebben om een full stack applicatie te kunnen maken.
• Beantwoord de vraag: Hoe zijn deze technieken met elkaar verbonden?
  
• Beantwoord de vraag: Wat is de rol van Front end/Back end/Database?
• Wat is de rol van XAMPP in dit overzicht?

Voor het maken van een Full Stack App

1. In PHP wat gebeurt er als ik
1 + 1 uitvoer en print naar de console

1. 2
2. Error
3. 11
4. "11"

2. In PHP wat gebeurt er als ik
"H" + "A" + "L" + "L" + "O" uitvoer en print naar de console

1. "HALLO"
2. Error
3. 0
4. 5

3. In PHP wat gebeurt er als ik
"H" . "A" . "L" . "L" . "O" uitvoer en print naar de console

1. "HALLO"
2. "hallo"
3. Error
4. 5

4. In PHP wat gebeurt er als ik
"10" . "5" uitvoer en print naar de console

1. "15"
2. 15
3. "105"
4. Error

5. In PHP wat gebeurt er als ik
10 . 5 uitvoer en print naar de console

1. "15"
2. 15
3. "105"
4. Error

6. In PHP wat gebeurt er als ik
"10" + "5.5" uitvoer en print naar de console

1. Error
2. 15.5
3. "105.5"
4. 20.5

7. In Python wat gebeurt er als ik
"Hallo" + 123 uitvoer en print naar de console?

1. "Hallo123"
2. Error
3. Hallo123
4. "Hallo"

Kennismakingsronde

• Gebruik w3schools om data types op te zoeken in de jouw programmeertaal. 
  
• Gebruik de "Try it yourself" editor in w3schools om in jouw programmeertaal te oefenen met 
  Data types en operations.

Opdracht

In de volgende workshop wil ik graag dit onderwerp behandelen:

Kennismakingsronde

       Problemen

• Bestanden overschrijven zonder terug te kunnen
• Moeite met samenwerken aan hetzelfde project
• Niet kunnen zien wie welke wijzigingen heeft gemaakt
  Oplossingen met GIT
• Opslaan van verschillende versies van je code (commits).
• Samenwerken met anderen zonder conflicten
• Het herstellen van eerdere versies van je project
• Overzicht hebben van wie wat heeft gedaan en wanneer

Versiebeheer - software - GIT

Kennismakingsronde

Solo werken
Experimenteren zonder je project te breken

Samenwerken
Werken in een team zonder elkaar in de weg te zitten

Back-up
Het verlies van code voorkomen door regelmatig te committen en te pushen naar een remote repository (bijv. GitHub)

GIT in de praktijk

Kennismakingsronde

• GIT is een standaard in de software-industrie.
• Vaardigheden in GIT zijn vereist voor bijna elke professionele ontwikkelingspositie.
• Efficiënt kunnen samenwerken met anderen via tools als GitHub of GitLab.

GIT voor je verdere loopbaan

Kennismakingsronde

Wat het doet:
Hiermee maak je een nieuwe Git repository aan in een map. Het vertelt Git dat je in deze map versiebeheer wilt gebruiken.
Voorbeeld:
Je hebt een nieuwe map met projectbestanden en wil beginnen met versiebeheer. Met git init maak je die map klaar voor Git.
Eenvoudig gezegd:
"Ik ga deze map gebruiken voor versiebeheer, houd alles vanaf nu bij."

GIT basis commando's - git init

Kennismakingsronde

Wat het doet:
Hiermee vertel je Git welke bestanden je wilt volgen en opslaan in de volgende "versie" (commit). Je moet dit doen voordat je een commit maakt.
Voorbeeld:
Je hebt een bestand 'index.html' aangepast en je wilt dat Git deze wijziging onthoudt. Met git add index.html geef je aan dat dit bestand toegevoegd moet worden aan de volgende versie.
Eenvoudig gezegd:
"Dit bestand is klaar om te worden opgeslagen in de volgende versie."

GIT basis commando's - git add

Kennismakingsronde

Wat het doet:
Hiermee sla je een nieuwe versie van je project op in Git. Het onthoudt de wijzigingen die je met git add hebt geselecteerd. Je kunt ook een bericht toevoegen om te beschrijven wat je hebt veranderd.
Voorbeeld:
Na het toevoegen van wijzigingen met git add, gebruik je git commit -m "Beschrijving van wat er veranderd is" om een nieuwe versie op te slaan.
Eenvoudig gezegd:
"Dit bestand is klaar om te worden opgeslagen in de volgende versie."

GIT basis commando's - git commit

Kennismakingsronde

Wat het doet:
Met git push stuur je je lokale commits (de versies van je project die je lokaal hebt opgeslagen) naar een remote repository, bijvoorbeeld op GitHub of GitLab. Dit maakt je werk toegankelijk voor anderen of als back-up.
Voorbeeld:
Nadat je lokaal wijzigingen hebt gemaakt en gecommit, wil je die naar een externe server sturen zodat je teamgenoten ze ook kunnen zien. Met git push origin main stuur je je commits naar de 'main' branch van de 'origin' repository (bijvoorbeeld op GitHub).
Eenvoudig gezegd:
"Stuur mijn opgeslagen versies naar de online repository, zodat ik of anderen er vanaf een andere plek bij kunnen."

GIT basis commando's - git push

Kennismakingsronde

Kijk en luister goed naar de uitleg. Na afloop krijg je een korte quiz over de onderwerpen.
In de video's komen veel termen voor die je nog niet kent, een van die termen is misschien

snapshot:
Een snapshot in GIT is als een foto van je project op een bepaald moment. Het bewaart alles zoals het is, zodat je later altijd terug kunt naar die versie als iets misgaat.

Video over de basis van GIT

Welke van de volgende acties beschrijft een "commit" volgens de video?

1. Het verwijderen van bestanden uit de repository
2. Het kopiëren van bestanden naar een back-up
3. Het opslaan van een specifieke versie van de code met een beschrijving
4. Het sluiten van een project

Waarom is samenwerken makkelijker met GIT, zoals uitgelegd in de video?

1. Omdat iedereen in realtime dezelfde code kan bewerken
2. Omdat GIT automatisch alle conflicten oplost
3. Omdat meerdere mensen tegelijkertijd kunnen werken zonder elkaars werk te overschrijven
4. Omdat GIT alleen lokaal werkt op één computer

Een techniek voor versiebeheer en samenwerken aan code.

Een website waarop je Git-repository’s kunt delen.

Een map die onder controle staat van Git.

Het vastleggen van je wijzigingen.

Commit

Git

Repository

GitHub

Kennismakingsronde

       Opdracht 1: Add, Commit & Push

• Ga naar de opdracht GIT Beginner 5. Pushing all the right buttons
• Maak een nieuw .txt bestand aan in de map (local repo)
• Maak een wijzigingen in hallo.txt bestand
• Check Git Status (welke wijzigingen ziet git?)
• git add alleen de wijzigingen in hallo.txt
• git commit (met een eigen geschreven message)
• git push

Workshop opdracht - software - GIT

Kennismakingsronde

       Opdracht 2: Add all, Commit no message & Push

• Maak een wijziging in het nieuwe .txt bestand
• Maak ook een wijzigingen in hallo.txt bestand
• Check Git Status (welke wijzigingen ziet git?)
• git add alle wijzigingen (gebruik -a)
• git commit (zonder message, wat gebeurt er?)
• git push

Workshop opdracht - software - GIT

Kennismakingsronde

       Opdracht 3: Back to the future

• Ga terug in de tijd!
• Git log (zie je geschiedenis)
• Git checkout "commit hash"
  
• Git push
• Verklaar wat er is gebeurd door in Bitlab te kijken naar de commits

Workshop opdracht - software - GIT

Ik begrijp waarvoor we GIT gebruiken in Nexed

😒🙁😐🙂😃