Email Us   Phone : 503-259-0312   
  Home    |    Instructor-led Training    |    Self-Paced Learning    |    Online Training     


Contact Us   -   Why Choose Wintrac   -   Clients    

Courses
ADA
Adobe
Agile
AJAX
Android
Apache
AutoCAD
Big Data
BlockChain
Business Analysis
Business Intelligence
Business Objects
Business Skills
C++ programming
Cisco
Citrix
Cloud Computing
COBOL
Cognos
ColdFusion
COM/COM+
CompTIA
CORBA
CRM
Crystal Reports
Data Science
Datawarehousing
DB2
Desktop Application Software
DevOps
DNS
Embedded Systems
Google Web Toolkit (GWT)
IPhone
ITIL
Java
JBoss
LDAP
Leadership Development
Lotus
Machine learning/AI
Macintosh
Mainframe programming
Microsoft technologies
Mobile
MultiMedia and design
.NET
NetApp
Networking
New Manager Development
Object oriented analysis and design
OpenVMS
Oracle
Oracle VM
Perl
PHP
PowerBuilder
Professional Soft Skills Workshops
Project Management
Rational
Ruby
Sales Performance
SAP
SAS
Security
SharePoint
SOA
Software quality and tools
SQL Server
Sybase
Symantec
Telecommunications
Teradata
Tivoli
Tomcat
Unix/Linux/Solaris/AIX/
HP-UX
Visual Basic
Visual Foxpro
VMware
Web Development
WebLogic
WebSphere
Websphere MQ (MQSeries)
Windows programming
XML
XML Web Services
Other
Vue.js Fundamentals
Overview

Learn everything you need to know to get started with Vue.js components. Web components are custom developer defined HTML elements, like <p>,<body>, or <button>, that allows us to encapsulate some functionality of our applications. Components are the puzzle pieces of a Vue.js website. Components combine blocks of HTML, JavaScript, and CSS. And as a result, they allow us to easily encapsulate and reuse functionality in our applications.

Learning Objectives
  • The idea behind components and how Vue.js components work
  • Component's template, and multiple ways to define your template
  • Communication between components with props and custom events
  • What is the true difference between global and local component registration
  • The lifecycle hooks of a component
  • Component composition with nested components and slots
  • Component's best practices and common pitfalls
Course duration

2 Days

Course outline

1 Component Basics
  • Introduction to Components
  • Component's Template
  • Reusable Components with Props
  • Nested Components
  • Global vs Local Components
  • Communication Between Components
2 Components In-depth
  • Component Naming Best Practices
  • Component Lifecycle Hooks
  • Component Slots
3 Vue.js Component Exercises
  • #1 Build a GitHub User Profile Component
  • #2 Create a Notification Message Component
4 Learn Vue.js Component Testing
  • Installing Vue Test Utils
  • Mounting Components with Vue Test Utils
  • The Wrapper Object
  • Learn How To Test Computed Properties and Watchers
  • Learn How To Test Vue.js Methods
  • Learn How to Test Vue.js Lifecycle Methods
  • Traversing The DOM
  • How to Stub a Vue.js Child Component
  • How to test that a Vuex Store is injected into a Vue.js component
5 Introduction to Vue Router
  • Vue Router overview
  • Create a new project with Vue Router using the Vue CLI UI
  • Understanding how Vue Router is setup
6 Vue Router Fundamentals
  • Creating Routes
  • How to lazy load routes with Vue Router
  • Vue Router Active Class
  • Vue Router Named Routes and Params
  • Vue Router Dynamic Routes
  • How to rerender components when vue router params changes
  • How to pass Vue Router params as props to components
  • Vue Router Nested Routes
7 Vue Router Embellishments
  • Creating a Go-Back button
  • How to create route transitions with Vue Router
  • How to create a 404 Not Found route and page with Vue Router

 
About us
Contact us
Careers at Wintrac
Our Clients
Why Wintrac


Register for a free training CD-ROM drawing
Refer a client or instructor and earn $$$


Wintrac Inc.
16523 SW McGwire Ct.
Beaverton OR 97007
 
Wintrac, Inc. All rights reserved.                                                                               Site Map   |   Terms of Use   |   Privacy Policy