JavaScript library ‘React’ van Facebook steeds populairder, ook bij ShareValue

Dat Facebook een van de machtigste online platformen ooit is, dat behoeft geen uitleg. En hoewel het platform de laatste tijd nogal onder vuur ligt in verband met de privacyschendingen, is er in elk geval ónder de motorkap van Facebook iets moois te vinden: JavaScript library ‘React’.

Dit lichtgewicht framework is erg populair aan het worden en dat is niet zo gek. Ook de ShareValue developers krijgen er steeds vaker mee te maken. Drie van onze developers leggen uit waarom zij zo enthousiast zijn over React. 

De omschrijving op Github is kort maar krachtig: (React is) ‘a declarative, efficient, and flexible JavaScript library for building user interfaces’. Maar is het nu een library of een framework? Dat is een andere discussie (serieus). Je kan er in elk geval heel gemakkelijk en efficiënt user interfaces mee bouwen en dan met name bedoeld voor het web. 

React wordt niet alleen voor Facebook gebruikt; vanzelfsprekend zitten ook Instagram en Whatsapp er vol mee. De ontwikkeling van React gebeurt dus door, maar ook zeker vóór Facebook”, zegt Dennis Beverloo, developer van ShareValue. Maar het is open-source, het staat op Github en is al meer dan 17.000 keer geforked. React is, kortom, ‘hot’.

 ReactJS library

ShareValue heeft diverse developers geplaatst die nu de hele dag bezig zijn met het ontwikkelen van React-components. Dennis werkt voor een grote energieleverancier in Rotterdam, waar niet zo lang geleden een nieuwe website is gelanceerd. “Ik werk al jaren met Sitecore en de website wordt vanuit dit cms gevoed met content. De pagina’s worden opgebouwd met Sitecore-componenten, maar we schrijven die in React. We hebben allemaal kleine componentjes gebouwd, die kunnen vanuit het cms door de webredactie heel eenvoudig worden toegevoegd aan een pagina.”

Een voorbeeld van zo’n component zie je meteen als je op de homepage komt. “Dat is de zogenoemde ‘hero’, een flinke afbeelding met een grote kop en daaronder een formuliertje. Dat spring echt in het oog en hiermee kunnen bezoekers snel het maandbedrag berekenen als ze hun postcode en huisnummer invullen. Dit hero-component bestaat aan de achterkant weer uit subcomponenten. En alleen al bijvoorbeeld de titel is een component. Dat is ook het mooie, dat het modulair opgebouwd is en steeds kan worden hergebruikt. Hierdoor gaat het ontwikkelen erg snel. Een ander component dat we in React hebben gebouwd is de slider op de homepage. De cards met afbeeldingen kunnen heel mooi worden versleept, zowel met de muis als via touch, als je de website via een mobiel device bezoekt.”

 

 Sitecore logo

 

Menno Visser heeft een opdracht gedaan voor een grote verzekeraar in Gouda. Ook hij is erg te spreken over React. “Het is een opkomend framework en wordt steeds populairder. Het werkt ook heel mooi samen met Sitecore, omdat je daarin heel gemoduleerd in kan werken en dit is ook het geval bij React. Vroeger werkte het zo dat JavaScript en de views echt los van elkaar stonden. De views riepen de JavaScript aan. Maar in React werkt het precies andersom: je maakt in In JavaScript de html en React is vervolgens de techniek die dat ondersteunt.”

“Het voordeel is dat je hele mooie kleine bouwblokjes kunt maken, die je heel goed kunt hergebruiken”, zegt Menno. Stel dat je het in html-elementen zou bekijken, dan maak je een componentje voor een label, voor een input. En die twee gebruik je weer voor een componentje voor een row, die gebruik je vervolgens weer voor een contactformulier; en zo bouw je eigenlijk al je kleine bouwsteentjes, bouw je vanuit ‘het DNA’ complete cellen, complete organismes op. Het is natuurlijk een metafoor, maar zo werkt het wel in de praktijk. En omdat je met hele kleine bouwblokjes werkt, is het ook heel goed testbaar. Op die manier bouw je dus je applicatie op. En dan voornamelijk applicaties voor het web.”

Waarom bedrijven voor React kiezen en niet voor bijvoorbeeld Angular, het framework dat is ontwikkeld door Google? Het lijkt op het eerste gezicht toch ook een kwestie van smaak te zijn. Gepaard aan de drang om altijd voorop te willen lopen, of in elk geval mee te gaan met de tijd. React is sinds 2013 open-source beschikbaar (onder BSD-license) en is dus nieuwer dan Angular, dat al in 2009 het licht zag. Maar beide platforms worden doorontwikkeld, dus om nu te zeggen dat dit veel verschil maakt? 

“Een van de grootste voordelen van React boven Angular en vergelijkbare frameworks, is de schaalbaarheid. Het is modulair, lichtgewicht en niet alleen gemakkelijk up te scalen, maar dat upscalen is ook nog eens betrekkelijk goedkoop”, zegt Dawid Zdanowicz. Hij is ingehuurd als developer bij een grote Nederlandse bank, samen met twee andere ShareValue-collega’s - die de back-end doen voor een interne applicatie. Dawid is verantwoordelijk voor het bouwen van de de UI (User Interface) in React. De bank koos juist vanwege de goede schaalbaarheid voor React, vertelt Dawid. “En omdat het heel goed met .NET samenwerkt. Microsoft pusht zelfs een beetje om React te gebruiken. En omdat de hele backend op Microsoft draait, was de keuze voor React dus logisch. Het is ook veel lichter dan bijvoorbeeld Angular van Google.”

Dawid verwacht veel van React in de nabije toekomst. “Eerst waren het vooral de jonge, hippe bedrijven zoals Netflix en Airbnb die gebruik maakten van React. Maar je ziet nu dat ook de wat traditionelere bedrijven steeds vaker overstappen. Ik verwacht dan ook veel werk in de komende jaren voor React-developers. Zeker in combinatie met state management toepassingen als Redux en Flux.”

ShareValue kan volgens Dawid, Dennis en Menno veel betekenen op het gebied van React. “We hebben al een flink aantal Microsoft .NET-developers rondlopen die een stabiel back-end platform kunnen bouwen. En dat gekoppeld aan de steeds groter wordende schare aan front-end developers die gespecialiseerd zijn in React, die daarmee een mooie interface bouwen, ja dat is een gouden combinatie.”

 
08-08-2018 | Menno

Vond je dit een interessant bericht? Deel het!

Terug naar blogoverzicht
Foto auteur

Menno

Developer

© ShareValue 2018