8351  Reviews star_rate star_rate star_rate star_rate star_half

Introduction to Vue.js

This 2 day course is designed to get you started building small to intermediate sized front end applications for browsers. The course is structured to match the philosophy of Vue, that is, adopt Vue...

Read More
By Request
$1,460 USD
Duration 2 days
Course Code WA2937
Available Formats Classroom

Overview

This 2 day course is designed to get you started building small to intermediate sized front end applications for browsers. The course is structured to match the philosophy of Vue, that is, adopt Vue incrementally. You start by adding small functionalities to an existing application. Later you’ll learn to build more ambitious Single Page Application (SPA).

Who Can Benefit

Developers responsible for building web based frontend UI applications.

Prerequisites

  • Good knowledge of JavaScript.
  • Knowledge of the usual web frontend technologies like HTML, CSS and AJAX.

Course Details

Outline

Chapter 1. Introduction to Vue.js

  • What is Vue.js?
  • What Makes Vue.js Unique?
  • Progressive Adoption of Vue.js
  • Using Vue.js
  • Hello World
  • The Vue Instance
  • Data Binding Basics
  • Binding to an Attribute
  • Computed Property
  • A Note About ES6 Object Literal
  • Event Handling
  • More About Events
  • Introduction to Components
  • Example Component
  • Differences Between Vue Instance and Component
  • Summary

Chapter 2. Template Syntax

  • What is a Template?
  • Showing Data
  • Using Expressions
  • Rendering HTML Text
  • Setting Element Attributes
  • Conditionally Showing Elements
  • v-else-if and v-else
  • v-show
  • Rendering a List
  • Using v-for
  • Getting the Loop Index
  • Identifying Each Item
  • Event Handling Inside a Loop
  • Grouping Sibling Elements
  • Registering Event Handlers
  • Event Modifiers
  • Conditional CSS Styling
  • Supply Class Array
  • Inline Styles
  • Summary

Chapter 3. Working With Forms

  • Two Way Data Binding
  • Example Two Way Data Binding
  • Checkbox
  • Bind a Non-boolean Property
  • Radio Button
  • Radio Buttons from a Dynamic List
  • Select Dropdown
  • Binding an Object to Select
  • Working With Numbers
  • Handle Form Submission
  • Handling Input Change Event
  • Summary

Chapter 4. Vue Components

  • Introduction to Components
  • Declaring a Component
  • The Vue.component() Method
  • Using a Component
  • Component State
  • The Component Tree
  • Single Root Element
  • Passing Data to a Child Component
  • Supplying the Input
  • Raising Events
  • Example: Raising an Event
  • Handling the Event from the Parent
  • Obtaining Reference to a Child Component
  • Summary

Chapter 5. Lifecycle Hooks

  • Lifecycle
  • Common Lifecycle Hooks
  • Example: Component Lifecycle Hooks
  • Use the Component
  • Example: Vue Instance Lifecycle
  • Other Lifecycle Hooks
  • Summary

Chapter 6. Single File Component

  • Shortcomings of Regular Components
  • What is Single File Component (SFC)?
  • Example Single File Component
  • The .vue File Syntax
  • Using a SFC
  • Steps to Use a SFC
  • Vue Command Line Interface (CLI)
  • Installing Vue CLI
  • Developing SFC
  • Editor Extensions
  • Summary

Chapter 7. Single Page Application (SPA)

  • What is a Single Page Application (SPA)
  • Example SPA Workflow
  • Traditional Web Application Capabilities
  • Single Page Application Advantages
  • SPA Challenges
  • Overview of SPA Using Vue Router
  • Create a New Application Project
  • Anatomy of the Project
  • Creating View Components
  • Setting Up the Route Table
  • Adding Links to Views
  • Programmatic Navigation
  • Accepting Path Parameters
  • Supplying Path Parameters
  • Test, Build and Deploy
  • Summary

Chapter 8. HTTP Client Development

  • Ways to Write HTTP Client
  • Using Axios in Single File Component
  • Using Axios in a Conventional Component
  • The axios Object Methods
  • The Configuration Object
  • Response Object Properties
  • Making a POST Call
  • Error Handling
  • Summary

Lab Exercises

  • Lab 1. Getting Started with Vue.js
  • Lab 2. Basic Event Handling
  • Lab 3. Basic Template Design
  • Lab 4. Form Input Handling
  • Lab 5. Basic Component Development
  • Lab 6. Componentize an Application
  • Lab 7. Single File Component
  • Lab 8. Basic Single Page Application (SPA)
  • Lab 9. HTTP Client Development
  • Lab 10. Advanced Routing
Read Less

Schedule

Upcoming Course Dates

There are currently no scheduled dates for this course. If you are interested in this course, contact us with the form below.

Contact Information

FAQ

Does the course schedule include a Lunchbreak?

Classes typically include a 1-hour lunch break around midday. However, the exact break times and duration can vary depending on the specific class. Your instructor will provide detailed information at the start of the course.

What languages are used to deliver training?

Most courses are conducted in English, unless otherwise specified. Some courses will have the word "FRENCH" marked in red beside the scheduled date(s) indicating the language of instruction.

What does GTR stand for?

GTR stands for Guaranteed to Run; if you see a course with this status, it means this event is confirmed to run. View our GTR page to see our full list of Guaranteed to Run courses.

Does Ascendient Learning deliver group training?

Yes, we provide training for groups, individuals and private on sites. View our group training page for more information.

What does vendor-authorized training mean?

As a vendor-authorized training partner, we offer a curriculum that our partners have vetted. We use the same course materials and facilitate the same labs as our vendor-delivered training. These courses are considered the gold standard and, as such, are priced accordingly.

Is the training too basic, or will you go deep into technology?

It depends on your requirements, your role in your company, and your depth of knowledge. The good news about many of our learning paths, you can start from the fundamentals to highly specialized training.

How up-to-date are your courses and support materials?

We continuously work with our vendors to evaluate and refresh course material to reflect the latest training courses and best practices.

Are your instructors seasoned trainers who have deep knowledge of the training topic?

Ascendient Learning instructors have an average of 27 years of practical IT experience and have also served as consultants for an average of 15 years. To stay current, instructors spend at least 25 percent of their time learning new, emerging technologies and courses.

Do you provide hands-on training and exercises in an actual lab environment?

Lab access is dependent on the vendor and the type of training you sign up for. However, many of our top vendors will provide lab access to students to test and practice. The course description will specify lab access.

Will you customize the training for our company’s specific needs and goals?

We will work with you to identify training needs and areas of growth.  We offer a variety of training methods, such as private group training, on-site of your choice, and virtually. We provide courses and certifications that are aligned with your business goals.

How do I get started with certification?

Getting started on a certification pathway depends on your goals and the vendor you choose to get certified in. Many vendors offer entry-level IT certification to advanced IT certification that can boost your career. To get access to certification vouchers and discounts, please contact info@ascendientlearning.com.

Will I get access to content after I complete a course?

You will get access to the PDF of course books and guides, but access to the recording and slides will depend on the vendor and type of training you receive.

How do I request a W9 for Ascendient Learning?

View our filing status and how to request a W9.

Reviews

Overall it was a good bootcamp. A lot to cover so it is understandable that the pace had to be a little fast.

Good Course. We covered a lot of material in a short amount of time. This course had useful labs that built upon each other.

Some Labs are very good but some steps it ask to update but its already updated, but overall its very good training.

Courseware was effective but would like to have some PDF material on BPML and XPATH

great class and packed with material, would have lived to spread it more into many days but overall very informative.