Holland Casino
Holland Casino: All-in on headless
Holland Casino, one of the Netherlands' best-known entertainment companies, has revamped its digital platform in collaboration with Touchtribe. To continue excelling in the dynamic casino industry, it was necessary to modernise and optimise the digital platform with agility and digital efficiency in mind. This drastic change involved the branches website, worksite website and corporate website. In this case study, we take a closer look at the background to this project, the implementation and the final results.
Services
Composable
Headless CMS
Storyblok
Full Stack Web development
Release
2023
Kernuitdagingen: CMS modernisering en efficiënt platformbeheer
Content Management System (CMS) Modernisering
De systemen die voorheen werden gebruikt - Playtech voor de vestigingen websites en Drupal voor de Corporate en Werken-bij websites - sloten niet meer aan bij de gewenste manier van werken. Playtech, primair een online casino software, bood beperkte CMS-functionaliteit, terwijl de gebruikte Drupal end-of-life was, wat betekende dat het noodzakelijk was te upgraden of over te stappen op een nieuwe oplossing. Daarnaast was er een wens voor decentraal contentbeheer.
Minimaliseren van platformbeheer
Met een interne infrastructuur op basis van AWS, was het voor Holland Casino belangrijk een architectuur te ontwikkelen die minimaal hosting onderhoud en infrastructuurbeheer vereiste. Uitgangspunt voor ontwikkeling van het platform was dat het interne AWS team niet belast werd met extra verantwoordelijkheden.
De keuze voor Storyblok CMS
Om hun content management uitdaging aan te pakken, koos Holland Casino voor de headless CMS oplossing van Storyblok. Dit CMS maakt het mogelijk om content centraal te beheren, terwijl het flexibel genoeg is om content naar verschillende platforms te distribueren, zoals een corporate website, werkenbij website, en diverse vestigingen websites. Storyblok werd onder andere gekozen vanwege de preview-functionaliteit, waarmee contentmanagers hun wijzigingen direct op de website kunnen zien.
Gatsby Framework: Optimale snelheid en klantbeleving
Om een uitzonderlijke digitale klantervaring te garanderen, is snelheid cruciaal. Iedere Holland Casino vestiging heeft een eigen website waar speluitleg, evenementenkalenders en restaurant menu’s te vinden zijn. Daarnaast is het ook mogelijk om poker reserveringen toe te voegen en reserveringsmogelijkheden. Om de websites en content zo snel mogelijk te kunnen serveren is voor static site generation gekozen. Het Gatsby framework, gebaseerd op React, kwam hiervoor als de ideale keuze naar voren. Gatsby genereert een statisch pakketje HTML-, CSS- en JavaScript-bestanden die zeer snel worden geladen. Alle content wordt vooraf gegenereerd, waardoor er niets meer gegenereerd hoeft te worden bij het opvragen van een webpagina.
Balans tussen statisch en dynamisch
Een dynamische website biedt flexibiliteit, maar het gebruik van statische content resulteert in snellere laadtijden. Met Gatsby's statische benadering moest er een oplossing worden gevonden voor previews van content. Hoewel er een kleine vertraging is bij het bekijken van draft content, werd dit als een aanvaardbaar compromis beschouwd.
Design-system voor consistentie
Om een consistente gebruikerservaring op iedere website van Holland Casino te waarborgen, is een design-system geïntroduceerd. Het design-system maakt efficiënt gebruik van het framework over alle websites heen. De controle en het beheer van het design ligt bij het designteam. Per website is een thema configuratie opgezet voor verschillende segmenten
Samen met Holland Casino denken wij altijd na over innovatie, ook binnen de codebase. Zo zijn wij nu bezig met het implementeren van een gegenereerd design system op basis van design tokens. Dit zorgt voor consistentie en een goede samenwerking met design.
Cloud-based infrastructuur en automatisering
Om het AWS-team van Holland Casino te ontlasten, werd gekozen voor een cloud-gebaseerde infrastructuur met Amazon Web Services (AWS) voor hosting. De content voor de verschillende websites wordt geplaatst op de S3 buckets van Holland Casino. Bij het gebruik van technologieën die gebruik maken van server-side rendering wordt de laatste versie van content bij het opvragen van de pagina gegenereerd.
Omdat Holland Casino Gatsby inzet, wat zorgt voor static site generation, wordt de laatste content vanuit Storyblok niet opgehaald bij het opvragen van een pagina. Voor deze uitdaging wordt er gebruikgemaakt van Pipedream. Pipedream is een laagdrempelige oplossing die minimale programmering vereist om API's te koppelen. Storyblok heeft de mogelijkheid om een notificatie door middel van een webhook te krijgen op het moment dat er content gepubliceerd wordt. Deze notificatie komt binnen bij Pipedream, waardoor er vervolgens een rebuild en nieuwe deployment van de website gedaan wordt. Hierdoor is de website bijgewerkt met de laatste versie van de Storyblok content.
Decentraal beheer en Mono Repository
Om efficiëntie te verhogen, is het beheer van het CMS bij Holland Casino naar binnen gebracht, waardoor het team dit makkelijk kan overnemen. Touchtribe integreert compleet met de IT omgeving van Holland Casino, zodat ontwikkeling soepel verloopt. Een uitdaging ontstond in het beheren van verschillende websites vanuit een enkele codebase. In eerste instantie werd gekeken naar een gedeelde Gatsby configuratie, maar het differentiëren tussen de drie websites (Corporate, Werken-bij, en vestiging) bleek lastig. Dit werd opgelost door het ontwerpen van vier losse packages in een Github mono repository.
De samenvoeging van meerdere codebases in een mono repository heeft de samenwerking en het beheer van code gestroomlijnd, wat op zijn beurt het onderhoud van de infrastructuur efficiënter maakt. Bovendien heeft deze aanpak bijgedragen aan een snellere uitrolsnelheid en publicatie van website-inhoud.
Toekomstige innovaties
Holland Casino blijft innoveren, met aandacht voor zowel technologie als klantbeleving. Er wordt gekeken naar de integratie van content via kiosken in het casino door middel van een webapp die gekoppeld is met Storyblok. Ook is er aandacht voor de voortdurende optimalisatie van de vestigingenwebsite, met de nadruk op functionaliteiten en klantbehoeften. met deze ontwikkelingen plaatst Holland Casino zich aan de voorhoede van technologische vernieuwing in de entertainmentsector.
Ready for headless?
Do you also want to make use of all the advantages headless development has to offer? Call Gert on 06-55716180. Or leave a message through the form and we will contact you within 1 business day.