Vue JS 3 Tutorial for Beginners #10 - The Composition API (part 1)

In this Vue 3 tutorial we'll take a look at the new Composition API & discuss it's benefits over the Options API we've seen so far. The Composition API is a great new way to make Vue components & reuse component logic.

----- Timestamps -----
0:00 - Drawbacks of the Options API
4:42 - Composition API basics
11:57 - Template refs (again)
18:17 - Using refs for reactivity
25:17 - Refs vs Reactive
31:57 - Computed values
38:55 - watch & watchEffect

🐱‍💻 🐱‍💻 BUY THE FULL 20-hr COURSE ON UDEMY:

🐱‍💻 🐱‍💻 Course Files:

🐱‍👤🐱‍👤 JOIN THE GANG -

🐱‍💻 🐱‍💻 My Udemy Courses:

🐱‍💻 🐱‍💻 Helpful Links:

🐱‍💻 🐱‍💻 Social Links:

[jakubschulz]

This music when creating a project is the best

[pewolo]

You know what Shaun, you are the best web development teacher ever, all your words sink in like magic and you took me from zero to hero in Vue JS.
There is no word that better describes how amazing you are.
May God returns this kindness to you in thousand folds!

[FADHsquared]

38:25 - FYI people, the <script setup> syntax is now stable, basically anything you write in <script setup></script> is equivalent to writing anything in the setup() hook. And any top-level bindings (imports, variables, function declarations) are "automatically returned" so you don't have to worry about returning yourself anymore!

[LKBean]

Thank you soo much for these tutorials! They're clear, concise, easy to follow, and very informative. You, sir, are a wonderful person for making this <3<3<3

[amckee]

Not sure what I love most about these tutorial videos, the concise, in depth explanations or the old timey song played when creating a Vue project :)

[maulik]

The way you explain composition API is amazing 🔥🔥

[pangogeeks]

This is such a CRUCIAL video to watch which will remove doubts about the concept of reactivity in Vue. Before watching it I couldn't get my head around why we use ref for something not related with DOM refs, why not reactive, why computed, etc. You answered all my doubts in one shot! Attashaun and thank you so much!!!

[jackiechan]

Great tutorials, i finished watching all your ads as a thank you

[sl]

This is by far the best video and the most accessible way for me so far to move over from the options API to the new composition API. Thank you a million!

[lucapassani]

Very nice. Thank you. I was not aware of the composition API and was stuck trying to make sense of a code example that used it. Now everything is clear.

[pyplacca]

React devs learning/transitioning to Vue would really appreciate the Composition API over the Options API

[RyazantsevNikolay]

Wonderful tutorial. Very clear and concise, way better then original Vue ones. Thanks!!!

[kmyzbfn]

The best lecture i've ever seen. thank you

[shaikadnan]

Your videos are great sir!! Quality learning stuff for free!! If I become a web developer in future, it would be totally because of you sir that too for free. Proud to be a NET NINJA

[Fryknowledge]

your explainations are very understandable shaun. It helped me in cracking my first vue interview. Thanks shawn.

[aaravbatra]

Dear Shaun, In my carrer of 18 years I have never came accross a YT tutorial as good as yours. You have made learing Vue a cake walk. You are so much clear on what to demo and how to demo. Your contents are very very much structured and totally inline with what a begginer would like to know. I am going to watch all of your tutorials now. Kudos

[owadefelix]

You have a nice and easy way of explaining things, kudos

[thelolladorfking]

Once I get my job, I'm sure I'll donate you. Thank you so much sir.

[okpain]

You are such a Goood Teacher Thanks words its not enought for thanking u . much love

[Acuceibdj]

I watch the Ads till the end cuz ur content deserves to be supported ❤👍. I really appreciate doing more projects in SSR with vue