The Ultimate Vue 3 Tutorial (100% Composition API)

This is the ultimate Vue 3 course.
Udemy Course (with discount)
www.udemy.com/course/the-vue-...
Timeline:
0:00 - Project 1
1:38:58 - Project 2
2:48:51 - Project 3
JSON Files
github.com/harblaith7/Vue3-Cr...

[@Flabidouf]

This. You found the best course for learning Vue 3. You don't need to search anymore friend. This is the bomb.

[@MagnusMcManaman]

From the Vue documentation page: *keys are no longer necessary* on v-if/v-else/v-else-if branches, since Vue now automatically generates unique keys.

[@rodrigo-vl7bi]

thanks

[@rodrigo-vl7bi]

that makes more sense tbh

[@joaofrancisco5781]

Nice, thanks, I was going to face that problem in a few minutes, now i'm not ahshsahash

[@malla_pavan]

sir can you tell me in this tutorial he used ?

[@josephedidiong7781]

​@@malla_pavan He used because he used composition API that doesn't require data and method

[@AdegbengaAgoroCrenet]

Didn't expect the length. Truly great stuff Laith

[@flutter180]

JSON data for project 3: drive.google.com/file/d/1KT0mOrEeIkBBdrzI1paZiTzIYFevmBZB/view?usp=share_link

[@antonyministrov7560]

Thanks Zack to upload this file, you are awesome, I would not do this project without it)))

[@dewaputusudewasuambarayana9408]

thank you for uploading this data bro

[@josbexerra8115]

gracias mister zack

[@go_lang_thang]

omg thanks u a lot bro oiw

[@LeonelEBD]

Amazing stuff, indeed a great find. Programmed a couple of sites back in 2021 in Vue and fell in love for it. Sadly haven't used it for a while with the coming of Vue3, finally got the time to sit down and get some of the Vue knowledge I've lost since with this tutorial. Also HUGE thanks for using the composition API which is new to me. I remember the problem of keeping the order and scrolling up & down in the Options API in my last project and this surely fixes that problem. Thank you !

[@QtheCoder]

Wasn't expecting a 6 hrs vue course but bro thanks!!! Day 1 watch 👌

[@richardvos3845]

I do not often leave a comment but I feel like I really have to, watching this video. I really appreciate the time and effort you took to make this Tutorial and I will surely be watching more of your channel. The way the tutorial is set up, is very good to follow, especially for beginning Vue developers out there. It's also clear that you are having a lot of fun making this, which makes it even more pleasant to follow. Thank you very much for make this high quality content, helping me improve my skills.

[@user-cj7lq3ug3w]

This is absolutely what I call a tutorial, Laith Academy has command of the subject and the teaching skills compared to a lot of others putting videos when not knowing the subject properly. Thank you very much Laith Academy

[@gtanmoy]

Salute to you Sir for your efforts to make this excellent course! I request you to extend this course with PWA and Capacitor with VUE.

[@mahendranath2504]

Thank you so much Laith, I am so happy about this, I have taken your GraphQL Course and I loved it, I have been following your channel for a long time, I'm a big fan of your channel, a happy subscriber

[@LeonardoSerra92]

this is an incredible video, i've been using the options api for a while and thanks to you i learned faster some of the compositions concepts with ease and not much time, thx

[@Godsmindcraft]

This coursen should be the best vue course presently with direct hands on project and consistent explanations. Thanks so much Laith

[@atulchandradash8477]

One of the best tutorial about VueJs in KZbin. Very detailed and best video. Thanks you so much sir.

[@barretoingridy]

This was the best online course I've ever taken in my whole life... thank you so much sir!

[@rodrigo-vl7bi]

that vue-router explanation is the most beautiful explanation i've seen in a youtube tutorial

[@user-ur3gx8lq2v]

Best tutorial on Vue3 i 've ever seen in KZbin !! Great job ! Many Thanks !

[@d3.finance]

Cannot express how helpful this was for me. I was in this awkward phase of my learning curve where I understood the basics but was having trouble with the advanced concepts. This was a perfect middle ground for me building the gaps I had. Thank you so much for this video. I'll be here more often for sure.

[@johanforsling7736]

I've been in tutorial hell for about two years now so I know what I'm talking about; you sir explain everything in a way I wish all tutors would!! Keep on the good work!

[@veryhyped]

wow. same. i first learnt react and hated it, then learnt vue but couldnt find any jobs so i was learning react again. but with vue things are much more easier. i wish there were more vue jobs

[@joaofrancisco5781]

@@veryhyped Lol, I'm struggling to learn vue, and I'm very advanced in React. Some things are not well explained, I came here to get the most recent tutorial, cause all other tutorias people use different ways to do something, and by the end, the shit dont work ahshsahshahsah Hope the tutorial is good as u guys say

[@veryhyped]

@@joaofrancisco5781 how are you even advanced in react, please tell me good resources. react is very very very complicated

[@joaofrancisco5781]

@@veryhyped I studied in a course where the front end framework was react, we had some instructions and we had a ton of projects to do, by the of 4 months we got in a very interesting place. But I learned react with TS by my self, the that apart was the most difficult by the start, we u got the logic of component props typing it become easier. And in what part are u struggling? Like, the componentization (for me) is more flexible in react, when u create separed files for each component and call it in a page file, its veey clean. My favorite UI lib is very intuitive in react, its Chakra Ui. If u struggle with styling and styled-components, watch some chakra tutorial with JS and TS after (if u want). Maybe u need to get a step forward to get a step back and get the fundamentals

[@Tobsson]

@@veryhyped React and Vue are very similar. It's just different syntax and what happens in the background. React.useEffect is essentially watch, React.useState is Vues ref. Then there are different syntax to update everything and optimise, but if you know either of them the other is pretty easy. It's all pretty much just JavaScript in the end. So, learn JavaScript really good before moving on to any library/framework. Good resources is the docs for React. They've updated them recently and is very good now. Learning the basics in React to land a job shouldn't take more than a month or two.

[@mikeleggett]

I had almost given up with Vue - this is the best tutorial. Detailed explanation of everthing. Great job thank you so much.

[@nife2453]

thank you so much for your effort. You are such a great teacher explaining everything very understandable

[@johnongwae]

This is awesome tutorial, I managed to grasp most concepts for my new job. Thanks a lot

[@user-op8hp3hg1w]

Finished all 3 projects! Thank you!!

[@kingvas7638]

Vue 3 is the best Front end framework , thanks for the effort !!

[@avelo895]

Thank you. This is absolutely brilliant and comprehensible!

[@donnyjoe7653]

Amazing tutorial! You over-delivered with all the nice little VSCode tricks. Thank you!

[@nawrozalialamdost5277]

I didn't saw such a instructor like you, you are amazing and your lectures are awesome. need more such lectures from you espacificliy it will be good to continue the advanced series of Vue.js in the channel. Love and support from Afghanistan

[@Kimbley2ii]

Thanks for sharing this. I bought the course on udemy after completing this video! good stuff.

[@user-ov1oh9bw4k]

one of the best beginner friendly videos for vue 3

[@vimmasi1]

Man, I knew I recognized your voice. I bought your course at Udemy 2 months ago, and it was the best Vue3 Composition API I have ever seen!

[@PatrizioMilione]

BEST EXPLANATIONS EVER, THANKS! 🚀

[@jonl316]

One of my favorite tutorials for Vue. Thank you so much!!

[@mises1615]

1:23:11 Count is updating but template/view is not updated. Vue is not re-rendering a full template of components every time you click a button! In your template "Ref" object is assigned to counter variable. Ref have assigned listener, it is triggered whenever value is changed. Vue is assigning to that listener what need to be re-rendered when value is changed in your example just tag is re-rendered.

[@lhceleguim]

Simply phenomenal. Thank you very much.

[@erosburastero8205]

Thank you for your video content, i've watched the nuxt crash course and after practicing a lot i could get my first job, and now i was looking for a course like this in order to be able to learn nuxt3, i really acknowledge your work

[@chefnabil171]

I just started, I like it. Thank you very much.

[@DavidKHill]

Signed up for the course. Thanks.

[@iwonder9606]

You did a fantastic job ! Thank you ❤

[@jakobo5521]

I am just starting my adventure with a Vue as a junior and I have to admint that you this tutorial helped me a lot if it comes to the overall understanding of the Vue concept. I find it much easier and more approachable comparing to the structure of React, especially for me as the beginner. Your way of explanation 'as for child' is also great. It helps to really understand what is going on under the cover. Looking forward to watch more of your stuff. Thanks once more time and keep the great job! Greetings from Poland! 🤝💪 P.S. if anyone has some good advices for Vue beginner I would be greateful to hear that! :)

[@fencesitter1]

This is one of the few VUE tutorials with combined API teaching . This is great!

[@redblues9566]

I agree.

[@eddawry]

What a course clear and simple and easy to understand Thants Laith

[@JuriBinturong]

I bought your course at Udemy because of your YT videos. Thank you

[@ophelia6207]

Thank you SO much for this AMAZING tutorial!!

[@shangmathing]

What a fantastic tutorial! Thank you.

[@redblues9566]

This lecture is really great. I received great help. thank you. From South Korea

[@kapytanhook]

Very good, was hoping to see some advanced topics like reactive, slots, state management, when I can use async in the composition api etc. When you mentioned the Instagram example it had some of that. But I suppose that is only on Udemy. I must not have picked up on that. Good quality stuff, will consider paying for your course

[@caaltz]

This is the course you've been looking for traveler, take a sit and enjoy the vue

[@MrTomro]

You are made to teach. Built different. Love ya.

[@Wuddigot]

A tip for maintaining paths is to use @ instead of . or .. @ by default starts at src/, so fi you end up moving things around or scaling up, you're less likely to need to go to each view/component and update paths

[@StarOnCheek]

I believe this is configured in your bundler and Vue has nothing to do with that

[@astratow]

2:56:43 - boilerplate basic 2:57:26 - basic styling 2:58:38 - styling continued 3:01:21 - card styling 3:02:28 - card styling continue

[@Mintirafro]

Just bought yourt course on udemy as a thanking gesture for your dedicated pinia video Helped me a lot 🤝

[@ihorrud5088]

Thank you for this course!

[@misaellima]

Thanks for the excellent learning material!

[@MrVernuk]

It was awesome! Thank you!

[@SherealynRemigio]

Thank you so much!!! This helps me a lot!

[@Kouatchoudjakouronald]

Thank you very much, this has been very useful.

[@firstlastcode]

Thanks for your good work ones again boss

[@89Valkyrie]

The explanation is pure gold. For anyone who is a beginner, you won't find another video that explains so much. It's not just the quantity, it's the flow. The flow makes it easy so that, if for example, in the first project you don't get what a dependency is, at least you can pause and go read about it elsewhere, then come back and tied to the short and sweet explanation.

[@_nom_]

Coming from Vue 2. I found 3 jarring, like I know nothing. So thank you.

[@alternbits]

Thank you. a great vue 3 tutorial

[@BillaSaheb786]

You rock Sir. Put all video and tutorial of VUE JS and Nuxt Js... Your channel will rock rather than putting on UDEMY. You will earn more from KZbin rather than UDEMY. Your way of teaching is exceptional.

[@KatyJohn-yy6ks]

OMG i love your video, thank you

[@EmmanuelTembo-gv1ll]

this tutorial is amazing

[@Loki-je3oj]

This was awesome!

[@auto-diciplime237]

Thank you very much great content as usual

[@johnmaguire2185]

Good course for a clear and detailed intro to vue. For the maths question 1. The answer is 1. The order is (2 + 2) = 4 brackets then x 2 = 8 as the 2(2 + 2) = 8 is all one bracket operation. Finally 8 divided by 8 = 1

[@ren97x]

BRO GOOD EXPLANATION REALLY UNDERSTAND IT

[@TysonHritik]

So great I easily get every concept Love the way you teaching also no one Is making video on composition API but you did keep it up ,When we are getting part 2 this ??

[@laithacademy]

Rest is on Udemy

[@TysonHritik]

@@laithacademy Okay thanks i'll buy from there but there is showing 389rs deal just for 1 day left is sale is going to extend or not because i don't have money right now

[@rishavjain1867]

@@TysonHritik dw udemy is always showing that. Buy teh course whenever u can

[@TheKimJAK]

I love you for this

[@j.m.5433]

Amazing. Thanks!!

[@dfordemo981]

super amazing😊

[@NeThsDomain]

thanks for tutorial. 1.25x speed sounds more natural for your delivery

[@hikemalliday6007]

really good vid. thank you

[@somayehheidari8880]

Hi, thank you so much for the amazing video. I stuck in the third project, where is the json file?

[@yanDev]

Just amzing thanks you so much, i love Vue, this is my favorite front end framework!

[@CoderSineNomine]

hi there.. great tutorial, thank you very much. what is the syntax highlighter you are using?

[@HappyLifeLearnAndShare]

Thank you for this

[@sale7680]

Best 🖤♾

[@mennahisham4359]

thank you so much, great explanation. could you do a vue/vuex project with api

[@KayNaude]

Laith is the goat. This is very informative

[@bb-fd2ui]

Did you meant "god" or realy "goat"?

[@udohpatrick2456]

@@bb-fd2ui Greatest Of All Time (G.O.A.T)

[@bb-fd2ui]

@@udohpatrick2456 Thanks - learned.

[@borishrimov8332]

I like Options API more because everything has it's place and code doesn't get messy. Data is in data(), fuctions are in methods and so on...

[@deepakshukla2526]

I also prefer composition. Easy to remember, better learning curve, nothing much to memorize and easy for beginners as well. I feel everyone should start strictly using composition api.

[@Eidsheimen]

Enjoyed the tutorial, but i would love it if you added chapters to the video! Would make it easier to navigate to the sections that I "care" about!

[@ali90taz]

Which snippet plugin do you use?

[@Arabian_Epileptic]

Dang bro 6 hrs! Nice🎃

[@elk11ke]

big thanks!

[@sebastiencamacho8429]

fabulous

[@yousfhamad70]

Thanks so much

[@RohitNaik]

1:29:00 its Reference Implementation . usually used in Java world as well

[@abc33155]

40:40 It’s not true that attaching events is more difficult in plain JavaScript, you can just add an onclick attribute to the button tag. But the “experts” say that’s not recommended. But the same thing is exactly how it’s done in Vue.js

[@hoda67286]

thanks so much

[@piyushmahapatra5402]

Nice!

[@alexchang8180]

do you cover deployment in ur course?

[@walidkishi]

Thank you very much.. your explanation is wonderful and excellent But a question: who did not subscribe to the course on Udemy, can he get the code?

[@chrismotari]

Me

[@explicitxartist]

Hey! This course is great! the discount is no longer there though!

[@ecemonkol1653]

kudos for the cat too!

[@asifahmed6568]

I would be grateful if you could make a Reactjs video with the same amount of explanation.. Thank you

[@aikesithe]

Good good lesson

[@muhammadyudarizki3024]

great brooo 👋🏻👋🏻👋🏻👋🏻👋🏻👋🏻

[@fuadajkic9167]

Good tutorial, i learn a lot here, thanks.. but i had trouble with : import.meta.env.BASE_URL... so i change it to process.env.BASE_URL,.than it started to show things in browser...so if anyone have same problem, try to use process...it is strange cause import should work with vue 3..it is prob a matter of project setup, tooling versions, or specific configurations.

[@actualBIAS]

32:18 This is something you would say if and only if you can put yourself into the position of a learner. Thank you.

[@actualBIAS]

1:14:00 You're a great teacher bro