Learn Vue JS course Learn Javascript and Vue JS Learn VueJS course Learn VueJS Tutorial

Vue.js Components Fundamentals

Components are the puzzle pieces of a Vue.js website. Learn the fundamental and important concept of Vue.js components in this course.

🚧 PLEASE NOTE: You are browsing a Vue.js 2 course
  • 11 lessons
  • 53 min
  • Beginner
Illustration image of Vue.js Components Fundamentals

About the Vue.js Components Fundamentals course

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.

After this course, you'll be familiar with:

  • 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

We've also prepared exercises for the course, so you can practice what you learn.

Vue.js Component Exercises:

  • Build a GitHub user profile component
  • Create a Notification Message component

You need a basic understanding of Vue.js to enjoy this course. We recommend watching Vue.js Fundamentals if you're not already familiar with Vue.js