JavaScript frameworks de fundering van webapplicaties

Na de opkomst van het web 2.0 ontstond de noodzaak voor frameworks. Dit kwam omdat de vraag naar grotere en interactievere web applicaties sterkt toenam. Hieruit ontstond een explosie aan javascript frameworks. De 3 grootste en bekendste opensource javascript frameworks zijn React, AngularJS en Vue. Zoals je je kan voorstellen verschillen de frameworks nogal elk heeft zo zijn sterke en zwakke punten.
updated: Dec 17, 2020 at 11:38AM | published: Jun 25, 2020

Zoals ik in eerder artikel al heb uitgelegd bestond er na de opkomst van het web 2.0 de noodzaak voor frameworks. Dit kwam omdat de vraag naar grotere en interactievere web applicaties sterkt toenam. Hieruit onstond een explosie aan javascript frameworks. Zoals je je kan voorstellen verschillen de frameworks nogal. Somige zijn erg populair voor een jaartje en raken daarna in de vergetelheid en andere worden groter en groter. 

Javascript frameworks zijn niet te verwarren met javascript bibliotheken. Het belangrijkste verschil is dat een bibliotheek bestaat uit een groep functies die een applicatie kan aanroepen om een bepaalde taak te volbrengen (zie onderstaand voorbeeld) Een framework definieert hoe een ontwikkelaar een applicatie ontwikkeld. In andere woorden een framework roept de applicatie code aan, terwijl bij bibliotheken de applicatie code een functie uit de bibliotheek aanroept.

Wat is een Framework?

Wat is een Framework? En waarom is het handig?

Een framework is eigenlijk heel simpel gezegd een omgeving die als basis dient voor jou applicatie. Framework bestaat uit de woorden frame en work dit laat je al weten dat je werkt binnen een frame. Dit zorgt ervoor dat een ontwikkelaar zich aan bepaalde standaarden moet houden. Het mooie van een framework is dat een hoop standaard functionaliteit al staat zodat een ontwikkelaar zich kan richten op de functionaliteit van zijn of haar applicatie wat een hoop tijd bespaart.

Je hebt zowel front-end frameworks zoals React, Angular en Vue.js of Ember.js (een node js framework). Maar ook back-end frameworks zoals Symfony, Laravel en CakePHP

Heb je een framework nodig voor jouw project of wil je dat wij een applicatie voor je bouwen neem dan contact op met een van onze specialisten 

Neem contact op

De 3 grootste en bekendste opensource javascript frameworks zijn React, AngularJS en Vue

AngularJS

AngularJS is een open-source front-end web framework dat onderhouden wordt door voornamelijk Google en een community van toegewijde ontwikkelaars. Het is ontwikkeld om het maken en testen van single-page-applications makkelijker te maken. Dit doet het door een framework voor een client-side Model View Controller op te zetten.

Fun Fact
Angular ook wel Angular 2+ of v2 genoemd is een TypeScript opensource web applicatie framework onderleiding van het Angular team van Google Angular is een complete herschrijving van het team dat AngularJS gemaakt heeft.

AngularJS is het frontend gedeelte van de zogenaamde MEAN stack dit staat voor M(ongoDB)E(xpress.js)A(ngularJS)N(ode.js). MongoDB is een document georiënteerde database. Express.js is een web applicatie node js framework. En Node.js wordt gebruikt als server runtime omgeving dat JavaScript code kan uitvoeren buiten de webbrowser.

Vue.js

Vue.js is een open-source model-view-viewmodel JavaScript framework waarmee je user interfaces en single-page applicatie kan maken. Het is gemaakt door Evan You en wordt onderhouden door hem een groep van actieve core leden die uit verschillende bedrijven komen. Vue is de enige van de drie frameworks die ik vandaag benoem zonder een groot bedrijf erachter.

Vue is ook de jongste van de 3 maar is in de afgelopen paar jaar enorm gestegen in populariteit. Het is makkelijk te leren en het is erg light-weight ongeveer 30kb. Veel front-end ontwikkelaars vinden dat Vue de makkelijkste learning curve heeft van de 3 wat een van de redenen is waarom het zo populair is bij front-end ontwikkelaars.

React

React hebben we natuurlijk al een stukje over verteld in een vorig artikel. Zoals we daar hebben gezegd is React uitermate geschikt voor het maken van interactieve gebruikers interfaces maar ook een widget maken kan heel gemakkelijk met React. Je kan met React simpele overzichten renderen voor elke state in je applicatie. En door het maken van react components kan je deze hergebruiken door je applicatie heen.

React is inmiddels de grootste van de JavaScript frameworks en dat is een naam die hij zeker verdiend heeft. React heeft het concept virtual DOM geïntroduceerd een abstracte kopie van de DOM (Document Object Model) waar ontwikkelaars React features kunnen gebruiken zonder de hele DOM opnieuw te laden.

React heeft niet de laagste learning curve maar men kan relatief eenvoudig een nieuw project starten met behulp van de uitgebreide handleidingen. React heeft een aantal uitstekende uitbreidingen waarmee je heel makkelijk complete webapplicaties kan maken (bvb. react bootstrap en react native) en het werkt heel goed samen met verschillende supporting tools bvb Redux.

De vraag der vragen

Dan krijg je nu natuurlijk de vraag der vragen welke van deze frameworks is nou eigenlijk het beste. En eigenlijk is daar geen heel concreet antwoord op te geven zo hebben ze allen hun voor en nadelen. Als ik tot een antwoord gedwongen zou worden zou ik toch kiezen voor React puur vanwege de versatiliteit, het is uitermate geschikt voor kleine applicaties en voor widgets. En als je een grotere applicatie nodig hebt die moet schalen dan kan je met extra bibliotheken een heel solide framework neerzetten. Ook een groot voordeel van React is dat het niks geeft om de onderliggende technologie stack die je gebruikt om je data mee te controleren alles wat React doet is de data weergeven op je scherm. En door het gebruik van de Virtual Dom maakt het je applicatie razend snel. Daarom staat voor mij React bovenaan.

Zie hieronder een aantal voorbeelden van onze React projecten? 

Wat is een widget?

Wat is een widget? En waar wordt een widget voor gebruikt?

Een widget is in essentie een mini applicatie, het is een dynamisch grafisch element of blokje dat bedoeld is om de gebruiker een specifieke functionaliteit weer te geven. Het mooie van widgets is dat ze herbruikbaar zijn. Je kan het zien als een soort van reuseable web components.

Widgets zijn er in alle soorten en mate en voor je desktop/ laptop of je mobiele telefoon. Denk bijvoorbeeld aan het weer van de dag bij windows 10, een mail widget die je je laatst ontvangen mailtjes laat zien of een afspraken module

Heb je een widget nodig voor jouw website neem dan contact op met een van onze specialisten 

Neem contact op


Deel 4 van de React Hooks serie useMemo & useCallback

Deel 4 van de React Hooks serie useMemo & useCallback

Deel 4 van de ReactHooks serie! We gaan het hebben over useCallback en over useMemo. Met deze hooks kunnen we waardes of callback memoizen dit kan nuttig zijn bij zware operaties of om te zorgen dat bepaalde componenten niet altijd mee rerenderen. Zeker omdat bij kleine applicatie het vaak efficienter is om niet te optimaliseren dan wel.

Lees meer
Redux de Intro!

Redux de Intro!

Deze week een korte introductie van de 4 basisbegrippen die je nodig hebt om Redux te begrijpen. We gaan kort uitleggen hoe state wordt aangepast in een Redux Store met behulp van Reducers en Actions. En we vertellen wat al deze begrippen doen en hoe ze werken in een Redux applicatie.

Lees meer

Software ontwikkeling op maat

Hoe werkt het?

Wat wonderen doet voor het ene bedrijf kan zinloos zijn voor een ander bedrijf. Daarom hebben we oplossingen op maat die het unieke karakter van jouw bedrijf respecteren. We werken in een positieve spiraal van testen, monitoren en verzamelen gegevens om precies te weten te komen wat voor jou werkt en wat niet. Het is onze ‘whole package’-mindset, een aandacht voor details die ons in staat stelt om elke keer jouw prestatiedoelstellingen te bereiken. Dus ontspan en geniet van de rit!