Vue JS Crash Course (2019)

In this crash course you will learn all about Vue.js including what it is, Vue-CLI, components, data, events, directives, etc
NEW 2021 VERSION:
• Vue JS Crash Course
Sponsor:
www.netlify.com
Code For Turorial:
github.com/bradtraversy/vue_c...
Deploy Sites With Netlify (Video):
• Deploy Websites In Sec...
💖 Become a Patron: Show support & get perks!
/ traversymedia
Website & Other Udemy Courses
www.traversymedia.com
Follow Traversy Media:
/ traversymedia
/ traversymedia
/ traversymedia

[@TraversyMedia]

Guys, check out www.netlify.com, not just because they sponsored this video but because it is literally one of my favorite platforms for deploying static sites and front end apps. Any sponsor I have, I believe in and believe they benefit my audience. The free tier is incredible and easy to use.

[@stctheproducer]

They are really good! My first static site is still hosted by them 😁

[@markokoth5609]

Next do a django crash course please

[@TraversyMedia]

Django crash will be updated to 2.x soon

[@gknt7234]

So, netlify supports you, and you should make a "Netlify CMS" video!

[@brawndo8726]

Netlify is solid. Best kept secret in the industry.

[@bakarandguladze]

Slides: 0:56 - What is Vue? 1:18 - Why use Vue? 2:37 - What you should know before learning Vue? 3:10 - Components 4:39 - Anatomy of a Component Setup: 7:20 - Installation 8:46 - Create an app through Commandline 10:37 - Create an app through UI Coding: 13:10 - Brief review 19:25 - Data 21:35 - Creating "Todos" component 26:05 - Creating "TodoItem" component (nested) 27:20 - Outputting TodoItems 29:30 - Implementing 'is-complete' 31:35 - Event (checkbox) 34:35 - Deleting 39:47 - Adding a header 41:45 - Adding a form 43:53 - Fixing the button 44:20 - Adding functionality to AddTodo 50:33 - Http Requests: 53:25 - get 55:25 - post 58:30 - delete 59:37 - Vue Router 1:07:09 - Build

[@nidilap5638]

This deserves more likes people

[@abhayganti8662]

Wow. Thanks

[@mysteryvishal]

They need to pin this comment, thank you so much!

[@bengineersalva8344]

Legends never die

[@anupambartwal6181]

tnak you verymuch

[@GG-hl4zp]

In case someone has issue there: 25:22

[@GG-hl4zp]

I just spent 40 minutes to troubleshoot why it was not working. I see I should have watched the video for 15 seconds longer last night...

[@Falcon_Poncho]

I had the same issue, thank you for this. Any idea why Brad's app had no build issues when leaving this out, and mine failed to build?

[@jancifoxhound6380]

sweet. Thank you!

[@bmehder]

I am SOOO glad you mentioned this. I almost threw in the towel. :-)

[@user-sq5rn5ci5m]

Thanks man, that helped a lot.

[@nadir2k]

So basically now you're redoing all the crash courses, Great Job, actually that is what we all need. There were a lot of new additions in these technologies since your last courses.

[@TraversyMedia]

Yes, all my crash courses were out of date using older versions. Also I have grown as a developer since then

[@nadir2k]

@@TraversyMedia When exactly does a developer reach the peak point of learning :D

[@TraversyMedia]

@@nadir2k Absolutley never...I always and will always consider myself a student because things are always changing and you have to keep learning to keep up

[@mitjed]

@@TraversyMedia Please do a dart or flutter crash course, thank you very much!

[@ouza1430]

@@TraversyMedia I love your work... thank you so much for sharing your knowledge in such easy way

[@RenanVital]

Minute 50: Other method to prevent form default is add 'prevent' after @submit Example:

[@josephastrahan6403]

Agreed, I just read up about this also, much better way to do it and should be mentioned!

[@albertchung7641]

Nice tip

[@LucXX36]

Helped me too, I mean, what Brad shows works also fine, but beginning from 45:34 it helps to add your suggestion into the code. rather than Brad's. But both work, your suggestion is shorter. Thanks.

[@Universestyle]

Can someone explain to me, in more detail what "prevent" does and why we need it, and why there is an "e" in "addTodo(e)?

[@RenanVital]

​@@Universestyle When you click button [submit] or [whatever], the default is send the form. Use prevent for blocked this default. Use addTodo for do what you want.

[@AbdellahRamadan]

You are actually the best. I have never learned a framework in 1hr. I just followed this crash course to the end and now I have a next project I am writing in Vue. Thank you so much.

[@emmanuelobiajuru7922]

Thanks Brad, ever since i found your channel my web development skills have improved tremendously. The way you teach its quiet clear that you seek to impact lives.

[@samu350]

If you ever question your life I hope you don't because you've been so much of a help to the community and everyone in a way most people wouldn't do, I love your content man please keep on the good work, absolutely no one does tutorials the same way you do. Congrats on 600k subs! Do some Laravel + Vue.js ;)

[@bestrelaxmusic1078]

Hello from Russia! I watched many of your lessons and want to say thank you for your work. You are one of the few who can TEACH!

[@IsaacAsante17]

Brad is trying to kill us with a tsunami of useful knowledge. How are you so fast at creating valuable tutorials?! Now I don't know what to watch!

[@maskman4821]

I suggest you go with MEAN, MERN, MEVN....

[@carlhlazo931]

Wonderful crash course. Your approach worked for me. You started from an empty slate all the way to a simple functioning app without leaving out some often overlooked set up nuances. I have watched quite a number of these crash courses and I was left with knowledge gaps. You started with the basics of installing Node and NPM for example and worked your way all through configuring the IDE using extensions. This was excellent for me. This crash course is my reference point for some basics in my journey to learning more about Vue JS. Great job and thank you for taking the time to do it. Look forward to more of your courses.

[@donathon680]

One of the best tutorials I've watched, seriously. Coming from a PHP background and picked it up exactly at the right tempo and learned some ES6 stuff at the same time.

[@ddalejandroo]

Brad you are the man!!! been following you for about 2 years, and now you're almost at 1 million followers! crazy.. anyway, I followed this tutorial and found a warning when implementing the deleteTodo with the axios json. this line > .then(res => this.todos = this.todos.filter(todo => todo.id !== id)) I was getting the warning that res was defined but not never used... so I fixed it, by just passing it at the end... like this> .then(res => this.todos = this.todos.filter(todo => todo.id !== id, res.data)) anyways hope this helps someone out if they encounter the same thing.. Cheers and thank you for your amazing material!

[@jensdemuynck]

Thanks! :D

[@rkq_]

thank you. you solved my error.

[@JesterUndead]

Dude, thank you! I've been staring at the screen for like an hour because of this. You're the man!

[@paynetang2331]

Hi komplex, it solves the error for me as well! Thanks But I actually dont understand this part, can you please share what the comma means in the code?

[@PenStab]

You can also do this: .then(res => this.todos = this.todos.filter( res.data.id !== id )). This way you're actually using the response you're getting. You look at the data that's retrieved which is a single todo and then compare its id property to the id of the todo you deleted. Then the filter method filters it out

[@shmuelelkis7834]

this is so much easier than React , Thank you so much for this course man !!

[@mertkocak5438]

Love how you simplify and make everything clear before diving in, thank you brad!

[@devanpellow6705]

This is great. Love your crash courses. It helped me during my coding bootcamp a and now it's helping me when I start my new job! Love it and love that you keep them updated.

[@newworld3844]

Can’t wait for the Vue Front To Back Course!!!

[@damagedmybrain]

I'm waiting for the same!

[@codegate615]

f

[@codigodesenior3995]

f

[@lazymacs2823]

f

[@andyhenderz5562]

F

[@alenv808]

Thank you! I just started going hard into VueJS so this is very helpful

[@TheMorges1]

Brad, You're a truly good man. I'm a self-taught developer and I've been Coding less than 18 months. Your tutorials have not only helped me get a job as a developer, but they are helping me keep at the top of my game, and continuously progress myself. I can truly say of all the content I've consumed in my short 18 months of coding, your tutorials always come out on top.

[@imbayi]

This channel is on fire. Great quality content coming out every day. EVERY DAY!! Thank you Brad!

[@damilareemmanuel]

Notification Squad. Thanks Brad

[@mrmomo42]

My mom asked me to send her the link because his soothing voice made her sleep xD

[@ahxel8173]

Your mom doesn't have to search for a TV channel anymore before going to bed. Lol.

[@listmaker9339]

Corey schafer is also a good one! Your mom can learn python in the end.

[@abdelkadersebihi6983]

Lol

[@rrohitamalan]

😂

[@TheWyntas]

lol, that's kinda true. i do get sleepy while listening to him xD

[@anand69]

Thank you Brad, what a great, well paced tutorial! I used Docker to package the final dist folder within an npm image, and deployed to k8s. Worked like a charm!

[@maryb9504]

Thank you very much !! Thanks to your crash courses for React, Angular and Vue, i got an idea about their concepts and it made it clear for me to choose the one i feel more comfortable with !! 🙏🏻

[@Alessandro-nq3tm]

Wooo near 600k subs!! You really deserve this Brad.

[@asdfblkqrqra]

47:20 substitute with: import { v4 as uuidv4 } from 'uuid'; and then in the script: id: uuidv4(),

[@miisam7386]

thank you for this >.

[@md.abdullahalmamun5973]

import { v4 as uuidv4 } from 'uuid' id: uuidv4(), That worked for me

[@syedazmiharoon7263]

you're a life saver, thanks

[@senseicodes]

I have been waiting for this, I like how you do your tutorials. Thanks Brad!

[@patrickkornetzke3889]

Brad, thanks again for another amazing, structured, informative, easy-to-follow tutorial. Your crash courses are the absolute go-to every time! And all that in what (at least seems like) on take? Amazing skills!

[@mayurkapadia3985]

Thank you Sir ... I dont have any words for your awesome, great job... Hatsss of to u sir... 😊👍 .

[@gaborszekely8387]

Any chance you could do an intermediate-level series for Vue/Angular? I feel like everyone only focuses on these introductory level videos but I would love to see some of the more advanced features of these frameworks as well. Cheers, and happy 2019!

[@qudratxojamusayev6785]

Hello, Brad. You've saved millions of minutes that people may have spent to crawl documentation and learn all you say. Thank you, you're doing great job.

[@indirapravianti4097]

I really love how you explained every bit of it! This is the kind of tutorial that I would watch and share with my friends. Thank you so much for this video!!

[@yltfy]

Nice video! By the way, the checkbox "markCompleted" function (33:50) is now considered as an anti-pattern and has been deprecated in Vue 3.0, because it modifies props in the child component. It's a good exercise for audiences to change this part using @emit.

[@sanjadaic5296]

Can you please help me how to solve this?

[@damagedmybrain]

When can we expect a Vue front to back course? :p WAITING EAGERLY :P

[@haraldcarlsten6238]

Travers, I really enjoy your courses! Your coolness is awesome. I very rarely have to rerun what you say. I get it on the first look-through. Rarely happens with other code-along-videos

[@hughmungus1767]

I'm trying to imagine what would justify anyone giving this video a thumbs down. This is one of the very best KZbin videos I've seen and I say that as a professional IT instructor. I also happen to be new to Vue.js, vue cli, and VSCode yet after watching this video - and following all the instructions very closely to get my own copy of the app running - I feel like I have a strong working knowledge of how to use these tools which were so unfamiliar just a few hours ago. The course is first rate. It includes exactly the sorts of things I needed to know to get started with Vue.js and VSCode and doesn't throw in a lot of fluff. Everything is explained in a level of detail that was just right for me. The ongoing exercise seemed to be just the right level of difficulty for a beginner like me. I still have lots of learn but I feel like I will be able to learn it with the help of this video, other videos by the same (and different) presenters, and some one-on-one help on the Vue.js forums. Thank you VERY MUCH, Brad! If I could give you 10 stars (out of 5), I would but I gave you what I could, a like, and I clicked the Subscribe button. As far as I'm concerned, this course sets the standard for what ALL video courses should be.

[@GEEKLEAK25]

You can also write "scaffold" in a new empty Vue file and you will get all the three part of the file.

[@SkutterGameplays]

on new version its just "vue" for anyone wondering

[@PunitDiwan]

@TraversyMedia, Great Video, I am eagerly Waiting for Vuex Crash Course. I have a small project to manage my ERP and I am thinking to use Vue.js for that. Its basically an admin Component.

[@leonardkiano4591]

If anyone is still having trouble with uuid not being found, use vue-uuid like this 1. run - npm i vue-uuid 2. in the script block add the following import - import { uuid } from 'vue-uuid'; 3. Save file It should work. Awesome crash course as always!!!

[@sajinsj]

Thanks for this quick crash course covering all the basic stuff. Its the first time I am watching one of your videos, but I'll definitely watch more.

[@mikaylatheengineer9631]

vue is already way cooler than react, loved this tutorial/framework

[@seesnapdochannel2229]

Great video, one thing I would change. Your variable / component names are very confusing (Todo, Todos, etc..) if you made those more distinct, it would be much clearer which item was being referenced at all times

[@songangte29]

Totally agree. for me it ruined a large part of the video. i ended up having to rewatch again and again. Please change the variable names. it is proper programming convention

[@sahilvig22]

Same. That is the ONLY thing I dislike sometimes.

[@Barykada]

I agree but that actually helped me more than I thought! I've done this myself and that way I started playing with the code and understood how the data is linked to each other :)

[@norberthelandi]

Couldn't agree more. I am so confused with the names...

[@majs6708]

All I could hear was "Todo" "Todos" .

[@theoboldalex]

Awesome Tutorial Brad! You have made some sense of Vue for me and I also learned about axios in the process. Thank You :)

[@lazouskiethedestroyer1904]

Thanks for the tutorial! Concise and informative, helps me out a ton with getting my head around my current project (and anything in the future, I'm sure).

[@RoxioCZE]

34:10 i thought u cant update a prop from a child component, it throws an error Unexpected mutation of "todo" prop vue/no-mutating-props

[@9vg80zm4lybt0kb]

I had the same issue. You can use the same strategy he uses at 34:30 for deleting the todo item

[@tmattoneill]

this needs to be higher and addressed. It's a showstopper. Why aren't more people mentioning this?

[@spuitelf89]

Im having the same error being trown, and havent figured a work around yet..

[@theoligarchist1503]

@@tmattoneill because not everyone does the practicals, i am here to see what is Vue; since i am working on Generating JS from Rust, am researching to find out if these Frameworks give me any advantage over generating VanillaJS. :-)

[@samarmohan9891]

Use Vue 2

[@michaelgtz4873]

59:08 Don't need res => here, just assign this.todos the way it is. I'm not a pro. But we don't use the response. So far.

[@AdnanAbbasi_LXXVIII]

Thank you so much Michael for pointing this out, I don't know how I overlooked this. This made the app worked!

[@michelmeier1837]

Awesome crash course video - you explained all the basics so well and happily not just on a helloWorld project but a real app! Great job, keep on the good work!

[@stctheproducer]

I was literally hoping this crash course would be done soon. Thank you! 🙌🏾

[@aliazizi7007]

please more videos about vue js and laravel ........yoou are so goooooood at teaching laravel plzzzzz

[@jashanbansal2613]

Brad is Awesome!

[@TraversyMedia]

Thanks :)

[@theEyeDock]

This was a fantastic tutorial - Enough depth to go through the creation of a complete project, yet still not excessively long.

[@zalmez7207]

I loved the format. I have a really hard time following along when learning new things but I had no issues here. Keep ut the good work

[@itpunkie]

Thanks for another nice vid! I already have experience with VueJS so maybe this video is not for me, but I've started my "VueJS career" from your previous VueJs starter videos. And your vids helped me a lot! Can I make a small notice here? 28:03 - actually, we don't need that extra wrapper element here now, because we can iterate that component directly. You can replace this: with this: That's because your component already has its' own wrapper inside a component code. So your rendered HTML will be something like: Todo Item instead of: Todo Item I do not criticize your video, but it may be useful for beginners. Thanks again, Brad!

[@DORIYASPIELMAN1234]

Awesome course:) in the deleteTodo method, you didn't change the filter with the res.data, so it didn't compile.

[@ByakugaK]

I just got rid of the arrow function and it compiled. Do you know if that would a good way to handle the http response?

[@retrowave4155]

Whenever I need to update my memory about something, Traversy media is always the best place!

[@grampygamer8584]

Thanks Brad, I always look forward to your courses and updates. Keeps my mind fresh and up to date. Will you be doing a Udemy course for this?

[@alastairdallas]

Thank you for making it so easy to compare Angular, React, and Vue. Vue seems much smaller because it installs centrally (I think), but here's what I saw in terms of files on disk: Angular: 29,000 files = 292MB for the project; dist: 22 files = 18.3MB React: 28,200 files = 119MB for the project; dist: 14 files = 723k Vue: 209 files = 7.28MB for the project; dist: 9 files = 824k

[@vijakrajpoot]

This is a wonderful crash course. The very first time my life I wrote a frontend app and really enjoyed the way you explained. Thanks for your amazing work. One quick note in AddTodo.vue uuid.v4() doesn't work. It seems I am using v12.16.1. I had to use import { v4 as uuidv4 } from 'uuid'; and id: uuidv4 in addTodo() . Once again thanks.

[@matheusfernandolopesdasilv6368]

Oh I just commented this, didn't see your comment before, it would have saved me some time haha

[@tswtdt555]

I was just recently introduced to Vue. Currently building my website with it and changing out of notepad with a new design. Great video. You keep it simple and its easy to keep up with you. This helped a lot. Thanks.

[@jimiscott]

From a professional dev evaluating Vue this is an awesome intro video. Well done.

[@haciendadad]

If created is not firing, it may be because you put that method in the methods array instead of it being at the same level as methods. Lifecycle hooks (created, mounted, etc ) have to be at the same level as "methods".

[@AlissonSandes]

Thanks, I was stuck with this problem!

[@haciendadad]

@@AlissonSandes I hear it is a common problem. I'm glad the comment was helpful for you!

[@worldlinx]

oh gosh, I spend a day trying to figure out what's wrong... finally, this solved it for me too!!!

[@CodeAndCoins]

As a beginner, Spending 1 week on Angular vs 1 day in Vue. I feel comfortable with Vue than Angular.

[@TomislavKaljevic]

It speaks about you, not about Angular.

[@Miklaous]

@@TomislavKaljevic rude

[@soyaro]

Brad helped me do my undergrad project through his Laravel crash course. I also sold a modified copy of the same to a classmate for $50-haha . And now two years into full-time employment, he still teaches me a lot of new stuff I apply at work. Thanks Brad! Keep up the good work.

[@tavindersingh8185]

Thanks!!! I have been looking for this type of Vue tutorial for a very long time and now the search is over.

[@Shannxy]

59:17 I did this, but why do you not get the same error of "res is defined but never used"

[@bmehder]

The error is coming from ESLint. To prevent the error, you can add "// eslint-disable-next-line " (without the double quotes) right above the line of code causing the error (witch I believe is the .then() method). You can also disable the rule in the Vue UI in Configration > ESLint Configuration > "Rules" tab > vue/no-unused-vars, and change the "Error (Default)" to either "Off" or "Warning". I used the // eslint-disable-next-line, but then I found the plugin configuration a couple of hours later.

[@HinorikaC]

@@bmehder Thanks!

[@oxanasf6369]

@@bmehder Thanks!

[@akashaj4660]

@@bmehder Thanks a lot!

[@steveroe_5621]

@@bmehder Great job thank you

[@jenusdy]

26:15 error 'res' is defined but never used no-unused-vars

[@navinkmrsingh]

remove "res => " and save

[@kesicrack1]

Best crash course! I learnt vue 3 years but forgot a lot of things, this is a very good refresher.

[@jonathanmohan2846]

Love your style. I'm just a newbie as I just landed my first front end development job and your method of teaching is working well for me after hours learning. Thank you!

[@Poohbify]

At 59 minutes, if you're getting an error: 'resp' is defined but never used. We can actually change the resp to an empty parenthesis () to remove the eslinting error.

[@marvinkweyu5206]

Life saver.

[@evance2432]

Ty for the tip :))

[@yellowjohn3169]

When coding deleteTodo(id), it always shows " error: 'res' is defined but never used (no-unused-vars)" and cannot compile. My code is the same as yours.

[@Pete_Sahat]

That would be because you are defining res but never use it in the callback function and no-unused-vars does not like that. Replacing res with () or disabling no-unused-vars should fix this.

[@PenStab]

You can also use res in the filter method by replacing the arguments to the filter method with ( res.data.id !== id ). Now you're checking the id of the todo that is returned from making the call to jsonplaceholder.

[@cwilliams744]

Hey man, just wanted to say thank you for all of these awesome videos. I work as a technical architect and really enjoy learning these applications and being able to share them with co-workers. Cheers!

[@josephs.8474]

What a coincidence, I was searching for a vue.js crash course in your channel (updated) since last week. And then this came out. Thanks Brad!

[@KarlooAudi]

How long time does it take you to learn 1000 languages in your lifetime, this is so crazy!

[@TraversyMedia]

With both frameworks and languages, once you learn two, you start to see they are all pretty similar there is just different terminology and syntax. The core concepts are the same or at least pretty close

[@TraversyMedia]

@@ilya-zhidkov I think he was exagerating and I think he meant frameworks/libraries/etc as well :)

[@TraversyMedia]

@@ilya-zhidkov Also you can add Ruby to that list if it's worth anything these days :(

[@krantinebhwani6125]

@@TraversyMedia First I've seen such a recent comment from you so I'll take this chance to say thank you hoping you will see it. You have single handedly helped me through a very bad time in my life and also helped me find a job I'm so incredibly grateful. I owe it all to you (and some of the design / styling tips with travis@Devtips). I haven't stopped learning from you either, the learning continues with vuejs! Thanks a lot man.

[@TraversyMedia]

@Kranti Nebhwani I am glad I could be of any help at all. Thanks for watching my videos :)

[@apoc5412]

33:37 Any idea how to solve this error with console.log(123) when I was testing it out this appeared -> Unexpected console statement.eslint(no-console)?

[@BFKxFroMxHollanD]

same problem!

[@lipricon01]

in package.json file find object «eslintConfig», then in "rules" attribute add "no-console": "off"

[@UpTballA]

try: window.console.log(123) instead of console.log(123)

[@eraazana1257]

if eslintConfig doesnt work for you, put /* eslint-disable-line no-console */ after the console.log();

[@josephizang6187]

Simply wonderful. I get vue now..on to some deeper stuff. Thank you for making these topics approachable

[@marcbohm8758]

Thanks a lot for this course. I really appreciate the calm and professional style. Helped a lot.

[@aliizzetmetin6382]

Vue definitely seems to be easier compared to react

[@mikepecha3818]

lets rename the MEVN stack to VENoM stack

[@ticTHEhero]

oh yess)

[@mukulsoni8263]

This video is really awesome and clean. I just got the overview, the basics of Vue, CURD, and API interaction in just an hour. Thanks you are awesome :)

[@bojandurmic1]

When I see 500 thumbs up and 0 thumbs down, I feel so great as if it happened to me, because Brad, you really deserve it. You are a good teacher, overwhelming majority of your content is free and you are really a great guy. Keep doing this great work for the community and I wish you all the best in the years to come!

[@mariany4691]

I hate to be that guy, but I really find this tutorial hard to follow. I think it's a bit too confusing with how the naming of things went. It really made it hard to really understand what was happening for me and how we're supposed to piece components. EDIT: Like with how we have a file called Todos TodoItem then theres a todo prop and a todo-item class.

[@arcooke]

I actually had the same issue. Too many things with the word todo, it made it confusing to show what was linking up to what

[@bjornarmar2462]

59:20 - Kept getting an error about res being instantiated but never called, and one of the below solutions resulted in a similar error saying that todo was instantiated but never called, and one of the other solutions simply broke the delete method entirely. Here's the one resolution I found that works the best: deleteTodo(id) { axios.delete(`jsonplaceholder.typicode.com/todos/${id}`) .then(() => this.todos = this.todos.filter(todo => todo.id !== id)) .catch(err => console.log(err)); }

[@cassandraz3035]

Hey! I think this makes a bug... when you enter several of your own TODOs, and then try to delete one of them, it bulk deletes all of the ones you entered

[@cassandraz3035]

stackoverflow.com/questions/55505768/multiple-todos-in-todo-app-getting-same-id-from-json-placeholder .... may be because of this.... I will investigate

[@cassandraz3035]

unfortunately..... it seems it has been a problem for a loooooong time. No solution

[@MrSupernerd007]

awesome video man, just finished the react section at the boot camp I'm going to and then I saw Vue pass react fro downloads this week. Glad I found this vid, gonna watch your Vuex one next but this was a really fantastic intro

[@whyparadox5294]

I have been waiting for this! finally thank you brad!!!!

[@createlobo]

I'm sorry but naming literally everything "todo" is not how one should teach a framework. Variable names need to be descriptive.

[@kurzninja]

This does make things a bit confusing because it's hard to understand how different variables are referencing each other and what exactly is pointing to what.

[@douglashoffmann1929]

I think thats the right way, because the name is on the convention that we use in our day. If your dont get used to it, just try to make a project naming every thing "button-add-todo-emitter-son" "button-add-todo-emitter-final"

[@zacharytelschow4088]

If you think you can create better free material, help yourself. Brad does a great job explaining the basics and showing how the pieces tie together. Extremely nit picky feedback.

[@vommir.]

Yeah quite confusing, nonetheless awesome tutorial.

[@samfeighery1224]

There is nothing from stopping you from naming your own variables and it is a crash course after all, Keep up the great work Brad!

[@vladhusnullin1650]

Good job. Thanks. Please, use @submit.prevent="action" next time. Instead of calling e.preventDefault()

[@napalm_exe]

Why is this way better than the other?

[@napalm_exe]

@@DistantComputer Ohh okay I see, thank you!

[@cgomes1607]

​@@DistantComputer In that case, you'll have to put it in every directive calling this method, right? If so e.preventDefault() seems better for encapsulation.

[@cgomes1607]

@@DistantComputer True

[@mohamedhimi8535]

Great course, thank your clear explanations! Following hands-on was a nice learning experience!

[@piotrszkiecin8357]

Hey Brad, this is like Netflix for developers. You overwhelm with added value. Thanks!

[@ThePandaGuitar]

Todos all over the place, unfortunately. Might be good tutorial for a todo app, but very difficult to understand the gist of the framework.

[@johnraymon7743]

Hey, I can understand where you may have gotten confused. However, if you follow real close, you should be able to differentiate the identifiers despite there being multiple plays on the word "Todo"

[@WinnerSingh]

Always todo list 😅

[@randomguy5922]

Wonderful course, you made us to watch till end, you exactly knew how to proceed and what to cover in an 1 hour video. Thanks for such useful beginner crash course.

[@michaelgtz4873]

I've watched quite a few tutorials on the web, and all those guys(authors) are definetely specialists in their area, no doubt. But ony few of em can teach and explain really well. You are a good teacher, man. I enjoy your videos, thanks.

[@gabrielcaraos8729]

Thanks Brad!! A big help in my side to study vue especially that I'm have a project using Vue.

[@RameenFallschirmjager]

Brad Traversy, is the best instructor ever, period. He's a national treasure!

[@KiaanCastillo]

Christmas is over but he just keeps giving and giving 😭🙏 thank you, Brad!

[@shadow_3213]

You are the reason why I removed the AD BLOCKER so that you get money from the advertising, unfortunately I do not have a credit card otherwise I would be a patreon of you!!! Thank you very much for all your videos !!! Best ever !!!!!!!

[@jsnelson_]

Great course! Have not used Vue in a while but just got a new job which uses Vue and this was a great refresher! Keep up the good work man

[@asifmohtesham]

Hi, Brad! I am glad to be a part of your audience. You are an adept teacher. Thank you for all your videos. They're priceless. On a side note, could you share your methodology or the process you go through and iterate the flow of your applications and/ or APIs? It would definitely be fruitful for us. How important do you think they are? Thanks again! ✌️️

[@keyboardwarrior5696]

This was a great introduction for a beginner like myself. Thank you!

[@lunatunsa]

Been through a few Vue.js tutorials and this has been the best.