Vue.js Basics Course (How To)

Introducing Vue

In this stage, we’ll build an understanding of JavaScript frameworks -- what they are, when to use them, and why Vue.js is a great choice. You'll learn how to add Vue to a project using a CDN and get familiar with the basic Vue syntax.

• Introducing Vue.js

  3:17

• Frameworks, Vue, and You

  3:24

• Add Vue to a Project

  2:17

• Hello Vue

  6:15

• Introducing Vue Quiz

  5 questions

What a Beautiful Vue!

Explore the power of templating with Vue, including event handling, conditional rendering, and using Vue directives.

• Marvelous Mustaches

  4:01

• Introducing Vue Directives

  5:16

• What a Beautiful Vue Quiz 1

  6 questions

• Basic Event Handling

  5:53

• Add interactivity with v-show and v-on

  9:02

• What a Beautiful Vue Quiz 2

  5 questions

Sweeping Vues: Loops, Methods, Directives

Use Vue to loop through multiple items in an array. Learn more about Vue directives, including how to use computed properties and how to bind classes and styles to a template.

• Vue Devtools

  4:16

• List Rendering with v-for

  7:29

• Getting Loopier

  9:11

• v-show vs. v-if

  2:29

• Sweeping Vues Quiz 1

  5 questions

• Events: Toggling and Filtering

  10:00

• Computed Properties

  8:51

• Conditionally Adding or Removing Classes

  6:44

• Sweeping Vues Quiz 2

  5 questions

Building a Flashcard App

Apply what you've learned about Vue so far to build a fun and interactive flashcard app! Learn about more Vue directives, such as v-model.

• Displaying and Flipping Cards

  7:52

• Getting User Input

  4:22

• Creating a New Card

  4:21

• Deleting a Card

  1:53

• Flip Transition!

  5:54

• Error Handling and Enhancements

  5:20

• Building a Flashcard App Quiz

  5 questions

• Going Further with Vue

  1:23