studier.se

Vi hjälper studier.se att hantera hundratusentals utbildningar.

Med hjälp av headlessteknik baserad på ramverken vue.js och nuxt ger vi Studier möjlighet att nå sin vision där alla utbildningar och kurser finns tillgängliga på en enda plats, oavsett om det gäller högskoleprogram, gymnasieutbildningar, kompetensutveckling eller kurser.

studier.se

Studier.se är en svensk webbplats som erbjuder information om olika utbildningar och studiemöjligheter på olika nivåer i Sverige. Sajten är en sökmotor för utbildningar och kurser på både universitets-, gymnasie- och yrkeshögskolenivå, och användarna kan söka efter utbildningar baserat på ämnesområde, geografiskt läge, utbildningsnivå och andra faktorer. Studier.se ingår i Academediakoncernen.

Vad vi gjorde

  • Helt ny frontend kodad i Vue js och Nuxt js med kopplingar mot en backend i WordPress
  • Kopplingar mot Skolverkets API med inhämtning av utbildningar
  • Avancerade sök och filterfunktioner
  • Ny design med fokus på användarvänlighet

Webb

Hitta din drömutbildning

På studier.se kan användarna hitta information om olika utbildningar, lärosäten och utbildningsanordnare, samt jämföra olika utbildningar baserat på olika faktorer. Sajten erbjuder också artiklar och guider som hjälper användarna att navigera genom utbildningsdjungeln och fatta beslut om vilken utbildning som passar deras intressen och mål.

WordPress som headless backend

Genom att vi tillförde stora mängder utbildningar till studier.se via API inhämtningen fick vi fokusera på att separera innehåll från själva presentationen av innehållet. Den gamla siten, baserad på WordPress, hanterade både innehåll och dess presentation genom sin frontend och det fungerar inte för den mängden data. Genom separationen öppnade vi också upp till att enklare kunna integrera mot andra lösningar och applikationer.

Vi behöll backend i WordPress och använde dess API för att hämta ut innehållet till frontend baserat på ramverket vue.js. Vue.js är ett progressiv tramverk för att bygga användargränssnitt (UI) för webbapplikationer. Exempel på andra ramverk är React och Angular.

Vue.js är progressivt, vilket betyder att du kan gradvis integrera det i en befintlig webbapplikation. Det gör att du kan använda Vue.js i en del av applikationen utan att behöva bygga om hela applikationen från grunden. Vidare använder Vue.js en komponentbaserad arkitektur, vilket gör det enkelt att återanvända kod och skapa återanvändbara komponenter.

Vue.js och nuxt

För att kapa utvecklingstid använde vi även nuxt, som bygger på vue.js, som är ett ”universal” ramverk, vilket innebär att det kan användas för både klient- och serversidan renderade applikationer. Nuxt erbjuder många funktioner och verktyg för att underlätta utvecklingen av webbapplikationer, inklusive en enkel konfigurationsprocess, förkonfigurerade inställningar för vanliga funktioner som SEO och server-side rendering, ett enhetstestningsramverk, hot reloading för snabb utveckling och enkla integrationer med andra verktyg och bibliotek.

Kopplingar mot externa API

För att underlätta för utvecklare och forskare att få tillgång till Skolverkets data har myndigheten gjort sitt API tillgängligt för allmänheten. Skolverkets API gav oss möjligheten att hämta data och information från Skolverkets databaser och integrera den i applikationen.

En av fördelarna med att använda Skolverkets API är att det möjliggör för oss att skapa nya och innovativa lösningar som kan förbättra för användarna av studier.se. Nya studier.se gör det enklare för elever och föräldrar att hitta information om skolor, kurser och program på ett och samma ställe.

Vill du veta mer om hur man bygger en site som konverterar riktigt bra?

Linda Brynå
Projektledning
[email protected]
0733-58 72 06