There has been an exponential increase in the number of websites, digital channels and consequently digital content in the last years. Not only are the number of websites increasing but they are also becoming more complex, therefore it is no longer feasible to handle content and code with the same tools. Content Management Systems (CMS) are the solution to this problem and offers a way of managing content. The market today offers a broad variety of solutions that each have their own advantages, one of the more common being WYSWYG-functionality which often means that the functionality and the presentation of the content are tightly coupled. "Headless" CMS are a new way of doing things and offers the user a way of managing content without presenting them with a way of displaying the content. The different types of CMS present advantages and disadvantages from a user centred point of view as well as from a technical one. The thesis aims to explore these perspectives and form a hypothesis based on the studied cases. The study presents a set of aspects that based on the context in which the CMS is used and implemented can be perceived as either advantages or disadvantages. "Headless" CMS however shows a tendency to be the preferable choice where the editors have a technical background and the developing part values an agnostic approach when implementing a CMS, whereas a traditional CMS with WYSIWYG functionality tends to be more favourable where stability and editorial freedom are valued.

Den här rapporten handlar om att ta fram en arkitektur för en publiceringskedja som använder sig av ett headless CMS. Arkitekturen ska bygga på moderna teknologier och metoder som uppfyller de krav som startups ställer idag på sina webbapplikationer: den ska vara snabb, skalbar och säker. Den ska också vara tillräckligt generell för att kunna användas till fler aolika webbplatser. / This report is about creating an architecture för a publication chain that is utilizing a headless CMS. The architecture should be based on modern technologies and methods that fulfills the demands that startups have on their web applications: it should be fast, scalable and secure. It should also be generic enough to be used for different web sites.

The purpose of the project is to create a website where Knowit Experience can present and invite people to their coding events. The work has been carried out by a larger team including project managers, UX designers, supervisors, and an Agile approach has been used. A Headless CMS called Hygraph has been used to create a structure that editors can easily use, and this CMS includes a GraphQL API that the website consumes. The website is created in React with TypeScript to create a secure typed application styled with Sass. The website handles registrations for newsletters and different event lists from users and displays the content of the editors. Several different user flows on the website have been automated using Pipedream to make it easier for editors, including automatic confirmation emails sent to those who register, and editors can easily send emails to specific mailing lists. Structure is also created in the CMS to allow editors to create dynamic forms to collect opinions and information from visitors at an event. The website has been developed with accessibility in mind and has been tested on different browsers and devices. The website is continuously tested for accessibility and correctly validated code throughout the work. The work results in a fully functional website with all intended features. / Projektets syfte är att skapa en webbplats där Knowit Experience kan presentera och bjuda in till deras event Kodkvällar. Arbetet har utförts i ett större team med projektledare, UX-designers samt handledare och arbetssättet har vart Agilt. Ett Headless CMS, Hygraph, har använts för att skapa en struktur som redaktörer enkelt kan använda och med detta CMS ingår ett GraphQL API som webbplatsen konsumerar. Webbplatsen skapas i React med TypeScript för att skapa en säker typad applikation som stylas med Sass. Webbplatsen hanterar anmälningar till nyhetsbrev och olika eventlistor från användare samt visar redaktörernas innehåll. Med Pipedream har flera olika användarflöden på webbplatsen automatiserats för att underlätta för redaktörerna. Bland annat skickas bekräftelsemail automatiskt till de som anmäler sig samt att redaktörer enkelt kan skicka ut mail till specifika maillistor. Struktur skapas även i CMSet för att redaktörer ska kunna skapa dynamiska formulär för att inhämta åsikter och information från besökarna på ett event. Webbplatsen har utvecklats med tillgänglighet i åtanke och den har testats i olika webbläsare samt på olika enheter. Webbplatsen testas kontinuerligt för tillgänglighet samt korrekt validerande kod genom hela arbetet. Arbetet resulterar i en fullt fungerande webbplats med alla tänkta funktioner.