...
Op tutorialspoint (https://www.tutorialspoint.com/vuejs/vuejs_overview.htm) is een goed artikel over de features van Vue.js. Aan de hand van dit artikel kunnen we bovenstaande criteria nagaan. Voor criteria 1 is gezegt dat Vue.js makkelijk en snel te leren moet zijn. Uit het artikel in tutorialspoint komt naar voren dat het Vue.js framework makkelijk te leren is, en daardoor ook heel populair is geworden. Voor dit onderzoek is ook gekeken om data te krijgen over Vue gebruikers die ervaring hebben met andere frameworks. In deze reddit thread (https://www.reddit.com/r/vuejs/comments/kren4e/how_hard_is_vuejs_to_learn/) komt naar voren dat gebruikers die ervaring hebben met meerdere frameworks over het algemeen zeer te spreken zijn over de leerbaarheid van Vue.js. Ook zijn er al libraries beschikbaar zoals Vuetify (https://vuetifyjs.com/en/) waar al heel veel standaard componenten in zitten.
Een simpele google search laat zien dat Vue.js ook relatief lightweight is. Om precies te zijn is het 33.30KB. Hierover meer informatie in hoofdstuk 5.2.1. Verder is het in Vue inderdaad mogelijk om herbruikbare componenten te bouwen: 'Components are one of the important features of VueJS that helps create custom elements, which can be reused in HTML.' (https://www.tutorialspoint.com/vuejs/vuejs_overview.htm). Hierover meer in hoofdstuk 5.1.
Om een flow op te bouwen in Vue js zijn verschillende tools beschikbaar zoals event handling en de v-if en v-else constructies.
Tenslotte voor het laatste criteria; Vue moet kunnen worden opgedeeld in overzichtelijke componenten met leesbare code. Dit slaat een beetje terug op het stuk over herbruikbare componenten, omdat dit het voor developers automatisch makkelijker maakt om code op te delen in een goede folder structuur en hierdoor het overzicht te behouden. Verder bestaat een Vue component uit drie hoofdonderdelen:
Deze structuur komt in alle componenten terug, waardoor het makkelijk is om terug te vinden welke logica waar staat. Binnen deze structuur hoeven echter niet alle onderdelen in ieder component te zitten, er kan bijvoorbeeld een component bestaan zonder custom styling die dus geen gebruik maakt van de <style>.
In het kort; de template geeft een overzicht van hoe de uiteindelijke markup van dit component eruit moet komen te zien gebasseerd op de interne staat van het component. Het script houdt de logica van het component, en hieronder vallen dingen als de properties en de state van een component. Ten slotte de style, dit is waar de css staat voor de opmaak van het component.
https://snipcart.com/blog/vue-component-example-tutorial
Resultaten
Hoe zit Vue.js globaal in elkaar?
...