This is The Hague: het nieuwe denhaag.com

De gemeente Den Haag kwam naar ons met een ambitieus plan. Het samensmelten van haar cultuur- en recreatieaanbod tot een site die Den Haag op de kaart zet als DE stad waar je geweest moet zijn. THIS IS THE HAGUE. Een ambitieus maar buitengewoon interessant plan, en daar maken wij maar wat graag onze handen aan vuil. Benieuwd hoe we dat aangevlogen zijn? Lees verder.

De nieuwe site is op het eerste gezicht vrij eenvoudig. DenHaag.com bevat redactionele informatie aangevuld met de ‘things to do’ in de stad. Dat kunnen producties (Sister Act) zijn, locaties in de stad (Circus Theater) en evenementen (Denk: koppeling tussen productie en locatie op een specifiek moment, Sister Act op 4 Juni 2014 in het Circus Theater). Maar laat die ogenschijnlijke eenvoud je niet bedriegen. Onder de motorkap schuilt een krachtige motor.

Architectuur

De redactionele content wordt aangemaakt in een CMS. De belangrijkste informatie die wordt aangemaakt zijn themapagina’s (bv: http://denhaag.com/nl/scheveningen). Deze pagina’s kunnnen gekoppeld worden aan een things-to-do query. Dit zorgt ervoor dat een themapagina bijvoorbeeld getoond wordt als je in het hoofdmenu kiest voor ‘what’ => ‘scheveningen (strand)’.

De things-to-do worden aangeleverd door de VVV vanuit haar landelijke database, de NDTRC. Om het mogelijk te maken dat later ook vanuit andere bronnen data op denhaag.com kan worden geplaatst, is ervoor gekozen om een REST API open te stellen (DataSupplier API) waar de datamodificaties kunnen worden aangeleverd in het formaat zoals door denhaag.com gespecificeerd.

De CMS content en de things-to-do worden geïndexeerd door Elasticsearch. Deze index wordt gebruikt om content eenvoudig meertalig aan te bieden en denormalisaties uit te voeren. Dit zorgt er voor dat het opvragen van pagina’s op de website snel gaat en niet teveel rekenkracht van de Website API vraagt.

De Elasticsearch index is via een API gekoppeld aan de website en is niet vanuit de buitenwereld te bereiken. Het gebruik van deze tussenliggende API heeft als groot voordeel dat de website een zeer simpel domein heeft en alleen verantwoordelijk is voor webspecifieke taken.

Hosting — Azure

De gehele setup van DenHaag.Com is gehost op Azure. De DataSupplier API is een C# Web Api project, de Indexer een WebJob, de Website Api wederom een C# Web Api project en de website een reguliere C# ASP.Net MVC 5 website. De Elasticsearch instance is in een cluster van 2 nodes in een availability set opgezet, ter voorkoming van downtime. De Website API + Website zijn ingesteld om op te schalen op basis van bezoekersaantallen, zodat ook bij een groot aantal bezoekers de website snel blijft reageren.

Continuous Integration + Deployments

Om ervoor te zorgen dat er zo min mogelijk bugs in productie worden gevonden hanteren we een zogenaamde ‘OTAP’ straat. Dat wil zeggen; code wordt tijdens het ontwikkelproces periodiek naar de Ontwikkelomgeving gedeployed. Zodra een feature stabiel is wordt de bijbehorende code doorgezet naar de Testomgeving. Als de feature op de testomgeving goed is bevonden, wordt de code doorgezet naar de Acceptatie omgeving, waar wordt gecontroleerd of de feature ook werkt in een omgeving die nagenoeg gelijk is aan de productieomgeving. Na akkoord van de product owner wordt de feature ten slotte gedeployed naar de Productieomgeving. Na het pushen van nieuwe broncode naar onze Github repository, pakt onze Continuous Integration server, Teamcity, de code automatisch op en voert deze de volgende stappen uit:

  • De code compileren;
  • De Unit tests draaien;
  • De applicatie deployen naar de ontwikkel omgeving;
  • Smoketests draaien op de ontwikkel omgeving

Als er tijdens deze stappen fouten worden gevonden geeft TeamCity hier direct een signaal op af en kan het verantwoordelijke teamlid de problemen oplossen.

Het ontwikkelproces is er op ingericht dat nieuwe features gecontroleerd in de major releases terecht komen. We hanteren 
 Git-Flow, wat wil zeggen dat features eerst in een losse branch worden ontwikkeld (bv: feature/thingstodo-facetfiltering) voordat ze worden toegevoegd aan de hoofd ontwikkellijn (develop). Zodra deze stabiel is bevonden, mergen we naar de master branch. TeamCity zorgt er vervolgens voor dat de code automatisch gecompileerd en gedeployed wordt naar de acceptatieomgeving.

Focus op kwaliteit

Omdat we graag willen dat een website naast een mooi product ook onder de motorkap goed blijft werken gebruiken we SonarQube om ons inzicht te geven in een aantal basismetrieken van de codebase. SonarQube is een statische code analyse tool en kan diverse metrieken zoals code coverage en coding warnings verwerken.

De toekomst

De nieuwe website met bijbehorend publicatie platform is pas het begin. Er wordt momenteel nog druk aan verder ontwikkeld om alle wensen van de gemeente Den Haag een plekje te geven. Daarnaast is deze aan het onderzoeken welke additionele bronnen ze graag informatie willen laten aanleveren. Ook is de gemeente aan het overwegen om de website API open te stellen zodat het publiek obv de aanwezige cultuur en recreatie informatie eigen creaties kunnen maken. Iets wat wij graag aanmoedigen.