Vue.js 2.0 In 60 Minutes
Вставка
- Опубліковано 17 лис 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 UA-cam. 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 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
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.
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.
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
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
Very nice. One of the few tutorials I actually watched until the end.
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.
Thanks. For someone who is used to other frameworks, this hour gives an excellent overview. Great work!
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 "
Very straightforward tutorial. That one is a really crash course.
You are seriously the best teacher I have ever had. Thank You!
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!
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!
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!
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.
one of the best tutorial for vue.js for beginner. Thank you 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!
Thanks man, I donated some money to support you!
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
Dude! that was awesome and really helpful, i will buy the full course to support! greetings from Dominican Republic. :)
I'm late to the party but I'm slowly knocking these out. Thanks so much!
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
Very nice quick tutorial to cover almost all basic topics and very well explained. Keep us the good work.
beautiful. best one hour tutorial so far.
Thanks. it is really good Vue.js intro for a beginner. It helped me a lots in picking it up.
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.
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.
Instead of v-on:click you can do @click. Instead of v-bind:src you can do :src
so : and @ for nice shortcuts :)
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!!
Great, fluent, right to the point.
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.
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!
One general suggestion: naming boolean variables with _is_ prefix makes the code so much more readable. For example: _v-if="isNameShown"_
Good tip, thanks
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. \../
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!.
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
Someone needs to give Brad a Nobel.
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!
Great videos. Just the right pace and flow.
Just as always, gold quality.
A vedio let you know how to use vue , vue-resource , vue-router. Greater！
建议先看了vue的文档再看。
Good job! Nice walkthrough for beginners (like myself), before diving into the documentation. Thanks for the introduction! :)
45:47 You can simply put .prevent after the @submit handler instead of doing e.preventDefault! :)
_( so )_
Thanks! it really helps a lot! Now I'm dealing with Vue Admin Panel Framework based on Vue js!!
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?
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.
Hi Brad,
Aswome explation no words to tell about you pretty helpful vedio to new to Vue people also thanks a lot 🎉👏👏👏👏👏👏👏👏👏👏
Dude, LOVE your crash courses. Thanks!
Really you are too Good. Thanks Traversy Media
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?
Great video for beginners.Thank you
Thanks a lot dude, It's awsome to cover all of this on 60 mins :)
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.
This was a great introduction to Vue.js! Thank you so much!
I wish UA-cam had a faster playback speed than 2x :/
Great tutorial!
A great guide for beginners! deeply thx for this video. :)
LOVE N RESPECT YOUR EFFORTS
Great video :) I'm actually getting the hang of it. Very well explained, thanks!
i know right
Could you please create Crash Course on Polymer JS
no vs than other ,it's all about developer and what he can do or what he can build
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.
Helpful video, thanks!
Thanks Brad, it was nice introduction.
Excellent Thanks.
Awesome tutorial, alwayz.
Plz do any tutorial with Vue in front + Laravel in back !
Thank you so much for this crash course! It was really useful to me!
Great tutorial, step by step, can't be better, thumbs up.
Great voice BTW, you should be on radio!
Thank you.
Thanks for sharing. a really helpful video for all beginners.
Awesome tutorial! Learned alot from this channel.
PLEASE BUMP UP YOUR FONT SIZE. Great tuts, thank you.
nice tutorial , and this video give me a spirit to learn about vue js again hehe
Thanks you very much! This is a good tutorial for beginners. Much useful for me.
wow that was a blur, learned a bunch!
Really great crash course video, thanks for this!
Thank you mate, nice crash course. Gonna take a closer look now :).
I love your videos man, I learn so much
Thanks for the tutorial helped me understand Vue for sure!
Thanks for being able to speak English. Muting the keyboard clank might be nice- just a suggestion.
if you like VueJS you should use KnockOutJS. the code design is the same but K is much easier and clean. you work with html straight away.
Magnificent tutorial.
Thank you very much!... An excellent introduction to Vue.js!
Couldn't perform the Add feature, I don't think you called methods "addUser" in html. So in html button, instead of using , I used Submit, then it works
Very easy to follow and cool tutorial! Thank you a lot
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
On your donation screen (1'08") the logo you use beside your Twitter link is actually the Tumblr logo.
Haha good call. Maybe Ill change it
That was a great introduction. Thank you very much.
Hi Brad - Thanks for the video! Can you also create a tutorial with VueJS + Django (or Django Rest Framework)? I can't find any good tutorial on the internet regarding this VueJS and Django integration. I would like to become a Full Stack Web Developer and your videos inspire me.
You are amazing man!! Helped me understand so much. Can you provide the sample code that you use in the video as well as that would be a great help. Thanks.
When it created my app it created a index.js file containing a new Router() with a route to the HelloWorld Component. That was different from the video. Later version of vue?
Having the same issue here
just choose not to create router during 'vue init'
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.
Excellent tutorial! Just wanted to ask that if I want to display a new component under the router div which is independent of the router and is to be just used for displaying another content, then how to do that? This is my first time with Vue. With your tutorial I implemented everything very smoothly. Thanks a lot!
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.
Man,you are the best keep going,really Many thanks for you