Kurser

Kursusadministration

Brug for hjælp?

  • Gregersensvej 8
  • 2630 Taastrup
Google MapsApple MapsRejseplanen
  • Forskerparken Fyn, Forskerparken 10F
  • 5230 Odense M
Google MapsApple MapsRejseplanen
  • Teknologiparken Kongsvang Allé 29
  • 8000 Aarhus C
Google MapsApple MapsRejseplanen
  • NordsøcentretPostboks 104
  • 9850Hirtshals
Google MapsApple MapsRejseplanen
  • Gammel Ålbovej 1
  • 6092Sønder Stenderup
Google MapsApple MapsRejseplanen

Vue.js, Vuex & Router

Kurset tager et grundigt og dybdegående kig på det fremadskridende Vue.js framework. Vue.js er kendt som det mest tilgængelige JavaScript Framework samtidig med at være produktiv og nem at vedligeholde.

Deltagerprofil

This course is intended for professional developers who are familiar with HTML and JavaScript 5 programming.

Udbytte

  • Vue.js architectural concepts
  • Creating and testing Vue.js apps
  • Essential JavaScript 202X for Vue.js
  • Creating reusable components
  • Declarative rendering
  • Templates with interpolations and directives
  • Conditional and list rendering
  • Handling properties and events
  • Working with forms
  • Dynamic and Asynchronous components
  • Debugging and Developer Tools
  • Patterns
  • Vue Routing and navigation
  • Vue CLI
  • Vuex state management

Aside: After Vue 3 is released, the new functionality will be mixed more and more with the topics, to reflect the most popular way problems are solved and to match current day popular practices.

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
  • More...
  • Option (future): 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
    • Object
    • Key
Module 4: Adjusted values
  • Filters
    • With and without parameters
    • Chaining
  • Computed Values
  • Watchers
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
Module 9: Router
  • Static routing
  • Dynamic routing
  • Nested routes
  • No match (like a 404)
  • Passing props
  • Lazy loading
  • Named routes & views
Module 10: Slots
  • Single
  • Multiple
  • Default value
  • Scoping
Module 11: Dynamics
  • Attributes
  • Events
  • Slots names
  • Dynamic components
  • Async components
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
Module 15: Render function and JSX
  • Render() vs Template
  • JSX vs HTML
  • JSX vs JS
Module 16: Reactivity
  • Issues with Arrays and Objects
  • Deep insights
Module 17: Vue v3 (Future)
  • Composition API
  • Suspense
  • Portals
  • (whatever is added)
Module 18: Vuex
  • Store
  • Getters
  • Mutations
  • Actions
  • Modules
Module 19: Vuex with Vue
  • mapState, mapGetters, mapMutations
  • Reactivity
Module 20: Animations
  • State Transitions
  • List Transitions
Module 21: Server Side Rendering
  • Universal code
  • Routes
  • Data pre-fetching
  • Client Side Hydration
Module 22: Router Advanced
  • Programmatic navigation
  • Navigation guards
  • Transitions
  • Data fetching
Module 23: Testing
  • Unit Tests
  • Storybook
Module 24: Maintainable Projects
  • Best practices
  • Code organisation
Appendix
  • Appendix 1: Vue Instance
  • Data
  • Methods
  • Appendix 2: Custom Directives
  • Appendix 3: Plugins

Form

This course will cover all major parts with over 200 examples and many exercises. The course will be held in English.

Instructor

Underviser Rick Beerendonk
Rick is a senior consultant and trainer from The Netherlands. He has over 20 years of professional experience while working in small, large and fast growing organisations. His passion is simplicity, well-written code and team dynamics. He is specialised in front-end technologies and speaks regularly about these topics at international events.

Se vores udvalg af kurser i webudvikling her.

Aktuelt online kursus

Online kurset "Vue.js" kunne også være interessant for dig.

Har du faglige spørgsmål, så kontakt:
Andre kigger også på