MVC

Bij het project Code Exchange heb je moeten werken volgens de Model-View-Controller structuur.

In deze structuur wordt er een scheiding gemaakt tussen de verschillende verantwoordelijkheden van code.

• Model is verantwoordelijk voor het verzamelen van data die in de applicatie nodig is.
• View is verantwoordelijk voor alles wat de gebruiker kan zien in de frontend.
• Controller is verantwoordelijk voor het verwerken van wat de gebruiker daadwerkelijk aanraakt.

Er zijn ook strenge regels hoe de flow van logica tussen deze drie “lagen” plaatsvindt: - De View mag alleen direct met een Controller communiceren - De Controller mag met zowel de View als de Model communiceren - De Model mag alleen direct met de Controller communiceren

Neem als voorbeeld de volgende situatie in gedachte: je wilt een tekst uit de database op de website tonen, maar pas nadat de gebruiker op een knop heeft gedrukt.

• De knop en de plek waar de tekst moet komen bestaan in de View, maar hebben verder geen logica.
• De Controller achter de View zorgt ervoor dat de knop een click-event krijgt.
• De click-event (in de Controller) regelt vervolgens dat er via een Model de bijbehorende query op de database wordt uitgevoerd, en past vervolgens de tekst aan in de View.

MVC tijdens dit project

Dat de Model in bovenstaande situatie de query is niet gebruikelijk bij software ontwikkeling. Naast de drie lagen van de MVC-structuur bestaat er ook nog de Service-laag, deze hoort eigenlijk de query uit te voeren. De Model representeert dan enkel het resultaat. Hier ga je dit project mee werken in zowel je je frontend- als backend applicatie.

Tijdens dit project ga je ook gebruik maken van Web Components, dit is in principe een evolutie van de MVC-structuur, maar dan standaard ingebouwd in de browser!