Headless CMS. Det er et fancy udtryk. Og hvis du synes det lyder kedeligt, så er det her nok ikke for dig. Vi derimod, er helt oppe og køre over headless CMS – det er en game changer for os som digitalt bureau – og dermed også for vores kunder, idet vi kan lave nogle mega sprøde websites til dem. Fordelene ved headless, vender jeg tilbage til.
Lidt om frontend vs backend
For at forstå betydningen af et headless CMS, må man forstå forskellen mellem backend og frontend. Betegnelsen frontend og backend flyder ofte sammen, men helt grundlæggende så udgør frontenden ofte moduler baseret på HTML, CSS og javascript. Alt dette bliver afviklet af klienten (også kaldet browseren) og ikke af serveren.
Så hvad gør frontenden af et websted muligt? Hvor er teksten, billeder, og opbygning af siderne gemt? Det er her backenden kommer ind. Backenden af et websted består af en server, en database, og ofte et CMS. WordPress er blevet udviklet således at administrator kan logge ind og oprette sider/posts osv og gemme dette i databasen – dette er backenden. Frontenden i WordPress består af et “WordPress tema” som er udviklet i PHP, Javascript og CSS. Så WordPress består altså både af en frontend og en backend.
Godt så. Jeg ved det er kedeligt, men nu forstår du måske forskellen mellem backend og frontend… og det er vigtigt når du skal forstå hvor AWESOME et headless CMS er.
Tilbage til headless CMS.
Grundlæggende vil et “headless CMS” sige at man udelukkende benytter backenden af et CMS og så bygger man så frontenden i et andet system, uafhængigt af dit CMS. Og hvorfor skulle man så gøre det, spørger du?
Jo ser du, ved et klassisk CMS (som WordPress), er du afhængig af at bygge/udvikle frontenden ud fra det som forfatterne af CMS’et dikterer. Det er jo sådan set fint nok, men WordPress eksempelvis er bygget på PHP. PHP bliver renderet af serveren, dvs at hver gang du skal loade en side bygget med PHP, så skal serveren renderer PHP, fortolke data’en og renderer det til HTML så browseren kan læse det. Det samme er næsten gældende for alle CMS systemer, hvad enten de er bygget på PHP, .NET osv.
Ved at frakoble frontenden fra CMS’et, så er du ikke underlagt det sprog som CMS’et ellers er kodet i. Og dét er fedt – det giver uanede muligheder.
Javascript applikation som frontend…
Hvorfor er dét fedt?
Teknologien inden for frontend er eksploderet over de seneste år og det skyldes hovedsageligt moderne javascript biblioteker som node.js, vue, react og angular. I dag kan man faktisk bygge en applikation udelukkende bygget på javascript. Det giver uhørt mange muligheder for at udvikle websites som føles super godt at interagere med. Bl.a. kan du bygge en applikation helt uden at brugeren behøver at lave et nyt “page load”. Jo du kan godt skifte side i en hjemmeside bygget udelukkende på et af førnævnte javascript biblioteker, men serveren behøves ikke at rendere alt igen for brugeren. I stedet kan du blot få javascript til at rendere en ny side uden at lave et reload af siden.
Her hos Checkmate ELSKER vi Vue.js.
Men hvordan kan du få din javascript applikation til at integrere med data fra backenden? “Let me introduce” REST API.
Lidt om REST API
REST API muliggør en transfer af data fra database til frontend. Med et REST API kan du hente data, opdatere data, oprette data og slette data i dit CMS. Gennem javascript frontend’en kan vi ved et request på f.eks. ‘/om-os’, lave et kald til REST API’et og tjekke om der findes en side i CMS’et med url’en ‘/om-os’. Hvis siden findes kan vi rendere data’et i applikationen.
Ofte får hjemmesider bygget på denne måde meget kritik i forhold til SEO. Det er fordi at når Google scraper ens hjemmeside, så kræver Google at man har udfyldt diverse meta tags for at Google kan indeksere den. Med en applikation bygget på Vue, React eller Angular, bliver alt HTML renderet af klienten, idet at det er klienten som gennem REST API’et laver et kald til CMS: Derved når Google ikke at indeksere siden.
Det er der heldigvis en løsning for. Med ekspress.js, kan få serveren til at rendere javascripten inden at klienten svare. Derved kan man få sin side indekseret på Google. Derfor er der ingen grund til denne kritik – man skal bare vide hvad man skal gøre!
5 Fordele ved headless CMS
- Hurtig levering af indhold
- Giver fuld kontrol over, hvordan og hvor dit indhold vises
- Sikker tredjepartsintegrationer
- Tillader udviklere at bruge deres yndlings værktøjer og udviklingssprog
- Fremtidssikker (integreres let med ny teknologi og innovation)
Hos Checkmate vil vi meget gerne være med til at fremtidssikre din hjemmeside ved at udvikle en Headless CMS løsning til jer!