Mid Sweden University

miun.sePublications
Change search
CiteExportLink to record
Permanent link

Direct link
Cite
Citation style
  • apa
  • ieee
  • modern-language-association-8th-edition
  • vancouver
  • Other style
More styles
Language
  • de-DE
  • en-GB
  • en-US
  • fi-FI
  • nn-NO
  • nn-NB
  • sv-SE
  • Other locale
More languages
Output format
  • html
  • text
  • asciidoc
  • rtf
Alster på Alster: Webbutveckling på Alster Digital AB
Mid Sweden University, Faculty of Science, Technology and Media, Department of Information Systems and Technology.
2022 (Swedish)Independent thesis Basic level (university diploma), 10 credits / 15 HE creditsStudent thesis
Abstract [en]

A startup that offers visitors the opportunity to book activities and adventures has an existing Wordpress page but will now switch to a Headless CMS as they do not want to be bound to Wordpress. Storyblok is the Headless CMS platform that will be used. The existing website consists of content and posts, and these will be migrated to Storyblok programmatically. A website will be built using the front-end framework Vue and NuxtJS. The design of the website will be created with Figma and accessibility will be kept in mind during the design and development phase. A website with minmal functionality was created that consumes the posts from Storyblok. The website was built with accessibility in mind. In addition to a website, functionality was also developed for a completely different project and company. This company is also a startup that focuses on selling vitamins. This project is created in React and unlike the adventure company, there are also other developers working with it. People who visit their web shop are met by a questionnaire where they can answer a variety of questions. Based on the answers, a vitamin recommendation is made that suits that particular person. In the current admin interface, where questions are created and edited, there is no visual indication of which questions are base- or sub-questions. This is solved by printing the base questions on the left and the sub-questions on the right. In addition, the questions are printed as a details element to show more information about each question without having to go into them separately. Backend functionality was implemented to save order on the sub-questions. An investigation was conducted to see what the connection between Shopify and the machine that packages the vitamins

Abstract [sv]

En startup som erbjuder besökare möjlighet att boka sig in på aktiviteter och äventyr samt läsa reportage har en befintlig Wordpress-sida men ska nu gå över till ett Headless CMS då de inte vill vara låsta till Wordpress. Storyblok är Headless CMS-plattformen som kommer användas. Den befintliga hemsidan har innehåll och inlägg, och dessa ska exporteras till Storyblok programmatiskt. En hemsida ska byggas med hjälp av frontend-ramverket Vue och NuxtJS. Designen till hemsidan ska skapas med Figma och tillgänglighet ska vara i åtanke under design- och utvecklingsfasen. En hemsida med minimal funktionalitet skapades som konsumerar inläggen från Storyblok. Hemsidan byggdes med tillgänglighet i åtanke. Utöver en hemsida utvecklades även funktionalitet för ett helt annat företag och projekt. Detta företag är också en startup som säljer vitaminer. Detta projekt är skapat i React och tillskillnad från äventyrsföretaget så finns det även andra utvecklare. Personer som besöker deras webbshop möts av ett frågeformulär där de får svara på en mängd olika frågor. Baserat på svaren så görs en vitaminrekommendation som passar just den personen. I det nuvarande administrationsgränssnittet, där frågor skapas och redigeras, finns det ingen visuell indikering på vilka frågor som är basfrågor eller underfrågor. Detta åtgärdas genom att skriva ut basfrågorna till vänster och underfrågorna till höger. Dessutom skrivs frågorna ut som ett details-element för att visa mer information om varje fråga utan att behöva gå in på dem separat. Backend-funktionalitet implementerades för att spara ordningen på underfrågorna. En undersökning gjordes för att se hur kopplingen mellan Shopify och en maskin som förpackar vitaminerna kunde se ut.

Place, publisher, year, edition, pages
2022. , p. 41
Keywords [sv]
Nuxt, Headless CMS, Storyblok
National Category
Computer Engineering
Identifiers
URN: urn:nbn:se:miun:diva-45172Local ID: DT-V22-G2-036OAI: oai:DiVA.org:miun-45172DiVA, id: diva2:1666958
Subject / course
Computer Engineering DT1
Educational program
Web Development TWEUG 120 higher education credits
Supervisors
Examiners
Available from: 2022-06-09 Created: 2022-06-09 Last updated: 2022-06-09Bibliographically approved

Open Access in DiVA

No full text in DiVA

Search in DiVA

By author/editor
Ojaskivi, Tommi
By organisation
Department of Information Systems and Technology
Computer Engineering

Search outside of DiVA

GoogleGoogle Scholar

urn-nbn

Altmetric score

urn-nbn
Total: 114 hits
CiteExportLink to record
Permanent link

Direct link
Cite
Citation style
  • apa
  • ieee
  • modern-language-association-8th-edition
  • vancouver
  • Other style
More styles
Language
  • de-DE
  • en-GB
  • en-US
  • fi-FI
  • nn-NO
  • nn-NB
  • sv-SE
  • Other locale
More languages
Output format
  • html
  • text
  • asciidoc
  • rtf