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
Key challenges: CMS modernisation and efficient platform management
Content management system (CMS) modernisation
The systems previously used - Playtech for the branches websites and Drupal for the Corporate and Working at websites - no longer matched the desired way of working. Playtech, primarily an online casino software, offered limited CMS functionality, while the Drupal used was end-of-life, which meant it was necessary to upgrade or switch to a new solution. In addition, there was a desire for decentralised content management.
Minimising platform management
With an internal infrastructure based on AWS, it was important for Holland Casino to develop an architecture that required minimal hosting maintenance and infrastructure management. The starting point for platform development was that the internal AWS team should not be burdened with additional responsibilities.
The choice for Storyblok CMS
To address their content management challenge, Holland Casino chose Storyblok's headless CMS solution. This CMS allows content to be managed centrally, while being flexible enough to distribute content to different platforms, such as a corporate website, worksite website, and various branch websites. Storyblok was chosen partly because of its preview functionality, which allows content managers to see their changes directly on the website.
Gatsby Framework: optimal speed and customer experience
To ensure an exceptional digital customer experience, speed is crucial. Each Holland Casino establishment has its own website where game explanations, event calendars and restaurant menus can be found. It is also possible to add poker reservations and booking options. To serve the websites and content as quickly as possible, static site generation was chosen. The Gatsby framework, based on React, emerged as the ideal choice for this. Gatsby generates a static package of HTML, CSS and JavaScript files that load very quickly. All content is pre-generated, meaning that nothing more needs to be generated when requesting a web page.
Balance between static and dynamic
A dynamic website offers flexibility, but using static content results in faster load times. With Gatsby's static approach, a solution had to be found for previewing content. Although there is a slight delay when previewing draft content, this was considered an acceptable compromise.
Design system for consistency
To ensure a consistent user experience on every Holland Casino website, a design-system has been introduced. The design-system makes efficient use of the framework across all websites. Control and management of the design lies with the design team. Per website, a theme configuration has been set up for different segments
Together with Holland Casino, we are always thinking about innovation, including within the codebase, and we are now implementing a generated design system based on design tokens. This ensures consistency and good collaboration with 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.
Future innovations
Holland Casino continues to innovate, focusing on both technology and customer experience. It is looking at integrating content via kiosks in the casino through a web app linked to Storyblok. There is also a focus on ongoing optimisation of the branch website, with an emphasis on functionalities and customer needs. with these developments, Holland Casino places itself at the forefront of technological innovation in the entertainment sector.
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.