PWA, Headless en Magento

Geschreven door We Provide

Mogelijk heeft de titel van deze blog voor de meeste mensen vragen opgeroepen en natuurlijk gaan wij als We Provide je in deze blog uitleggen wat er bedoeld wordt met PWA, headless en de relatie met Magento 2.X.

PWA wat???

PWA staat voor Progressive Web Apps, een techniek die zijn naam van Google heeft gekregen. Het concept van PWA is simpel: een website moet betrouwbaar, snel en gebruiksvriendelijk zijn, op welk apparaat je de website ook bezoekt. Steeds meer aankopen worden gedaan op de mobiele telefoon, dus is het belangrijk dat de website gebruiksvriendelijk en snel is om een zo hoog mogelijke conversie te hebben. Daarnaast kan het erg gunstig zijn voor SEO omdat Google in de toekomst een website die gebruikt maakt van PWA hoger zal gaan ranken in haar zoekresultaten.

Het idee van PWA bij een Magento 2.X webshop is dat er veel in de browser van de eindgebruiker wordt gedaan, in plaats van dat er voor elke nieuwe pagina een volledige pagina van de server wordt geladen. Dit betekent dat er minder druk komt op de server en dat tegelijkertijd de laadtijd van de pagina omlaag gaat. Een ander voordeel hierbij is dat de opmaak van de website zich als een app voor kan doen, waardoor het niet meer nodig is om een aparte app te ontwikkelen voor bijvoorbeeld iOS of Android. Een van de voordelen hiervan is dat het mogelijk is om push-notificaties te versturen naar de mobiele telefoon van de gebruiker en dat de website offline beschikbaar is. De verschillen tussen een webshop en app worden op deze manier een stuk kleiner.

Langzaam maar zeker wordt PWA steeds vaker met Magento in een zin genoemd. Magento heeft namelijk een tijdje geleden aangekondigd dat ze PWA gaan integreren in Magento 2.3 met Magento PWA Studio (release Q2 2018). Ook het concept headless wordt steeds vaker aangehaald en benoemd als een techniek voor de toekomst, zeker in combinatie met GraphQL waarvan we de eerste ondersteuning krijgen in Magento 2.3 en waarschijnlijk volledige ondersteuning in Magento 2.4 (release Q3 / Q4 2018).

Wat kan Magento met PWA Studio?

Een van de mogelijkheden die meekomt met PWA Studio is de optie om een zelfgemaakte front-end in te voegen. Dit betekent dat je niet meer gebonden bent aan PHP, waarin de front-end van Magento is geschreven, maar dat je via een koppeling een front-end in bijvoorbeeld ReactJS of VueJS kunt laten ontwikkelen. Deze talen worden veel gebruikt bij de ontwikkeling van front-ends, omdat ze de mogelijkheid geven om op het apparaat van de eindgebruiker de beleving en snelheid te optimaliseren.

De praktijk tot nu toe leert ons dat er nog steeds veel gebruik gemaakt wordt van de front-end van Magento, omdat Magento zelf hier veel mogelijkheden voor biedt, waardoor het kostbaar kan zijn om dit allemaal te vervangen. Denk hierbij aan het volledig herontwikkelen van de front-end maar ook aan het integreren van extensies die moeten worden weergegeven en die ook allemaal koppelingen nodig hebben voor de nieuwe front end. De focus van Magento als het aankomt op headless en PWA is op dit moment de front-end en niet de back-end.

Wat is headless en wat heeft het met PWA te maken?

Headless begint net als PWA ook steeds meer een onderwerp van gesprek te worden, maar wat is nou daadwerkelijk headless? De technische definitie van headless houdt in dat headless software een stuk software is dat zonder visuele interface draait. In de praktijk betekent dit dat je bijvoorbeeld geen front-end, zoals een Magento storefront, nodig hebt om een systeem succesvol taken te laten uitvoeren. Het is hierbij mogelijk om zelf een front-end en/of back-end interface te ontwikkelen voor een headless systeem en dit via een API te koppelen. PWA is hierbij de naam van de techniek die Google gebruikt om een front end te ontwikkelen voor een headless systeem. Als We Provide zien wij diverse voordelen aan headless, doordat de back-end los komt te staan van de front-end zijn onze klanten ook eerder in staat mee te gaan met nieuwe technische ontwikkelingen van endpoints (computers, tablets, smartphones) zodat er altijd een optimale ervaring gegeven kan worden aan de eindklant. Als je dit eventueel combineert met een PWA oplossing ben je naar onze mening klaar voor toekomst.

Benieuwd naar wat wij voor jou kunnen betekenen?

  • Supersterk in websites, webshops èn apps
  • Ruim 10 jaar online ervaring
  • In-house development, design & marketing
  • Volledige ondersteuning
of+31 (0)88 6000 700