Vue.js 2.0 In 60 Minutes
HTML-код
- Опубликовано: 22 авг 2024
- UPDATED VERSION - • Vue JS Crash Course (2...
In this crash course we will cover all of the fundamentals of the Vue.js 2.0 JavaScript framework.
Vue-cli
Declarative Rendering
Directives
Conditionals & Loops
Events & Input
Templates
Components
Properties
vue-router
vue-resource
FULL VUE.JS COURSE:
www.eduonix.co...
For more on this video and others, visit www.traversymed...
SUPPORT THIS CHANNEL WITH A CUP OF COFFEE PER MONTH:
/ traversymedia
ONE TIME DONATIONS:
www.paypal.me/t...
Hi Brad,
My name is Eric Mann. I wanted to thank you for taking your time to do your tutorials. I was confused on how Vue.js worked together. But, after watching your Vue.js crash course I was able to comprehend how Vue works and also how everything fits together into a very useful user experience. Your teaching style is one of the best that I have seen on RUclips. You take the time to make sure that what you are teaching is simple enough for everyone to understand, but also in-depth enough so someone could venture out farther from the shore. I am an o;d programmer trying to learn a new web technology and you have a real blessing in what you do. Please, don't stop teaching.
Thanks so much Brad!
How old are you, sir?
I never hesitate to recommend Brad Traversy as the go-to guy for learning any sort of stuff related to programming!!! Hats off to you dude, because of you I can now claim that I know Vuejs. Your" in 60 minute" series is mind-blowingly amazing!!! Great work, keep it up.
Starting a new job tomorrow where vue js is used. This video is a treat! Thanks
I've worked with AngularJS before and already learned React a bit and I'm really surprised how simple Vue is. I first told myself I never use it, it's very easy and simple, but later I thought that's an advantage already and it does not make sense to throw Vue away because of that.
Thank you for this intro, Brad.
I got a new job as a viewjs developer ! was working as an angular developer. Thank you brad your tutorial helped a lot.
Hi. I was interested to become a vue js developer. can u explain hows the environment working with vue in your company. I would be grateful. thank youuu.
Viewjs. 😂
the fact that you can't even write down the name of the framework you're using ...
lol, actually made me lol twice! 😂👌
@@lancerino765 hahahaha
Your tutorials are super simple to follow. Thanks for the effort you put in to provide this video.
Great tutorial! Quick tip: If your already in your project directory in Terminal, you can use the command "atom ." to open the directory inside Atom. Great for those keyboard power users.
If you are using Visual Studio Code, having the Vetur addon is a really big help.
*Features:*
Syntax-highlighting
Snippet
Emmet
Linting / Error Checking
Formatting
Auto Completion
Debugging
Need to get a job to buy "FULL VUE.JS COURSE" because I like the way how you teaching. It's amazing! Thank you so much Brad!
I have managed to land myself my first web dev job and a big part of it was thanks to you and your courses Brad. Just sent you a donation too, absolute legend! Cheers!
Bro, THANK YOU!! ... for another gem of a course ... you actually taught me Angular2 ... forever grateful!! Here are a few sincere requests:
1. Angular2 + Firebase
2. Angular2 + Ionic + Firebase
3. Vue JS 2 + AJAX
Thanx in advance.
Thanks man, I donated some money to support you!
That is the best introduction I've seen on the web. Thanks for your effort and for sharing premium level content for free! I'm a big fan!
The distinction between the conditional directives "if" and "show" is actually quite important.
If Vue.js is anything like Angular;
- "if" will either render an element to the DOM only if the expression evaluates to true, otherwise it isn't rendered (or is removed).
- "show" will render it to the DOM regardless of whether the expression evaluates to true or not, then only the elements visibility is affected by the expression outcome value.
This can be a headache when validating forms or running UI tests, so it helps to keep it in mind.
Tip: instead of using "npm install --save " or "npm install -g " just use "npm i -S "/"npm i -g "
Thanks. For someone who is used to other frameworks, this hour gives an excellent overview. Great work!
Super helpful video. Was so complete that it took several days to really parse through it all while coding along. Thanks for easing the transition to Vue!
Very nice. One of the few tutorials I actually watched until the end.
Thank you so much man, these tutorials are priceless, I really needed to understand how vue.js works as I'm working on a project in laravel and we're trying to stay off jQuery and this video has taught me a lot. Keep up the good work mate.
I am coming from Angular and Polymer and I just needed this. Quick and dirty but you drive through all features of Vue.js
Nice job, if you do the same also for Typescript it would be awesome.
Thanks for the time spent on this, appreciated!
Very straightforward tutorial. That one is a really crash course.
I had done use Vue.js 2.0 a period of time, Although the video is basic, but it's very helpful, thanks for making this video and sharing with everyone
Really nice video... and by the way, although is an off topic comment, with the soft sound of that keyboard it seems like an asmr video, so I was learning in a relaxed fashion
You are seriously the best teacher I have ever had. Thank You!
Good intro and yes would like few projects with Vue.I was listening on my headphones and heard this banging and kept looking around what the hell it was lol then you said its your son.Thanks Brad you are making me great programmer.
I'm late to the party but I'm slowly knocking these out. Thanks so much!
Hi Brad, am from Indonesia! In every tutorial you created am so excited to upgrade my skill in programming. Jah Love You and Jah Bless!
Very nice quick tutorial to cover almost all basic topics and very well explained. Keep us the good work.
Dude! that was awesome and really helpful, i will buy the full course to support! greetings from Dominican Republic. :)
Thank you for the video. This video helping me as a newbie in knowing deep about front-end framework using vue.
Very useful and effective web tutorials. Thank you traversy! I was inspired by you to make more Filipino/tagalog tutorials for my country
Excellent tutorial as usual. Was hoping you would go into "master-detail" functionality (click on the user to see their details for example) using the router though. Currently there aren't many clean, simple examples of this online that I can find.
Firstly, I must say your tutorials are great and I appreciate all the time you put into teaching the community.
My thoughts on frameworks (in general). I think frameworks teach or rather don't teach people know how things really work. (ex. Needing jquery to access the dom instead of just using pure js). There is nothing wrong with using a framework but if the author HAS to use one (ie. is unable to write it in pure JS) then I think they need to learn the fundamentals first. If people are just starting out I feel they should understand how to write such an app without a framework before using one for speedy development.
Great video, I just started an externship that uses Vue.js as their main framework. Hopefully this helps me land my first front end job. Thanks
Definitely enjoying this tutorial, you remind me of Lee Brimelow, back when I was a Flash Developer. But since I liked it so much, I'm going to purchase the full tutorial, keep at it!.
I have vue components but data is coming different server in one big JSON for all components. What should i have in my component data method?
Good, useful for getting started or used to Vue. Please consider using color syntax in ur videos. Even if you don't prefer it, a lot of people do and it would make the code easier to read.
LOL spoke too soon @23:30
One general suggestion: naming boolean variables with _is_ prefix makes the code so much more readable. For example: _v-if="isNameShown"_
Good tip, thanks
one of the best tutorial for vue.js for beginner. Thank you so much.
Awesome video man! I've done a lot of Angular work and am going to start working on a Vue project so you're tutorial was perfect!
Instead of v-on:click you can do @click. Instead of v-bind:src you can do :src
so : and @ for nice shortcuts :)
Great, fluent, right to the point.
Awesome video! thank you very much. I feel like I learned all I need to know to get up and running, which is just what I need. It also seems like Vue and React share a lot of similar API characteristics, though I really love how Vue mixes css into the component files.
Thanks. it is really good Vue.js intro for a beginner. It helped me a lots in picking it up.
Good job! Nice walkthrough for beginners (like myself), before diving into the documentation. Thanks for the introduction! :)
Someone needs to give Brad a Nobel.
45:47 You can simply put .prevent after the @submit handler instead of doing e.preventDefault! :)
_( so )_
beautiful. best one hour tutorial so far.
Hey great crash course on VueJS i think i will be buying the full course i will be sure to check it out on udemy btw i also liked your course on bootstrap 3 great material very helpful and right to the point, keep going your work it's really appreciatted!!
Really great video - easy to follow and well spoken. Would be really keen to see a video that works with a database. Does your full course include this? thanks!
Helpful video, thanks!
Great video :) I'm actually getting the hang of it. Very well explained, thanks!
i know right
at the time, software development is just fkd up, and it's only getting worse.
Every basement is developing new frameworks and bringing new complexity into the game
I couldn't agree more
It keeps bullshitter away from the SE industry.
Just on the FE front. Back end is alot better. But I long for the days we had just bootstrap, css and jQuery. For now I focus more on the BE. Yes I am not as cool as the latest kool kids club FE script kiddies, I accept that.
omg, it's exactly i think about
@@hatemsaad3421 Seems like it's all calculated to make any experience older than six months useless.
wow that was a blur, learned a bunch!
Dude, LOVE your crash courses. Thanks!
Thanks! it really helps a lot! Now I'm dealing with Vue Admin Panel Framework based on Vue js!!
I wish RUclips had a faster playback speed than 2x :/
Great tutorial!
Great videos. Just the right pace and flow.
Thanks a lot dude, It's awsome to cover all of this on 60 mins :)
no vs than other ,it's all about developer and what he can do or what he can build
This was a great introduction to Vue.js! Thank you so much!
Hey man. Thank you very much. I used to program in Angular. But vuejs is very simple when compared to. You helped me a lot to migrated. \../
Thank you so much for this crash course! It was really useful to me!
Damn you Windows programmer, spent 5 minutes searching for the error, you've typed the ./components/test in lowercase but created the file as Test.vue with the T uppercase (yes, I've followed along every detail :P and got screwed)
Bruno de Oliveira lol windows cmd forgives case sensitivities
that makes two of us
Great video for beginners.Thank you
A vedio let you know how to use vue , vue-resource , vue-router. Greater！
建议先看了vue的文档再看。
Thank you mate, nice crash course. Gonna take a closer look now :).
Just as always, gold quality.
Very easy to follow and cool tutorial! Thank you a lot
Great tutorial, step by step, can't be better, thumbs up.
Great voice BTW, you should be on radio!
Thank you.
Thanks Brad, it was nice introduction.
Excellent Thanks.
Awesome tutorial, alwayz.
Plz do any tutorial with Vue in front + Laravel in back !
How you present is excellent, easy to learn and pick up details quickly, thx.
Do you have a mini course (eduonix or elsewhere) that takes this video one better by combining vuejs 2 with featherjs 2 (using socket transport) with say nedb. Lots of stone turning videos but very little view of the forest (stack) say building a simple but completely illustrative extensible app. (but not yet another todo or chat!). Throwing in quasar would be a plus (everyone always leaves the decent layout and styling out and that's a big time suck).
I'm a one man shop. I design/build/set up real-time hardware (iot stuff too) and I need to not only be a hardware guy but come up with the end user software interface. To have a truly extensible example of this stack would allow me to concentrate on hardware.
Awesome tutorial! Learned alot from this channel.
I have never used one of these Frameworks before! But now i'm required to use one for my next assignment! What should i use? Should i try diffrent ones or just one and stick with it?
Hi Brad,
Aswome explation no words to tell about you pretty helpful vedio to new to Vue people also thanks a lot 🎉👏👏👏👏👏👏👏👏👏👏
Really great crash course video, thanks for this!
Thank you. learned a lot in short amount of time.
Nice crash course. Can't wait to see your website!
Was wondering if you knew any of the C languages or java? If so what IDE do you think is best for Linux?
In my opinion IDE's from JetBrains are the best.
ihor1337 I'll have to check it out. Thank you for your input.
Eclipse is a must have for Java.
But for other languages I agree with ihor1337 that the JetBrains IDE's are the best
JetBrains' IntelliJ wipes its ass with Eclipse.
Really you are too Good. Thanks Traversy Media
I love your videos man, I learn so much
What is the difference between computed and methods this It distracts me
Computed properties are meant for doing modifications of data inside your app locally. An example of this is reversing a string that is stored inside your vuejs app. Methods are simply functions which are used for more complex tasks that aren't simply modifying data. for example: add this item to a list and make a http call using vue resource.
Computed is cached
Computed will never process untill the dependency data gets updated. If your dependency data has heavy manipulation its better to stick with computed. I think internally they use concept of Memoization.
Method will be processed every time its called.
method is a function {{ method() }} which does a call for each request
computed caches the data no () required {{ computed }}
When you working with large set of data, computed better for caching
nice tutorial , and this video give me a spirit to learn about vue js again hehe
That was a great introduction. Thank you very much.
A great guide for beginners! deeply thx for this video. :)
Thanks for the tutorial helped me understand Vue for sure!
Very good tutorial, cheers mate!
Thanks you very much! This is a good tutorial for beginners. Much useful for me.
Thank you for your nice tutorials
i'm just curious, why we can't type an es6 function syntax inside the methods property? please give us some info, thanks in advance for ur superclear video!
because it changes the scope of the 'this' keyword.
Could you please create Crash Course on Polymer JS
LOVE N RESPECT YOUR EFFORTS
Thanks! This was very easy to follow.
Great Video for Vue. I need clarification for as you said the v-show is similar with v-if on 10:45sec in your video it is not true, v-show only hide element like its style CSS will display none, but in v-if it will remove the element completely.
Awesome, as always. Thank you Brad
Magnificent tutorial.
Thanks for sharing. a really helpful video for all beginners.
Thank you so much for the video! I watched it twice!
Great crash course. Super helpful.
In 8:46 var should be simple case right? JS is case-sensitive right? Anyway, your videos are very helpful. Please don't give up and keep the good work.