Koronapandemien er vår tids største nyhetssak, og full av tall som egner seg for grafikk. Derfor har det heller ikke mangla på prosjekter fra norske utviklere denne våren, for å presentere dyster statistikk i alt fra tradisjonelle grafer til chatbotter.
Men ingen av dem har hatt like mange brukere som VG sin korona-oversikt; Medier24 kunne nylig melde at det er VGs mest leste enkeltsak noensinne.
- Totalt har spesialen nå over 125 millioner sidevisninger, og over hele perioden har vi sidevisninger fra 8,3 millioner unike enheter, forteller redaksjonell utvikler Sondre Nilsen i VG til kode24.
Og bak tallene lurer et lappeteppe av ulik teknologi.
Ingen gule lapper
Redaksjonelle utviklere er spesielt kjent for én ting: Hastighet. Akkurat som journalistene må de hive seg rundt og programmere akkurat det redaksjonen trenger, akkurat når de trenger det.
Så da VG-redaktør Gard Steiro ga avisas ansatte beskjed om å prioritere viruset høyere, lørdagen 29. februar med 15 registrerte smittede i Norge, hev også utviklerne seg på Slack for å planlegge.
Eller rettere sagt; skape.
- Det var ikke noe poeng med gule lapper-workshops og forsinkende prosesser: Vi bestemte oss enkelt og greit for å samle så mye data vi kunne, gi det til folket og la det bli til mens vi jobbet. Det er kult å jobbe et sted med dynamikk, korte linjer, flat struktur og tidvis cowboy-utvikling, forteller Nilsen i VG.
- Samme dag ble de første kodelinjene skrevet, og på formiddagen påfølgende tirsdag ble spesialen publisert.
Google Sheets og mini-CMS
Første skritt er å få inn data, og noe av den må komme fra journalister, som ikke nødvendigvis er teknologer. Samtidig er ikke VGs redaksjonssystem rigga for å levere noe annet enn rene artikler.
Og vipps, så har man også første utfordring, med en kanskje litt overraskende løsning.
Slik fanger man et virus med telefonen
- Tidlig i prosessen lener vi oss ofte tungt på Google Sheets. Det er et grensesnitt alle kjenner, og har god støtte for samtidig redigering, som er helt nødvendig i breaking news-situasjoner, forteller redaksjonell utvikler Jari Bakken i VG til kode24.
Men regneark er sårbare for slurvefeil, forteller han, og veien videre blir derfor ofte et "skreddersydd mini-CMS", som Bakken kaller det. Flere av kategoriene i korona-spesialen har derfor fått egne admin-sider, hvor journalistene enkelt kan fylle inn oppdaterte tall manuelt.
I tillegg har VG-utviklerne fått opp overvåkningstjenester, som varsler på Slack eller epost når det skjer noe på for eksempel en Twitter-konto eller et sykehus sine nettsider. Mye av dataen kommer også inn automatisk, for eksempel fra FHI.
- Er vi heldige legges det ut CSV-filer vi kan importere mer eller mindre direkte. For andre ting skraper vi nettsider og PDF-er for å samle inn data, sier Bakken.
Next.js med Node bak
Dataen VG samler inn lagres i MySQL-databaser, som skal være standarden i VG. I tillegg har de fortsatt noe data i de nevnte Google Sheets-regnearkene.
- Og hvordan koder dere API-ene dere trenger for å hente ut all dataen?
«Når ting skal opp og stå raskt er det greit å bruke noe kjent.»
- Javascript overalt; API-et er skrevet i Node med Hapi. Det er litt på gammel vane; når ting skal opp og stå raskt er det greit å bruke noe kjent. Så kan vi heller eksperimentere mellom slagene, svarer Jari Bakken.
- Jeg ser at sida deres er sydd sammen i React med Next.js, men hva trenger dere egentlig Next.js til?
- Next.js gir oss mye av det vi trenger i en frittstående React-app «ut av boksen», samtidig som det er lett å plugge inn egne ting, mener utvikleren.
Han trekker spesielt fram at det er fint å slippe å sette opp ting som ruting, statisk eksport og kodepakking selv - spesielt når tjenesten skal settes opp raskt, men hele tida utvides.
- Da er det gull verdt å ha fleksibiliteten Next.js gir oss.
Highcharts og Leaflet
For brukerne består VGs korona-spesial først og fremst av to ting: Grafer og kart.
VG har funnet biblioteker for begge deler:
- For grafene bruker de Highcharts, fra norske Highsoft, da VG har god erfaring med denne gjennom flere år nå.
- For å tegne opp kart bruker de Leaflet. Også denne har VG brukt før, som gjør den enkelt å komme raskt i gang med for utviklerne.
Men når det kom til kart, ble det mye jobb likevel.
- Et kommunekart uten kommunenavn fremstår ganske kaotisk, i hvert fall etter den nye kommuneinndelingen. Så mye jobb gikk blant annet med til å sette posisjon for etiketter manuelt for de kommunene hvor senter av en rektangulær avgreningsboks av kommunearealet ikke var godt nok, forteller redaksjonell utvikler Sondre Nilsen i VG.
Bare én av fem utviklere frykter permittering
4,6 millioner på én dag
Korona-spesialen eksporteres som en statisk side gjennom Next.js, API-ene rulles ut med VGs Kubernetes-rigg, og alt legges bak den opprinnelig VG-utvikla cache-løsningen Varnish.
- Men for API-ets del kjører vi ingen caching ute i nettleserne, og gjør mye aktiv purging mot Varnish når datakildene som ligger bak endrer seg. Slik sørger vi for at leserne alltid har de siste tallene, forklarer Bakken.
12. mars, da de strenge korona-tiltakene ble iverksatt her til lands, hadde sida 4,6 millioner sidevisninger på én dag. Utover mars lå det på i snitt 3,5 millioner sidevisninger om dagen, som nå altså har blitt over 125 millioner sidevisninger totalt.
- Har den vanvittige trafikken skapt noe trøbbel for dere?
- Vi har ikke hatt noen større problemer. VGs infrastruktur er godt rigget for dette, sier Bakken, og innrømmer:
- Vi har satt en cache-header eller to litt feil et par ganger, men det blir raskt oppdaga og retta.
Slik koda NAV ny dagpenge-løsning på tre dager
- Vi er dødsslitne, men stolte, forteller NAV-utviklerne som løste krisa med React, Kotlin og PostgreSQL.