Vue.js Tutorial for beginners (2021)

Welcome!

Hello dear student. If you clicked on this course, this is probably because you are looking for an efficient tutorial on Vue.js or maybe you are just interested to learn quickly all the basics.

If so, you are absolutely at the right place.

Is this course about VUE 2 or VUE 3?!

As you probably know, a new version of Vue just came out but is in BETA. This course is about Vue 2 basics with a part on introduction with Vue 3.

Guillaume, who are you?

My name is Guillaume Duhan, senior front-end developer since 10 years now.

I am focusing on Vue.js since 2015 now. My goal is to teach you as fast as possible and as clear as possible all the basics of this amazing JavaScript Framework made by Evan You.

What is Vue.js?

“Vue (pronounced /vjuː/, like view) is a progressive framework for building user interfaces. Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable. The core library is focused on the view layer only, and is easy to pick up and integrate with other libraries or existing projects. On the other hand, Vue is also perfectly capable of powering sophisticated Single-Page Applications when used in combination with modern tooling and supporting libraries.” Vue.js official documentation.

A tutorial for beginners

If you never code before don’t be scared!

This tutorial is for absolute beginners who already learned some HTML, CSS & Javascript.

If you already know Angular, React or JQuery, you’ll love to learn Vue.js!

Why you should learn Vue.js

Vue.js is one of the most popular frameworks at that time.

If you did some front-end dev by the past, you’ll quickly feel at home. Vue is made to develop SPA really quickly because its learning curve is totally efficient. Moreover, Vue has been build to be easy to handle and to understand.

Right now, on job market, Vue is sexy. There are a lot of companies that are choosing Vue.js for many reasons: its huge community of developers, its tools and its large package playground.

What is the program?

As I said before, this course is for absolute beginners. So I made a slow but concrete program:

• Install Vue (with Vite.js),
• Configure your project,
• Architecture,
• Views & components,
• Data-binding,
• Inputs binding,
• Props & events,
• List rendering (to do list building),
• Components registration,
• Slots,
• Mixins…

And for Vue 3:

• Use of setup,
• Reactive properties,
• Props declarations,
• Computed properties,
• Component registration,
• Data-binding…

A quick travel to Vue.js

At the end of this course, you’ll have a bright idea if you like or not Vue.js. But you’ll also have a basic and useful understanding of this amazing JS Framework.