Opleiding: VueJS Programmeren
In de cursus VueJS Programmeren leren de deelnemers het VueJS JavaScript Framework te gebruiken bij het ontwikkelen van moderne single page Web Applicaties.Vue Integratie
VueJS ging van start als onderdeel van het ecosysteem van het bekende Laravel PHP Framework, maar wordt nu ook veel daarbuiten gebruikt. De integratie van VueJS in een applicatie kan starten met een simpele script tag en kan dan meegroeien met de behoefte van 3 regels code tot het managen van de gehele view laag. Kennis van Babel of Webpack is niet nodig om met VueJS te starten, maar VueJS kan met deze tools goed samen werken.
Vue Components
De cursus VueJS gaat van start met bespreking van de installatie van het Framework en belangrijke componenten zoals het root Vue instance, templates, data en directives, two way data binding, watchers en filters.
Vue Templates
Vervolgens wordt ingegaan op templates, virtual DOM en binding directives. Ook het gebruik van components, events, props, validatie en named en custom slots komen aan de orde. Styling met CSS staat op het cursus programma evenals rendering met JSX.
Routing
Vervolgens wordt aandacht besteed aan routing in VueJS, waarbij nested, dynamic en programmatische routing aan de orde komen. Ook asynchrone afhandeling met promises en state management komen aan de orde.
Vue Tooling en Vue Internals
Tenslotte is er aandacht voor VueJS Tooling en wordt ingegaan op de internals van VueJS.
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
