VueJS Programmeren

Cursus VueJS Programmeren

In de cursus VueJS Programmeren leren deelnemers hoe ze de kracht van VueJS kunnen benutten voor hun webapplicaties. VueJS is een populair JavaScript-framework dat oorspronkelijk werd ontwikkeld voor het Laravel PHP Framework, maar inmiddels breed wordt toegepast in diverse projecten. De integratie van VueJS in een applicatie kan eenvoudig beginnen met een script tag en kan meegroeien van een paar regels code tot het volledige beheer van de view-laag. Kennis van tools zoals Babel of Webpack is niet vereist om aan de slag te gaan met VueJS, maar deze tools kunnen wel een waardevolle aanvulling zijn.

Vue Integratie

De cursus begint met de integratie van VueJS in bestaande applicaties. De deelnemers leren hoe ze VueJS kunnen implementeren en hoe ze het kunnen aanpassen aan hun behoeften. Dit biedt de flexibiliteit om eenvoudig te starten en tegelijkertijd de mogelijkheid om uit te breiden naarmate de complexiteit van de applicatie toeneemt.

Vue Components

De cursus VueJS Programmeren gaat verder met de installatie van het framework en belangrijke componenten zoals het root Vue-instance, templates, data en directives. Ook onderwerpen als two-way data binding, watchers en filters worden uitgebreid behandeld. Deze kennis is essentieel voor het creëren van dynamische en responsieve webapplicaties.

Vue Templates

Daarna bespreken we templates, virtual DOM en binding directives. De deelnemers leren ook hoe ze components, events, props, validatie en named en custom slots kunnen gebruiken. Styling met CSS en rendering met JSX staan eveneens op het programma. Deze vaardigheden zijn cruciaal voor het ontwerpen van aantrekkelijke en functionele interfaces.

Routing

Een belangrijk aspect van de cursus is routing in VueJS. Hierbij komen onderwerpen als nested, dynamic en programmatische routing aan bod. Ook de asynchrone afhandeling met promises en state management worden behandeld, wat essentieel is voor het bouwen van complexe toepassingen.

Vue Tooling en Vue Internals

Tenslotte besteden we aandacht aan VueJS tooling en de internals van VueJS. Dit biedt deelnemers een dieper inzicht in hoe VueJS werkt en hoe ze optimaal gebruik kunnen maken van de beschikbare tools en functionaliteiten.
Voor meer informatie over het ontwikkelen van webcomponenten, kunt u deze cursus over Developing Web Components bekijken. Daarnaast kan kennis van JavaScript van groot belang zijn, en hiervoor is de cursus JavaScript Programmeren zeer waardevol. Voor gevorderde gebruikers is er ook de cursus Advanced JavaScript Programmeren beschikbaar.
Voor meer informatie over VueJS, bezoek de officiële VueJS website.

Doelgroep Cursus VueJS Programmeren

De cursus VueJS Programmeren is bedoeld voor Web Developers die de nieuwste versie van het VueJS JavaScript Framework willen gebruiken bij het ontwikkelen van moderne single page Web Applicaties.

Voorkennis Cursus VueJS Programmeren

Een goede kennis van JavaScript en ervaring met JavaScript programmeren is vereist om aan de cursus VueJS Programmeren te kunnen deelnemen.

Uitvoering Training VueJS Programmeren

De theorie wordt behandeld aan de hand van presentaties. De concepten worden toegelicht met demo's. De theorie wordt afgewisseld met oefeningen. De cursustijden zijn van 9.30 tot 16.30.

Officieel Certificaat VueJS Programmeren

De deelnemers krijgen na het goed doorlopen van de cursus een officieel certificaat VueJS Programmeren.

Modules

Module 1 : VueJS Intro

• What is Vue.js
• Installation and Setup
• vue-loader and webpack
• root Vue Instance
• Options Object
• Templates, Data and Directives
• Looping in Templates
• Binding Arguments
• Reactivity
• Two Way Data Binding
• Instance Life Cycle Hooks
• Computed Properties
• Watchers
• Filters

Module 2 : Templates

• HTML-Based Syntax
• Virtual DOM
• Render Functions
• Interpolations
• Mustache Syntax
• v-once Directive
• Raw HTML
• v-html Directive
• Attributes
• v-bind Directive
• JavaScript Expressions
• Arguments
• Modifiers
• v-bind and v-on Shorthand

Module 3 : Components

• Component Basics
• Component Registration
• Props
• Data and Methods
• Computed Properties
• Prop Validation
• Data Flow
• .sync Modifier
• Passing Content with Slots
• Named and Scoped Slots
• Custom Events
• Mixins
• Non-prop Attributes
• Components and v-for

Module 4 : Styling

• Class Binding
• Object Syntax
• Inline Style Binding
• Array Syntax
• Multiple Values
• Auto-prefixing
• Multiple Values
• Scoped CSS with vue-loader
• CSS Modules with vue-loader
• Conditional Rendering
• Preprocessors

Module 5 : Rendering with JSX

• What is JSX?
• Render Function
• Nodes, Trees and Virtual DOM
• Virtual Nodes
• Tag Name
• Data Object In-Depth
• createElement Arguments
• Constraints
• Event and Key Modifiers
• Functional Components
• Template Compilation

Module 6 : Routing

• HTML5 History Mode
• Dynamic Routing
• Passing Parameters
• Nested Routes
• Redirect and Alias
• Navigation
• Active Class
• Programmatic Navigation
• Navigation Guards
• Route Order
• Route Names

Module 7 : State Management

• State Concept
• Vuex
• State Helpers
• Mutations
• Synchronicity
• Actions
• Action Helpers
• Destructuring
• Promises
• Modules
• File Structure

Module 8 : Vue Tooling

• Example Sandbox
• WebPack and NPM
• Component Scoped CSS
• Vue Test Utils
• Jest and Mocha
• Asynchronous Updates
• TypeScript Support
• Plugins
• Annotating Return Types
• Browserify
• Pre Compiled Templates

Module 9 : Vue Internals

• Reactivity in Depth
• Object.defineProperty
• Dependency Tracking
• Change Notification
• Tracking Changes
• Watchers and Rerendering
• Property Addition nor Detected
• Touch and Notify
• Change Detections Caveats
• Declaring Reactive Properties
• Async Update Queue