Vue.js: Working with Components

Expected Duration
Lesson Objectives
Course Number
Expertise Level


Explore more facets of Vue.jsm, a Javascript front-end framework that is lightweight, flexible, progressive, and easy to set up, to quickly start creating apps in this 11-video course. You will review how to install Vue, set up a Vue environment for development, and how Vue handles common front-end necessities such as styling, routing, and state management. This course demonstrates how to create components in Vue which have reusable elements that encapsulate a functionality, and in it you will learn to use single-file components. You will explore parent-child components and how to transfer data between them. You will learn to use Vue slots to create reusable components that can define their own templates, and how to use slots to pass in dynamic content to components. Learners will examine how computed properties in Vue help to keep templates free from bloated expressions and overly complex logic, and optimize performance in the app. Finally, you will learn how Vue instances fire several lifecycle hooks and notable points.

Expected Duration (hours)

Lesson Objectives

Vue.js: Working with Components

  • Course Overview
  • describe the differences between global and local components in Vue
  • create new single file components for use in Vue apps
  • structure Vue apps to make use of parent and child components
  • use props to pass data from parent to child components
  • validate any props passed from parent to child components
  • emit events that can pass data from child to parent components
  • pass in dynamic content to components via slots
  • use computed properties to provide data in a Vue app
  • tap into the various lifecycle events of a component via hooks
  • pass props and emit events to communicate between components
  • Course Number:

    Expertise Level