Hva er Vue?

Tilbake til kompetanseguidens hovedside

Vue er et Javascript-rammeverk for frontend-utvikling. Rammeverket ble utviklet som en lettvekter-versjon av Angular, og regnes som betraktelig lettere å lære enn React. Vue brukes først og fremst til å bygge brukergrensesnitt og ensideapplikasjoner.

Vi har intervjuet høyskolelektor Rolando Gonzalez, som underviser i Vue ved Høyskolen Kristiania, og selvstendig utvikler Maximilian Øystå Lloyd, som aktivt bruker Vue i jobben.

Hva er det overordnede bruksområdet for Vue i 2020?Gonzalez:

Man lager webapplikasjoner med Vue. Vue passer utmerket i mindre prosjekter eller moduler i større enterprise-systemer.

Lloyd:

Vue vil fortsette å fylle det rommet som er mellom React og Angular. Så lenge det kjøres i en nettleser, så er Vue er gyldig kandidat. Det handler mest om personlig smak.

Hva er fordelen med Vue?Gonzalez:

Vue er et språk som det er relativt raskt å sette seg inn i når man har en fundamental forståelse for HTML, CSS og Javascript. Det føles for mange intuitivt på grunn av måten man jobber i rammeverket, som er gitt av strukturen med tett kobling mellom programmering, innhold og design.

Vue er også raskt, lite og har en god og voksende brukerbase med utvidelser tilgjengelig som dekker de fleste av de vanlige behovene ved webutvikling.

Lloyd:

• Det tar veldig kort tid å utvikle funksjonelle løsninger, dvs. hurtig utvikling
• Sammenhengende verktøy, sånn som Vuex. Det integrerer sømløst i Vue.js Dev Tools,som er ganske forfriskende når man kommer fra for eksempel React + Redux
• Lett å lære
• Ikke minst, det er kjapt!

Hva er ulempene eller begrensningene?Gonzalez:Vue er relativt nytt, og det trengs å få mer erfaring for å etablere flere og klarere retningslinjer for hvordan kode og strukturere kode. Dette gjelder kanskje spesielt i større og mer komplekse applikasjoner. Men vi ser at Vue nå kommer i nyere versjoner som også bygger videre på de erfaringene de tilsvarende rammeverkene har gjort seg.

Lloyd:

Vue vokser veldig kjapt, men det er et fortsatt en mindre community enn for eksempel React. Hvis du går inn på Stack Overflow jobs og søker på React, så er det 453 jobber. For å sammenligne har Vue 82 jobber. Så jobbmarkedet for Vue er vesentlig mindre.

Fordi det også er et yngre rammeverk, så finnes det ikke like mange plugins som til andre, og de som eksisterer vil som regel ikke være like bra maintained heller. Vue er veldig fleksibelt, og til tider kan det være en dårlig ting. Over-fleksibilitet kan føre til flere errors og uregelmessighet i koden.

Hva er typisk å utvikle med Vue, og hvilke teknologier er vanlig å bruke for å oppnå det?Gonzalez:Vue er et språk for å utvikle webapplikasjoner. Man har Vue som frontend-delen og kombinerer med Ajax for å kommunisere med en backend-del, som igjen kommuniserer med en database.

Lloyd:

Så lenge det er web-relatert, så er det typisk. Det brukes til så mange forskjellige ting. Men hvis jeg skulle gitt et svar så ville det vært «SPAs» - Single Page Applications.

Hva er kjente eksempler på populære programmer, nettsider eller funksjoner som er utviklet med Vue?

Lloyd:

Det er mange kjente nettsider som er utviklet med Vue. Noen eksempler er 9GAG, Behance, Nintendo og Louis Vuitton.

Hvilke teknologier eller verktøy er det viktig å mestre for å utnytte potensialet i Vue?Gonzalez:

Vue krever på samme måte som React og Angular at man har en grunnleggende forståelse for HTML, CSS og Javascript. Med hensyn til det sistnevnte ligger det også innbefattet at man bør ha grunnleggende programmeringskompetanse med forståelse av blant annet variabler, betingelser, Arrays, løkker og objekter.

Med tanke på at man også normalt i en webapplikasjon trenger å utføre såkalt CRUD-operasjoner (Create, Read, Update og Delete) mot en database, vil man også gjøre bruk av Ajax gjennom biblioteker som for eksempel Axios. Man jobber da med JSON og Object literals.

Lloyd:

Å ha en veldig god forståelse av Javascript, fordi det er det alle rammeverk er skrevet i. Hvis du har et godt grep på det, kan du enkelt lære deg nye rammeverk dersom populariteten fader. En felle mange går i er at de lærer seg rammeverket først, istedenfor å lære seg Javascript først, inkludert meg selv!

Hvis du forstår innmaten til rammeverket blir det mye lettere å fikse bugs som du kommer til å støte på, og du er ikke knyttet til et spesifikt rammeverk like sterkt.

Hvilke rammeverk ligner, eller er nært knyttet til Vue?Gonzalez:Vue er på flere måter ganske nærme React og Angular, blant annet gjennom konseptet om komponentbasert utvikling. Jeg vil også si at Vue er en fin måte å bli kjent med rammeverk på. Behersker man Vue, så vil det være enklere å sette seg inn i React og Angular senere, siden det er en del konsepter de har til felles.

Lloyd:

I de siste årene har det dukket opp mange rammeverk som er komponentbasert. Det vil si at ALT er en komponent. Jeg har nylig begynt å jobbe med Flutter, Google sitt rammeverk for å bygge kryssplattform-apper. Det er også helt komponentbasert, bare at de kaller det «widgets» istedet.

Det rammeverket som Vue.js ligner mest på er Angular 1.x, bare uten «controller»-biten.

Hvordan er vanskelighetsgraden og læringskurven? Hvilke forkunnskaper er det en

eventuelt en fordel å ha?

Lloyd:

Hvis du har erfaring med komponentbasert arkitektur, så er du allerede veldig langt på vei.

Det er veldig lett å lære i forhold til for eksempel React. I React så introduseres du for nye

konsepter og tankemåter som tar en stund for å synke inn.

Mens Vue derimot føles allerede litt som hjemme og tar nytte av det som du allerede er vant til. «template»-, «script»-, «style»-strukturen i Vue er et godt eksempel på det. Vue beholder «seperation of concerns» som vi allerede er vant til.

Kan du si noe om utviklingen og forhistorien til Vue?Gonzalez:Vue ble utviklet av Evan You og sluppet i første versjon 2014. Etter min forståelse utviklet han Vue inspirert på AngularJS, som senere ble dramatisk endret til Angular v. 2, osv. Han tok det han likte fra AngularJS, og hadde i tillegg sine egne tanker og preferanser rundt hvordan et rammeverk bør se ut, og resultatet ble Vue.

Lloyd:

Det ble nylig sluppet en dokumentar på Youtube om Vue for noen dager siden, som går veldig i dybden. Anbefaler alle å se den, den forklarer bedre enn jeg kan skrive!

https://youtu.be/OrxmtDw4pVI.

Hvilke råd kan du gi til en som ønsker å lære seg Vue?

Lloyd:

Lær ved å bygge en enkel løsning, en notat-app for eksempel. Det er alltid den beste måten å lære et nytt rammeverk på, fordi det gir det muligheten til å se hvor det er avvik i forhold til andre rammeverk. Jeg anbefaler å ta en titt på TodoMVC.