Lær Vue: kod & bygg
Lær Vue: kod & bygg — Lær Vue.js ved å bygge komponenter på telefonen
Lær Vue: kod & bygg er en gratis iOS- og Android-app du kan komme i gang med, som lærer nybegynnere med litt HTML og JavaScript Vue.js, og utviklere som går fra Options API til Composition API. Den inneholder 42 kurs og 156 leksjoner – fra den første malen din til Pinia, Vue Router og Nuxt 3 – og single-file components kompileres på enheten din, slik at de 20 veiledede prosjektene, oppdragene og Vue Lab fungerer uten en server.
- Pris
- Gratis, Pro-oppgradering
- Plattformer
- iOS og Android
- Språk
- 22
- Aldersgrense
- 4+
- Versjon
- 82.6.0
- Krever
- iOS 15.1 eller nyere
- App Store
- 3.0 ★ (2)
Det er lettere å forstå en komponent når du først har ødelagt en.
Vue Lab gir deg en ødelagt komponent hver dag og ber deg finne feilen, lar deg justere props i en komponent med kontroller som oppdateres direkte, og viser hvordan state endres når du klikker. Single-file components kompileres på telefonen, så forhåndsvisningen går i stykker og repareres rett foran deg, med et feilkort som forklarer hva som gikk galt.
Hva det er
Lær Vue: kod & bygg er en gratis iOS- og Android-app som lærer bort Vue.js gjennom 42 kurs og 156 leksjoner – fra malsyntaks og databinding via Composition API, Pinia, Vue Router og TypeScript til Nuxt 3, testing med Vitest og fullstack-apper. Single-file components kompileres på enheten, slik at veiledede prosjekter, kodeoppdrag og et praktisk Vue Lab fungerer på telefonen uten server, mens en AI-mentor i Pro forklarer kode og feil.
Inne i appen
Slik ser den ut
Kurset
Dette dekker Vue-kurset
42 kurs og 156 leksjoner fra appens egen kursliste, fra den første templaten til server-rendering og produksjonsmønstre.
Kom i gang med Vue.js
Introduksjon til Vue.js, Vue CLI og prosjektstruktur, templatesyntaks og databinding.
Reaktivitet og Composition API
Grunnleggende om Vue 3 Composition API, script setup-syntaksen, reaktivitet og computed-egenskaper samt Vue-direktiver.
Komponenter og skjemaer
Grunnleggende om komponenter og kommunikasjon mellom dem, slots, provide og inject, skjemaer og validering samt komponentenes livssyklus.
Gjenbruk og finpuss
Vue 3 composables, overganger og animasjoner, feilhåndtering samt render-funksjoner og JSX.
Tilstand og ruting
Tilstandshåndtering med Pinia, Vuex, ruting med Vue Router og avanserte rutemønstre samt håndtering av API-er og asynkrone data.
TypeScript, i18n og verktøy
TypeScript med Vue 3, internasjonalisering, Storybook-integrasjon samt utrulling og vedlikehold av Vue-apper.
Nuxt 3, testing og sanntid
Server-side rendering med Nuxt 3, komponenttesting med Vitest, GraphQL med Apollo og sanntidsapper med WebSockets.
Produksjonsmønstre
Ytelse, beste praksis for sikkerhet, plugin-utvikling, publisering av et komponentbibliotek, progressive webapper og mikrofronter.
Slik fungerer det
Slik foregår Vue-læringen i appen
Hvert kurs har et nivå, og hver leksjon etter det første gratiskurset starter med en gratis forhåndsvisning, slik at du kan se hvordan et tema er, før du bestemmer deg for å gå videre.
Start med Introduction to Vue.js
Det første kurset er gratis og begynner med hva Vue er, oppsett av miljøet og en Hello Vue-applikasjon. Kursene er merket fra A1 til C1, så det er tydelig hvor du skal begynne, og hva som kommer videre.
Bygg og kjør komponenter på telefonen
Rediger en single-file component og forhåndsvis den med én gang. Veiledede prosjekter bygger ut en app steg for steg, og App Studio lar deg lage apper med flere skjermer, en router og en store ved hjelp av ferdige blueprints.
Øv i Vue Lab
Finn dagens feil, gjenskap et mål-design i Style Lab, konkurrer mot klokken i speed-build-dueller eller skriv om en Options API-komponent i Composition-stil.
Hva den inneholder
Dette følger med appen
42
Kurs, 156 leksjoner
Fra malsyntaks og direktiver via livssyklus, slots, provide og inject og composables til Nuxt 3, GraphQL, PWA-er og micro-frontends.
20
Veiledede prosjekter
Bygg ut en app steg for steg, med single-file components som kompileres direkte på enheten din, og et feilkort når en forhåndsvisning går i stykker.
28
Kodeoppdrag
Øvelser fra enkelt til vanskelig, i tillegg til App Studio-blueprints for apper med flere skjermer, en router og en store.
Lab
Vue Lab
En inspeksjon av reaktivitet, en daglig jakt på feil, 12 Style Lab-nivåer, speed-build-dueller, en dojo for å gå fra Options API til Composition API og et My Components-bibliotek som du kan dele som et bildekort.
Intervju
Vue-intervjuspørsmål
Spørsmål for intervjuer med front-end-utviklere, med quizer, repetisjonsøkter med flashcards og et jukseark du kan åpne når som helst.
AI
AI-mentor (Pro)
Spør om et konsept eller en feil, få koden din forklart, eller lag en tilpasset leksjon om et hvilket som helst tema du vil studere.
Bakgrunn
Hva er Vue.js, og hva bør en nybegynner lære først?
Vue er et JavaScript-rammeverk for å bygge interaktive webgrensesnitt av komponenter: små, gjenbrukbare deler som hver har ansvar for litt mal, logikk og stil. Det er nybegynnervennlig fordi du får en myk start: Du kan begynne med vanlig HTML og litt JavaScript og legge til struktur etter hvert. En fornuftig rekkefølge er maler og databinding, deretter reaktivitet og komponenter, så Composition API, og først etter det ruting, state-håndtering og server-rendering.
Reaktivitetideen i sentrum
Du endrer en dataverdi, og skjermen som avhenger av den, oppdateres automatisk. Når du forstår hvilke verdier som er reaktive, og hva computed properties og watchers tilfører, forsvinner det meste av den innledende forvirringen i Vue.
Options API og Composition APIto måter å skrive en komponent på
Det eldre Options API grupperer kode etter type, for eksempel data og metoder. Composition API med script setup grupperer den etter funksjon og gjør det enkelt å lage gjenbrukbare composables. Mange veiledninger og kodebaser bruker fortsatt begge, så det er nyttig å kunne lese begge.
Pinia, Vuex og routerendet en ekte app trenger i tillegg
Når en app har flere skjermer, trenger den ruting for å bevege seg mellom dem og en delt store for data som brukes av mer enn én komponent. Pinia er den nåværende store-løsningen for Vue, mens Vuex er den tidligere løsningen som fortsatt finnes i mange eksisterende prosjekter.
Nuxt og server-renderingnår søk og hastighet er viktig
Nuxt bygger videre på Vue for å rendre sider på serveren, noe som gir raskere første lasting og bedre synlighet i søk. Dette er vanligvis et tema for steg to, etter at komponenter, ruting og state føles komfortabelt.
Passer
Hvem den er for – og ikke for
Passer godt for deg hvis du
- Kan litt HTML og JavaScript og vil lære et første rammeverk
- Er på vei fra Options API til Composition API, eller fra Vuex til Pinia
- Forbereder deg til et Vue.js-utviklerintervju eller din første jobb innen frontend
- Lærer bedre ved å fikse en ødelagt komponent enn ved å lese om den
- Vil ha korte økter som passer på vei til jobb eller skole
Ikke riktig verktøy for deg hvis du
- Har aldri sett HTML eller JavaScript – begynn med et JavaScript-kurs først
- Vil lansere en produksjonsapp fra telefonen – en bærbar datamaskin er fortsatt stedet der det skjer
- Forventer at alt er gratis: Det første kurset og forhåndsvisningene er gratis, mens Pro låser opp hele læreplanen
- Vil ha offisielt Vue.js-materiale – dette er en uavhengig læringsapp
Spørsmål
Ofte stilte spørsmål
Hva er den beste måten å lære Vue.js på telefonen?
Lær ved å kjøre komponenter i stedet for bare å lese om dem. Lær Vue: kod & bygg kompilerer single-file-komponenter på enheten, slik at de 20 veiledede prosjektene, 28 oppdragene og Vue Lab alle kan kjøres på telefonen. Korte leksjoner fordelt på 42 kurs tar deg fra templatesyntaks til Nuxt 3, med et første gratiskurs du kan begynne med.
Lærer appen bort Composition API og Pinia?
Ja. Lær Vue: kod & bygg har kurs i grunnleggende Vue 3 Composition API, script setup-syntaksen, composables og tilstandshåndtering med Pinia, i tillegg til den eldre Vuex for eksisterende prosjekter. En dojo for Options til Composition API i Vue Lab lar deg skrive om klassiske komponenter i den moderne stilen.
Hva er forskjellen mellom Options API og Composition API i Vue?
Options API grupperer koden i en komponent etter type, for eksempel data, methods og computed, mens Composition API med script setup grupperer den etter funksjon og gjør det enkelt å gjenbruke composables. Lær Vue: kod & bygg lærer bort Composition API med script setup og inkluderer en dojo for Options til Composition API i Vue Lab, der du kan skrive om klassiske komponenter i den moderne stilen.
Må jeg kunne JavaScript før jeg lærer Vue?
Det er til stor hjelp å kunne litt HTML og JavaScript. Lær Vue: kod & bygg er laget for nybegynnere som kan det grunnleggende og vil lære sitt første rammeverk, så appen forklarer Vue-konsepter fra bunnen av, men lærer ikke bort JavaScript i seg selv. Hvis variabler og funksjoner er nytt for deg, bør du ta et JavaScript-kurs først.
Hva er Vue Lab?
Vue Lab er øvingsområdet i Lær Vue: kod & bygg. Det inneholder en reaktivitetsinspektør, en daglig bugjakt med en ødelagt komponent, nivåer i Style Lab der du gjenskaper et måldesign med CSS, dueller i hurtigbygging, en dojo for Options til Composition API og et My Components-bibliotek med det du har bygget.
Dekker det Nuxt 3 og server-side rendering?
Ja. De avanserte kursene i Lær Vue: kod & bygg dekker server-side rendering med Nuxt 3, SSR-streaming med Suspense og fullstack-Vue med Fastify og autentisering, i tillegg til komponenttesting med Vitest og sanntidsapper med WebSockets.
Hjelper det med Vue.js-intervjuer?
Ja. Lær Vue: kod & bygg inneholder Vue-intervjuspørsmål for frontendutviklerstillinger, sammen med quizer, repetisjonsøkter med flashkort og et jukseark. Kursene bak dette dekker reaktivitet, livssyklus, composables og tilstandshåndtering – vanlige temaer i intervjuer.
Er Lær Vue: kod & bygg gratis?
Det er gratis å laste ned. Det første kurset, en forhåndsvisning av hver leksjon, det første veiledede prosjektet, det første oppdraget, den daglige bugjakten, tre nivåer i Style Lab, quizer, intervjuspørsmål og juksearket er gratis, og gratisversjonen viser annonser. Pro låser opp hele læreplanen og hele laben, AI-mentoren og sertifiseringseksamen, og fjerner annonser.
Er appen laget av Vue.js-teamet?
Nei. Lær Vue: kod & bygg er en uavhengig læringsapp og er ikke tilknyttet eller godkjent av Vue.js-prosjektet. Den lærer bort Vue.js som et åpen kildekode-rammeverk gjennom egne kurs og øvelser.
Finnes det et sertifikat?
Ja. Når du består avsluttende eksamen, som er en del av Pro, får du et fullføringssertifikat. Det viser arbeidet du har lagt ned, og er ikke en akkreditert kvalifikasjon, så det fungerer best sammen med komponenter og prosjekter du kan forklare.
Hvilke plattformer og språk støtter den?
Lær Vue: kod & bygg fungerer på iPhone via App Store (iOS 15.1 eller nyere) og på Android via Google Play. Grensesnittet er tilgjengelig på 22 språk, og appen har aldersvurderingen 4+ i App Store.
Kom i gang
Bygg din første Vue-komponent i dag
Gratis å komme i gang på iOS og Android, på 22 språk.
Mer fra CoddyKit
Tilgjengelig på iOS og Android.