TypeScript
Solid foundations for developing applications in TypeScript
1 d
Fundamental
VUEJS
Vue.js
Solid foundations for developing applications with Vue.js
✓ Official training SFEIR InstituteLevel Intermediate⏱️ 2 days (14h)
What you will learn
- Develop a Vue application
- Implement tests to ensure long-term maintainability
- Understand the entire Vue ecosystem (external libraries)
Prerequisites
- Modern JavaScript (scope, arrow function, class, 'this' concept, asynchronous programming with promises)
- TypeScript, or basic knowledge (basic typing)
Target audience
- Frontend developers, Full-stack JavaScript / Node.js developers, Web developers interested in developing a Vue application, Anyone interested in developing a Vue application
Training Program
13 modules to master the fundamentals
Topics covered
- →Speaker presentation
- →Round table for everyone to get to know each other
- →Presentation of the training outline
Topics covered
- →IDE configuration: Webstorm vs Vscode
- →What Vue looks like
- →Vue tooling
- →The difference between Composition API and Options API
Activities
Bootstrap a Vue application
Integrate an external library into Vue
Topics covered
- →The Vue instance
- →Deep Dive into creating a Vue instance
- →The different lifecycle hooks of a Vue instance
- →The different types of properties (non-reactive, reactive, computed, methods)
- →The difference between computed and watcher
- →Vue components (local components, global components)
- →Deep Dive into Vue's reactivity
Activities
Create your first components
Topics covered
- →DataBinding (the different types of databindings)
- →Difference between property and attribute
- →The Composition API (What is it for?, How to implement it?, How to get the most out of it)
Activities
Display a person in a card
React to a button click event to display another person randomly.
Topics covered
- →The native fetch client
- →The axios client
- →Making the right choice for your http client
- →The Suspense API and asynchronous component
Activities
Make a server call to display a person
Make a server call on a button click event
Topics covered
- →Understanding routing (The routing philosophy in a CSR-type app, Basic routing configuration in Vue)
- →Configuring a router
- →Navigating in your application
Activities
Set up a routing system within a Vue application
Navigate to a default route
Navigate to a specific route
Topics covered
- →Built-in directives (v-if, v-for, template)
Activities
Using the v-for directive to create a list view of people
Topics covered
- →Parent-Child Communication (The defineProps function, Making inputs required by type)
- →Child-Parent Communication (The defineEmits function, Making event emitter parameters required by type)
Activities
Create a customizable component using Input and Output
Topics covered
- →Form basics (the v-model directive, modifiers)
- →Creating custom form components
- →Template Driven Form with Veelidate (High order components, Validation with Veelidate, Performance with Veelidate)
Activities
Create a form
Create an update form
Create a form with Veelidate
Topics covered
- →Reactive Form with Vuelidate
- →The Composition API with Vuelidate
- →Validation with Vuelidate
- →Performance with Vuelidate
- →Creating your own validation rules
- →Destructured forms
Activities
Create a form with Vuelidate
Implement validation
Topics covered
- →Keyboard modifiers
- →The directive (Directive lifecycle, Directive parameters, Local directives, Global directives)
Activities
Create a directive
Topics covered
- →Store management
- →Managing your store with Pinia (state, actions, selectors)
Activities
Set up a store with Pinia
Topics covered
- →Lazy loading components with routing
- →Dynamically display components
- →Cache already rendered dynamic components
Activities
Lazyload components using the router
Related Trainings
Upcoming sessions
Quality Process
SFEIR Institute's commitment: an excellence approach to ensure the quality and success of all our training programs. Learn more about our quality approach
Teaching Methods Used
- Lectures / Theoretical Slides — Presentation of concepts using visual aids (PowerPoint, PDF).
- Technical Demonstration (Demos) — The instructor performs a task or procedure while students observe.
- Guided Labs — Guided practical exercises on software, hardware, or technical environments.
Evaluation and Monitoring System
The achievement of training objectives is evaluated at multiple levels to ensure quality:
- Continuous Knowledge Assessment : Verification of knowledge throughout the training via participatory methods (quizzes, practical exercises, case studies) under instructor supervision.
- Progress Measurement : Comparative self-assessment system including an initial diagnostic to determine the starting level, followed by a final evaluation to validate skills development.
- Quality Evaluation : End-of-session satisfaction questionnaire to measure the relevance and effectiveness of the training as perceived by participants.
Train multiple employees
- Volume discounts (multiple seats)
- Private or custom session
- On-site or remote