Kurser

Fremragende4 dages kursus 
Læring inden for et specifikt emne

Vue, Vuex & Router

Kontakt os på tlf. 7220 3000 eller skriv til  kurser@teknologisk.dk for at høre mere.

Ingen planlagte afholdelser.
DKK  19.999
ekskl. moms
Nr. 90409 A
4,8
Fremragende
5 anmeldelser
Arrangementer på Teknologisk Institut bliver evalueret af deltagerne. Stjernerne angiver deltagernes gennemsnitlige tilfredshed inden for de sidste 5 år.
Available in English

Kurset tager et dybdegående kig på Vue.js-frameworket. Vue.js er kendt som det mest tilgængelige JavaScript-framework, som stadig har høj ydeevne og er nemt at vedligeholde. Kurset vil dække alle de primære elementer med over 200 eksempler og masser af øvelser. Kurset afholdes på engelsk.

Deltagerprofil

Kurset er beregnet til professionelle udviklere, som har erfaring med HTML- og JavaScript 5-programmering.

Udbytte

  • Vue.js architectural concepts and creating and testing Vue.js apps
  • Essential JavaScript 202X for Vue.js
  • Creating reusable components and templates with interpolations and directives
  • Declarative rendering, conditional and listrendering
  • Handling properties and events and working with forms
  • Composition API, Vue CLI, Vue Routing and navigation and Dynamic and Asynchronous components
  • Debugging and Developer Tools
  • State management with Provide/Inject and Vuex

Det får du på kurset

Vi sørger for, at rammerne er i orden, så du kan fokusere på at lære.

Hos Teknologisk Institut bruger vi kun erfarne undervisere.

Erfaren underviser

På kurset får du morgenmad, frokost, snacks og drikkevarer.

Fuld forplejning

På kurset er der indtænkt øvelser og deltagerinddragelse.

Øvelser og inddragelse

Kursusmateriale er inkluderet i prisen.

Materiale

Materiale på engelsk

Materiale på engelsk

Undervisning på engelsk

Undervisning på engelsk

Tæt på kursusstedet er der gratis parkering.

Gratis parkering

Indhold

Introduction
  • What is Vue.js?
  • Why Vue.js?
Module 1: Language constructs for Vue.js
  • EcmaScript 202X (JavaScript): The relevant features for Vue.js
  • Class syntax
  • Spread operator
  • Arrow functions
  • Object destructuring
  • Option: TypeScript
Module 2: Data binding
  • Data to View: Content, Attributes.
  • View to Data: Events changing data or calling - functions
  • Styling: Class and Style attributes
Module 3: Rendering

  • Conditional Rendering
    - if
    - if-else
    - show

  • List Rendering
    - Array
    - Iterable
    - Object
    - Key (how to use)

Module 4: Adjusted values
  • Computed Values
  • Watchers
  • Option (version 2 only): Filters
    - With and without parameters
    - Chaining
Module 5: Components
  • Registration: Global vs Local
  • Render
  • Template
  • Data
Module 6: Multiple components

  • Properties
    - Types, Required & Validation
    - Default values
    - Naming

  • Custom Events

Module 7: Forms
  • Event, key and other modifiers
  • Input bindings
  • v-model (2-way databinding)
Module 8: Vue CLI & Debugging
  • Vue CLI
    - Advantages
    - Commands
  • Vue DevTools
  • Using the browser's DevTools
  • VSCode debugging
  • Webpack
Module 9: Slots
  • Single
  • Multiple
  • Default value
  • Scoping
Module 10: Dynamics
  • Attributes
  • Events
  • Slots names
  • Dynamic components
  • Async components
Module 11: Going deeper
  • Composition API
  • Suspense
  • Accessing DOM
  • Optional: Teleports
Module 12: Lifecycle
  • Creation, Destroying
  • Mounting, Updating, Activation
  • With mixins
Module 13: Patterns
  • Error Boundaries
  • Higher-Order Components
  • Renderless Components
  • Mixins
  • Container Components
Module 14: Performance
  • Lazy loading
  • Functional Components
  • v-once
  • v-pre
  • v-cloak
Module 15: Renderfunction and JSX
  • Render() vs Template
  • JSX vs HTML
  • JSX vs JS
Module 16: Router
  • Static routing
  • Dynamic routing
  • Nested routes
  • No match (like a 404)
  • Passing props
  • Lazy loading
  • Named routes & views
  • Navigation guards
  • Optional: Programmatic navigation
  • Optional: Transitions
  • Optional: Data fetching
Module 17: Vuex
  • Store
  • Getters
  • Mutations
  • Actions
  • Modules
Module 18: Vuex with Vue
  • mapState, mapGetters, mapMutations
  • Reactivity
Appendix 1: Animations
  • State Transitions
  • List Transitions
Appendix 2: Testing
  • Unit Tests
  • Storybook
Appendix 3: Maintainable Projects
  • Best practices
  • Code organisation
Appendix 4: Custom Directives
Appendix 5: Plugins
Appendix 6: Server Side Rendering
  • Universal code
  • Routes
  • Data pre-fetching
  • Client Side Hydration

Anmeldelser af Vue, Vuex & Router

4,8
 
Fremragende Baseret på 5 anmeldelser
Arrangementer på Teknologisk Institut bliver evalueret af deltagerne. Stjernerne angiver deltagernes gennemsnitlige tilfredshed inden for de sidste 5 år.
Fremragende
Meget godt
Godt
Mindre godt
Ikke godt
Underviseren er super kompetent og super dygtig til at lære fra sig. Hans undervisningsmateriale er ud over al forventning. Han har virkelig styr på hvad han snakker om, og alle spørgsmål blev besvaret.
 - Morten Hoffmann Skandinavisk Motor Co. A/S

Form

Workshop. Der bruges dias, masser af øvelser og mere end 200 eksempler. Kurset afholdes på engelsk

Se vores udvalg af kurser i webudvikling her.

Bemærk

Kurset dækker altid den nyeste version og de bedste eller mest populære fremgangsmåder. Men kurset kan stadig følges, hvis du bruger en lidt ældre version.

Eksempler og øvelser til ældre versioner er også i kursusmaterialet, hvis det er relevant. Efter kurser kan du med det samme føje Vue-dele til både nye og eksisterende websteder.

28667
Underviser

Rick Beerendonk

4.78/5 (79 evalueringer) 
Baseret på alle evalueringer af underviseren fra de seneste 5 år.

Rick er seniorkonsulent og underviser fra Holland. Han har over 25 års professionel erfaring med at arbejde i små og store organisationer samt organisationer, der er i kraftig vækst. Hans passion er enkelhed, velskrevet kode og teamdynamik. Han er specialiseret i front-end-teknologier, og han taler ofte om disse emner ved internationale begivenheder.

Billede der illustrerer kurset

Firmakurser - få et tilbud

Er I flere, der har samme behov for kompetenceudvikling, så er et firmakursus ofte den rette løsning, der kan skabe fælles fundament og økonomisk besparelse.