Vue.js: Working With Forms & Unit Testing

Expected Duration
Lesson Objectives
Course Number
Expertise Level


Vue.js, a Javascript front-end framework that is lightweight, flexible, progressive, is easy to set up to quickly start creating apps. In this 15-video course on important aspects of Vue.js, learners see how to use the V-Model directive to set up two-way data binding between Form Inputs and locally managed data. Then you will learn to work with FormData in Vue to construct a set of key/value pairs. Next, the course demonstrates how to install the necessary tools for unit testing, and how to create and run teAPI. You will learn to use Jest, a JavaScript unit testing tool; how to stub certain Vue containers as part of setting up unit tests; and examine mixins (Cascading Style Sheet properties similar to functions) and global mixins to define and distribute reusable bits of logic among the app's components. You will learn to use built-in and custom directives in Vue to add to templates. Finally, learners will see that custom filters are a way to apply common formatting to text and return an output.

Expected Duration (hours)

Lesson Objectives

Vue.js: Working With Forms & Unit Testing

  • identify the subject areas covered in this course
  • use v-model to perform two-way data binding in a Vue app
  • use modifiers to cast model data into an expected format
  • bind to the submit method of a form element and respond in Vue
  • validate form data according to business requirements
  • set up unit testing using the Vue CLI
  • create and run a unit test against a Vue component
  • re-run unit tests automatically on save
  • reuse app logic using mixins
  • set up global mixins in a Vue app
  • use Vue-provided directives in apps
  • create and use custom directives
  • set up and use filters in Vue
  • create and use custom filters
  • create a Vue component, add form elements, inputs, and buttons, and display alerts
  • Course Number:

    Expertise Level