Max sir, you are the great teacher, I have learned VueJs, nodeJs and now I am learning angular 8 from your videos. your explanations and voice quality are awesome...
I love Max's videos. The composition API seems like more arbitrary code for no real gain. I like vue for its simplicity and the ease of use and this new way just feels like more over-engineered JS
First course I ever bought on Udemy was your Vue course. Your excellent delivery and subject knowledge has spoiled me and now I have to compare every course I watch with yours. I hope you are aware you are the gold standard in development courses. As always, your little snippet here doesn't disappoint in the least! I wait for the Vue course to be revamped or perhaps a brand new Vue3 one from scratch! Please, do a full C# course, I would pay gladly to watch you explain and demonstrate the intricacies of the language and its core mechanics.
Wow, I really want to thank you for your wonderful words Philip, this means so much to me! I will update the existing Vue course once Vue 3 is final, got no plans on C# at the moment though.
@@academind Wow, thanks a bunch for this. Also, really, when your delivery, your preparedness, your explanations and your in depth analysis is compared to the rest of the instructors out there, most of them eat your dust, for real! I mean, sure, Brad (Traversy) does a stellar job too and some others try hard, occasionally. But you present stuff from all angles and cover everything so succintly that even when something gets updated (a la React pushing for closures/hooks everywhere) the knowledge and software depth one gets from your courses allows someone to clearly stay on top of the new developments. Excellent job, excellent. P.S. reconsider C#, I am aiming to slowly study it really well and go for the certification - and I know a course by you would be the ultimate preparation for it, so I am willing to pay top euro for it - i.e. I have only two kidneys but we can talk this through :P
Looks awesome! I didn't really enjoy working with Vue 2 as much as I hoped to, but with the new Composition API and better TypeScript support, I'll surely give Vue another chance (once it's out).
That was a great introduction to Vue 3 max... But I feel it's too much for simple to medium vue apps as the Vue 2 syntax is more predictable where you can find ur data.... Consider a 100 data variables are there and for making everything reactive we need to surround everything with the keywords reactive and ref... It's crazy
Why not mimic data object with one single reactive variable in setup? setup() { const data = reactive({ products: [], show: false }) ... return { data, ... } } I really like this new composition API. Looking forward for Vue 3!
@@GungooseHonk and what about all computed and watch elements in your component. Will you mimic it too? It's too many data inside one setup method and with those reactive, ref and .value it becomes more difficult to read.
It does look a lot like React Hooks. I feel that the Composition API will become a de facto standard, and may take away most of what makes Vue feel intuitive...
The new api is great. The proxy api enables reactivity, so you do not have to declare data and functions as different object properties which is great and now can easily split data and code. I am really curious how computed is implemented under the hood, basically how that function finds out which reactive data are used inside its body. The only way I can think of is parsing the body of the function and finding out which values are passed from the closure.
Finally normal functional-way of writing things in Vue. Thanks Evan! ^^ The only thing I didn't like in Vue were the options, where you were limited to pass only object/array properties and nothing more
Thanks Max, that’s a great intro and alleviated my confusion around the Composition API. I have to say, I’m not sure I like it. Seems somehow dirty and messy. I feel like a neater structure would be something like this: export default { compositions: { infoComposition: { data() { return { showInfo: false } }, methods: { // info methods } ..etc.. }, productsComposition: { data() { return { products: [] } }, methods: { // products methods } ..etc.. } } } And then just keeping all template syntax as-is. Maybe I’ll come around to it after using it on a complex app.
Danny do you plan more courses for Quasar? All I know you have the only quasar-course in the planet and hence in Udemy. This alone is a wonderful Quasar intro, and well choosen classic Todo-CRUD app. But I struggle whenever I want to change the boring quasar layout. For example I want a bootstrap style dropdown menu (complete drop-down of the toolbar). I've tried with q-expansion-item (accordion) but the all other elements of the toolbar, centered vertically when I've opened the expansion-item. So I've replaced it with btn-dropdown. But I use expansion-item in mobile version of the menu. I wished however a common solution for both cases, etc, etc... For such nitty-gritty details one need more Quasar tips-tricks. Quasar is the best Vue framework and need more attention.
There is no reason for so much boilerplate. The main reason for splitting into data and methods in the he first place was to declare everything returned by data as reactive internally. Now you can just return a simple object, with data and functions and the data are already wrapped into a function making them reactive. This api is much simpler and will greatly reduce code duplication. It can also help reduce over splitting components just because this was the only way to split functionality
Actually, there is no difference your solution between Max used mixins. Here is example making without using external .js files as you said. codepen.io/navi3591/pen/RwNGYEZ?editors=1011 Never searched deeply but I think, this syntax is not totally for just "make code prettier or reusable for developers", the biggest reasons are performance and typescript. I would be in love if there is a official way to make Vue.js + typescript + .net Core with SSR support from Microsoft :)
This composition API really fixes my main issue with the framework. After a while it could get really hard to keep track of all the different things going on inside big components. I'm looking forward to using Vue with this API for my next personal project.
I don't know. Using a single setUp function to do several things - create composition parts; link reactive parts together, and returning the final "data" object smell. And how does one get dependency injection to work here? The irony here is that composition problem is one of the fundamental concepts of OOP and this has been solved over 25 years ago. The twist here is one needs REACTIVE composition and even that has been solved by Reactive frameworks. This setUp approach seems to reinventing the square wheel.
Aha! Somebody get ridden "low coupling, high cohesion" and really think about it! :) Thank for this tutorial, its great! And it's totally clean for non-native speakers.
A lot of jealous React fanboys acting like Apple fanboys (every time Android comes out with a feature). FYI: Hooks existed many years before React was created. Act like you knew.
@@anthoniG it's annoying because I just come here to learn. I definitely don't waste my time bragging about Vue over in the React forums. What good does that do?
@@RorySilva Well people are weird lol. With some if you are not using a framework than them they get antsy. It's like Android and iOS all over again :(
If I understand composition API correctly, it can add more performance in reactivity mode due to ability to control it manually compared to Vue 2. This can be very helpful on older mobiles with less powerful CPU. One area that Svelte shines the most is in reactivity speed due to lack of VDOM and less automated DOM update.
Congratulations on a very well structured introduction to VueComposition API. I’m not sold to it however and it seems a high price to pay just to maintain some backward compatibility. These new levels of indirection and hidden magic traded for some lexical practicality... meh. I would have preferred if they broke the whole model and fused all this with VueX stuff in a really elegant approach. That is what major versions are for. This should have been 2.8.
I'm still in a wait and see for Vue in terms of creating a large and scalable enterprise application. We evaluated for Vue and Angular last year for our large application and opted to rewrite it in Angular 8 and upgraded to Angular 9.
great explanation!! but I am a little confused about why we don't need to return { isValid : isValid.value } at the end of ProductForm.vue setup method.
Pretty clear by now that the Angular team was right in making Typescript default language. Everybody else now scrambles to move in that direction 2-3-4 years later. Same with Observables and Rxjs support.
You were not passing functions as parameters in Vue2 courses. So, why did you prefer it here: For brewity? In the absence of a Vue3 compatible Vuex? Or isn't it not an anti-pattern anymore?
Thanks from France ! Very good explanations, I use Vue only since 2-3 months and the organization of the code is a real problem for me (go to the data, and after to methods, search where is the function corresponding to my data etc..) That's boring, and these new features are perfects for me! Sorry for my english lol
I love functional programming, but I agree that this is a lot for even medium sized apps. Personally, I can see the value of this if you're creating a new project knowing you will have a lot of reusable code and large components. I have definitely struggled with data readability in larger components. Otherwise, I feel that the options api is better for me. Regardless, this is an incredible addition and goes to show just how much the Vue team cares about their framework and users.
Finally i understood what the composition api is. It's like React Hooks... don't like it, i hope i will not be forced to use it 😃 but really thank you, your explaination is clear and i really understood everything, you are the number 1!
You mentioned that there is a link to the starting project below the video, but I can find nothing in the description? Is there a repo with the code anywhere?
I didn't get yet what is the real advantage and difference using vue composition vs mixins. I can encapsulate all my logic and methods and separate it with mixins.
Only for simple things, but if you work on something real then you'll appreciate Vue's composition API mainly because maintaining dependencies with react hooks becomes a nightmare. In my opinion the best thing about Vue is its reactivity system (which ironically doesn't exist in react), this becomes more apparent when using react hooks and comparing it with Vue's composition API. The only reason I would even consider using React instead of Vue today would either be: 1. React is more popular (has more jobs) 2. or some React only libraries which might be critical for some projects (like Drafjs or Slatejs). None of which are technically React pros or Vue cons.
Basically, almost all of the lifecycle functions that were used in Vue 2 will be wrapped in the setup() function. I think this is good. Just wondering what will happen to the $data function...
Hi Max, an amazing tutorial (as always) I'd like to ask what do you think, is the composition API production ready already or should we rather wait until it's released in Vue 3.0?
5 років тому+46
Vue devs: Vue is simpler than React Vue authors: hold my coffee... 😂
Thanks for the introduction. Quite an interesting new mechanism. By the way, there is no need to define a 'isValid' variable within the isValid computed function. You can just return false if the conditions are matching and 'true' after all tests.
Your Tutorials are very nice.kudos.Have some queries/comments 1. Passing a function to child component and executing in child scope doesn't look good to me 2. Mixins are good for vue. 3. I think you should have had a separate login component there 4. Why did vue team ignored mixin aliasing concept, instead they created this composition api? Something like an instance of that toggleMixin with a name say login and then use login.toggle() and login.show
Great vid as usually! Thanks a lot ! But i think it's better to stick with traditional vue approach until next version release and then all the things should be at right place. Now it looks like vue2 + comp-api = (rather)pain in s.
Max you're full of action and always up to date; so thank you once more for all your great videos and your very detailed master-piece Udemy courses. I didn't like the new API. I don't think it will be a success story. You say, useful for bigger components? Well, we should fight against bigger components. When a component becomes bigger, we should refactor it. Divide it to subcomponents, js modules etc. To me the Vue is the "Love at first sting", but I don't think that the new API is necessary. Lastly, what do you think about the Danielo515's and olivier delmas comments below?
@no1youknowz Today I'm quasi forced to use the new API, 'cause I want to implement a component with XState inside. They provide two different methods for the injection of their Machine (StateChart) into a vue component. The first one using the old API, and the second one with the new composition API. And liked the injection via setup() method. I think it will take some time to get used to it.
Hi Max Brilliant as always :) One quick question I have onMounted where event is getting data - my local LET variable is let club = reactive({}); how to set in one go variable club = data. It works if I define all properties first but I dont want that I just want pass object to let club = reactive({});
My jury is still out on this. I suppose when I start building much bigger apps with Vue, I will come to appreciate the composition API. Nevertheless, it is a wonderful addition to the features on Vue
Great video. Thanks Max. At this point I may as well switch to react. The reason I chose Vue was for the syntactic magic and less ceremony code. If I'm going to treat everything like pure functions then why use Vue at all? Svelte may be a nice replacement too. Much more idiomatic IMO.
Some time ago I stumbled upon an article , which stated you shouldn’t pass functions in props, because there are emitters for that in Vue.js. I’ve never thought about it so much, but what do you think Max? I see that you do it here in the video and I was just curious :).
I did it here because I'm so used to it from React. You absolutely could use an emitter - I'd argue both is fine. You just have to be consistent. I do use both, depending on the project I work on.
everything is bouncing above my head. I always use pure js and I know ionic. Which is best for beginner to start among all react , vue , angular , nest etc ?
![Vue 3 Composition API Introduction [FULL TUTORIAL]](http://i.ytimg.com/vi/bwItFdPt-6M/mqdefault.jpg)
![Vue 3 Composition API Introduction [FULL TUTORIAL]](/img/tr.png)
If you want to skip review of Vue 2 options API, start video at 17:23
This is the best vue-composition-api tutorial ever, I understand everything that Max explained and talked about !!!
Max is simply the best 🎸
Max sir, you are the great teacher, I have learned VueJs, nodeJs and now I am learning angular 8 from your videos. your explanations and voice quality are awesome...
I love Max's videos. The composition API seems like more arbitrary code for no real gain. I like vue for its simplicity and the ease of use and this new way just feels like more over-engineered JS
First course I ever bought on Udemy was your Vue course. Your excellent delivery and subject knowledge has spoiled me and now I have to compare every course I watch with yours. I hope you are aware you are the gold standard in development courses. As always, your little snippet here doesn't disappoint in the least! I wait for the Vue course to be revamped or perhaps a brand new Vue3 one from scratch! Please, do a full C# course, I would pay gladly to watch you explain and demonstrate the intricacies of the language and its core mechanics.
Wow, I really want to thank you for your wonderful words Philip, this means so much to me! I will update the existing Vue course once Vue 3 is final, got no plans on C# at the moment though.
@@academind Wow, thanks a bunch for this. Also, really, when your delivery, your preparedness, your explanations and your in depth analysis is compared to the rest of the instructors out there, most of them eat your dust, for real! I mean, sure, Brad (Traversy) does a stellar job too and some others try hard, occasionally. But you present stuff from all angles and cover everything so succintly that even when something gets updated (a la React pushing for closures/hooks everywhere) the knowledge and software depth one gets from your courses allows someone to clearly stay on top of the new developments. Excellent job, excellent.
P.S. reconsider C#, I am aiming to slowly study it really well and go for the certification - and I know a course by you would be the ultimate preparation for it, so I am willing to pay top euro for it - i.e. I have only two kidneys but we can talk this through :P
This composition API make Vue more and more like functional programing style which is awesome (I really like it when using React) :3
Looks awesome! I didn't really enjoy working with Vue 2 as much as I hoped to, but with the new Composition API and better TypeScript support, I'll surely give Vue another chance (once it's out).
Max is max..💛 love max
Gary gaaaay
Teachers are next to god means Acharya devo bhava..not offensive word
That was a great introduction to Vue 3 max... But I feel it's too much for simple to medium vue apps as the Vue 2 syntax is more predictable where you can find ur data.... Consider a 100 data variables are there and for making everything reactive we need to surround everything with the keywords reactive and ref... It's crazy
Why not mimic data object with one single reactive variable in setup?
setup() {
const data = reactive({
products: [],
show: false
})
...
return {
data,
...
}
}
I really like this new composition API. Looking forward for Vue 3!
@@GungooseHonk and what about all computed and watch elements in your component. Will you mimic it too?
It's too many data inside one setup method and with those reactive, ref and .value it becomes more difficult to read.
This is why is an alternative approach, use which one is best
It does look a lot like React Hooks. I feel that the Composition API will become a de facto standard, and may take away most of what makes Vue feel intuitive...
for what i understand the pro is that you can separate things in reusable javascript files
Unit testing would have been a great addition.
Max is Infinity. Superb stuff always.
You too bro. Your videos too always has deep information.
@@anandbaraik5010 Thanks man. Means a lot.
The new api is great. The proxy api enables reactivity, so you do not have to declare data and functions as different object properties which is great and now can easily split data and code.
I am really curious how computed is implemented under the hood, basically how that function finds out which reactive data are used inside its body. The only way I can think of is parsing the body of the function and finding out which values are passed from the closure.
mabey, some regx ??
Finally normal functional-way of writing things in Vue. Thanks Evan! ^^
The only thing I didn't like in Vue were the options, where you were limited to pass only object/array properties and nothing more
2AM
UA-cam: Do you want to learn some Vue 3 new api
Me: Click
Thanks Max, that’s a great intro and alleviated my confusion around the Composition API. I have to say, I’m not sure I like it. Seems somehow dirty and messy. I feel like a neater structure would be something like this:
export default {
compositions: {
infoComposition: {
data() {
return {
showInfo: false
}
},
methods: {
// info methods
}
..etc..
},
productsComposition: {
data() {
return {
products: []
}
},
methods: {
// products methods
}
..etc..
}
}
}
And then just keeping all template syntax as-is.
Maybe I’ll come around to it after using it on a complex app.
Akifcan Kara thanks! 👍
Danny do you plan more courses for Quasar? All I know you have the only quasar-course in the planet and hence in Udemy. This alone is a wonderful Quasar intro, and well choosen classic Todo-CRUD app.
But I struggle whenever I want to change the boring quasar layout. For example I want a bootstrap style dropdown menu (complete drop-down of the toolbar). I've tried with q-expansion-item (accordion) but the all other elements of the toolbar, centered vertically when I've opened the expansion-item. So I've replaced it with btn-dropdown. But I use expansion-item in mobile version of the menu. I wished however a common solution for both cases, etc, etc...
For such nitty-gritty details one need more Quasar tips-tricks. Quasar is the best Vue framework and need more attention.
Hi 2002budokan. I don’t want to hijack Max’s video. Can you please ask this on one of my videos. 👍
There is no reason for so much boilerplate. The main reason for splitting into data and methods in the he first place was to declare everything returned by data as reactive internally.
Now you can just return a simple object, with data and functions and the data are already wrapped into a function making them reactive.
This api is much simpler and will greatly reduce code duplication.
It can also help reduce over splitting components just because this was the only way to split functionality
Actually, there is no difference your solution between Max used mixins.
Here is example making without using external .js files as you said.
codepen.io/navi3591/pen/RwNGYEZ?editors=1011
Never searched deeply but I think, this syntax is not totally for just "make code prettier or reusable for developers", the biggest reasons are performance and typescript. I would be in love if there is a official way to make Vue.js + typescript + .net Core with SSR support from Microsoft :)
This composition API really fixes my main issue with the framework. After a while it could get really hard to keep track of all the different things going on inside big components. I'm looking forward to using Vue with this API for my next personal project.
Love it! I could fastly learn advantages and how to use the Composition API. Thanks Max!
I don't know. Using a single setUp function to do several things - create composition parts; link reactive parts together, and returning the final "data" object smell. And how does one get dependency injection to work here?
The irony here is that composition problem is one of the fundamental concepts of OOP and this has been solved over 25 years ago. The twist here is one needs REACTIVE composition and even that has been solved by Reactive frameworks. This setUp approach seems to reinventing the square wheel.
Awesome tutorial, one question why pass functions to child components? Thought we should use events to do this kind of thing
Hi Max, I am missing the link to the source code. It isn't in text below the video. Thanks!
Aha! Somebody get ridden "low coupling, high cohesion" and really think about it! :) Thank for this tutorial, its great! And it's totally clean for non-native speakers.
you really a great teacher and this is the best channel in the world ,thanks very much for your great effort.
Looks awesome! What did you do in VS Code at 23:05 to get the return object to format nicely? Is that an extension?
prettier.io/
A lot of jealous React fanboys acting like Apple fanboys (every time Android comes out with a feature).
FYI: Hooks existed many years before React was created. Act like you knew.
If I could give you more than 1 thumbs up I would
@@anthoniG it's annoying because I just come here to learn.
I definitely don't waste my time bragging about Vue over in the React forums. What good does that do?
@@RorySilva Well people are weird lol. With some if you are not using a framework than them they get antsy. It's like Android and iOS all over again :(
What about us misunderstood EmberJS fanboys? 🙄☺️
@@JakobBjerrePetersen The right tool for the job! Can you solve the problem? Create a solution? In a reasonable amount of time? Go for it!
If I understand composition API correctly, it can add more performance in reactivity mode due to ability to control it manually compared to Vue 2. This can be very helpful on older mobiles with less powerful CPU.
One area that Svelte shines the most is in reactivity speed due to lack of VDOM and less automated DOM update.
How do you use the composition api with Vuex
Thank you for your help Max! Really appreciate these videos especially your efforts. Thank you!
Glad you like them, thank you!
Congratulations on a very well structured introduction to VueComposition API. I’m not sold to it however and it seems a high price to pay just to maintain some backward compatibility. These new levels of indirection and hidden magic traded for some lexical practicality... meh. I would have preferred if they broke the whole model and fused all this with VueX stuff in a really elegant approach. That is what major versions are for. This should have been 2.8.
I'm still in a wait and see for Vue in terms of creating a large and scalable enterprise application. We evaluated for Vue and Angular last year for our large application and opted to rewrite it in Angular 8 and upgraded to Angular 9.
great explanation!! but I am a little confused about why we don't need to return { isValid : isValid.value } at the end of ProductForm.vue setup method.
Pretty clear by now that the Angular team was right in making Typescript default language. Everybody else now scrambles to move in that direction 2-3-4 years later. Same with Observables and Rxjs support.
Thanks for that great course! But I couldn't see the start code link below the video. Regards!
You were not passing functions as parameters in Vue2 courses. So, why did you prefer it here: For brewity? In the absence of a Vue3 compatible Vuex? Or isn't it not an anti-pattern anymore?
Will there be a point where old syntax won't be supported
You might want to revisit the concept of the exclamation mark
:P
Thanks from France ! Very good explanations, I use Vue only since 2-3 months and the organization of the code is a real problem for me (go to the data, and after to methods, search where is the function corresponding to my data etc..) That's boring, and these new features are perfects for me!
Sorry for my english lol
I love functional programming, but I agree that this is a lot for even medium sized apps. Personally, I can see the value of this if you're creating a new project knowing you will have a lot of reusable code and large components. I have definitely struggled with data readability in larger components. Otherwise, I feel that the options api is better for me. Regardless, this is an incredible addition and goes to show just how much the Vue team cares about their framework and users.
This is interesting, I'm wondering how this works with Vuex though. Thanks.
Yeah good question !
Only with vuex 4.0, it's in git repo separate branch
Flavio Konti I use vuex a lot. With something like this, might not need it as much
How come I can't see the starting project link. Was it scraped or something?
A question: Will your vue 2 course be updated to vue 3 or will there be a new course?
The current course will be updated once Vue 3 is final.
@@academind im not into the courses anymore BUT props to you for doing that.
Finally i understood what the composition api is. It's like React Hooks... don't like it, i hope i will not be forced to use it 😃 but really thank you, your explaination is clear and i really understood everything, you are the number 1!
Yo! Your english improved. Have an old VUE course as reference. Keep your great content and courses coming.
which screen recorder do you use to making your videos) I'm also want to make tutorials in my country) Uzbekistan
Organization isn't a problem in typescript Vue applications, as everything is stored in a class with decorators used to define watchers, props, etc.
I really really thank you for this video. Happy to see you creating videos for vue
Hi Max, Where is the link to starter project?
Could someone post a link to the initial project Max is using?
You mentioned that there is a link to the starting project below the video, but I can find nothing in the description? Is there a repo with the code anywhere?
is passing functions as props not considered anti pattern?
I didn't get yet what is the real advantage and difference using vue composition vs mixins. I can encapsulate all my logic and methods and separate it with mixins.
Very powerful, you can’t go back once you learn it. Is it ready for production?
Thank you, finally understand the api's use!!
Is it possible to use the the class syntax?
@Academind There doesn't seem to be a link to the sample project in the description any more...
Followed all of the links and none of them are the starter code... :(
thanks max is vue 3 still in virtual dom or kanda like svelte
Great video and very nicely explained. Thanks a lot.
With this API, writing vue code now looks a lot like React with React hooks
and that is why I just switched to React. Because of also the work demand
Only for simple things, but if you work on something real then you'll appreciate Vue's composition API mainly because maintaining dependencies with react hooks becomes a nightmare.
In my opinion the best thing about Vue is its reactivity system (which ironically doesn't exist in react), this becomes more apparent when using react hooks and comparing it with Vue's composition API.
The only reason I would even consider using React instead of Vue today would either be:
1. React is more popular (has more jobs)
2. or some React only libraries which might be critical for some projects (like Drafjs or Slatejs).
None of which are technically React pros or Vue cons.
@@aan3387 Tiptap seems like a good replacement to Slate and Draft js.
i am way too excited for a normal healthy life about vue 3 coming out!
Basically, almost all of the lifecycle functions that were used in Vue 2 will be wrapped in the setup() function. I think this is good.
Just wondering what will happen to the $data function...
Hello,
Where can I found starter and finished Project file?
Hi max, big fan here. On the first look it seems to me an organizational code upgrade, let's give it a shot.
You're insame broh!!
Thanks a lot, it makes me more confident to migrate to Vue3 ;-)
if you check out the source code for 3.0, they are using js meta programming Proxy
Could you provide an example how to work with $store, $router and etc, without access to this?
Should I import this via `import store from './store'`?
Hi Max, an amazing tutorial (as always) I'd like to ask what do you think, is the composition API production ready already or should we rather wait until it's released in Vue 3.0?
Vue devs: Vue is simpler than React
Vue authors: hold my coffee... 😂
Devs: I don't like react I think I will use cue
author's: Are you sure you really should be using react.
yeah my thoughts exactly... there goes the simplicity out the window :D
This is optional. You can build Vue apps just like before.
@@mortenfinkbuchhave641 It's optional
@@FilipCordas It's optional.
Thanks for the introduction. Quite an interesting new mechanism. By the way, there is no need to define a 'isValid' variable within the isValid computed function. You can just return false if the conditions are matching and 'true' after all tests.
Thanks for this! Nice intro to the composition API
Thanks Maximilan, you're the best!
Your Tutorials are very nice.kudos.Have some queries/comments
1. Passing a function to child component and executing in child scope doesn't look good to me
2. Mixins are good for vue.
3. I think you should have had a separate login component there
4. Why did vue team ignored mixin aliasing concept, instead they created this composition api?
Something like an instance of that toggleMixin with a name say login and then use login.toggle() and login.show
What is your vscode theme?
Cool! Can't wait to use it in prod
Thanks Max, I enjoyed the video, great work.
Great vid as usually! Thanks a lot ! But i think it's better to stick with traditional vue approach until next version release and then all the things should be at right place. Now it looks like vue2 + comp-api = (rather)pain in s.
Thank you for this video Max.
Thanks man! This was super useful! And helpful!
Great work as always !!
Thanks for your great efforts.
Max you're full of action and always up to date; so thank you once more for all your great videos and your very detailed master-piece Udemy courses.
I didn't like the new API. I don't think it will be a success story. You say, useful for bigger components? Well, we should fight against bigger components. When a component becomes bigger, we should refactor it. Divide it to subcomponents, js modules etc. To me the Vue is the "Love at first sting", but I don't think that the new API is necessary.
Lastly, what do you think about the Danielo515's and olivier delmas comments below?
@no1youknowz Today I'm quasi forced to use the new API, 'cause I want to implement a component with XState inside. They provide two different methods for the injection of their Machine (StateChart) into a vue component. The first one using the old API, and the second one with the new composition API. And liked the injection via setup() method. I think it will take some time to get used to it.
Max, you are great teacher! Thanks and cheers from Russia =)
So happy to read that Alexandr! Greetings from Germany :)
Excellent tutorial as always
Amazing! Keep up the good work!
Hi Max Brilliant as always :) One quick question I have onMounted where event is getting data - my local LET variable is let club = reactive({}); how to set in one go variable club = data. It works if I define all properties first but I dont want that I just want pass object to let club = reactive({});
BTW it works IF I do:
let club = reactive({
data: null
});
and then in event club.data = data; BUT I dont want ot have extra club.data.id but club.id
Great tutorial as always!
where can I download the source code? Thank you!
I found style of writing composition API partially similar to the Reveling module pattern.
My jury is still out on this. I suppose when I start building much bigger apps with Vue, I will come to appreciate the composition API. Nevertheless, it is a wonderful addition to the features on Vue
Great video. Thanks Max. At this point I may as well switch to react. The reason I chose Vue was for the syntactic magic and less ceremony code. If I'm going to treat everything like pure functions then why use Vue at all? Svelte may be a nice replacement too. Much more idiomatic IMO.
Some time ago I stumbled upon an article , which stated you shouldn’t pass functions in props, because there are emitters for that in Vue.js. I’ve never thought about it so much, but what do you think Max? I see that you do it here in the video and I was just curious :).
I did it here because I'm so used to it from React. You absolutely could use an emitter - I'd argue both is fine. You just have to be consistent. I do use both, depending on the project I work on.
Academind thank you for an answer man! Have a great day and keep on doing such a great work :)
Why would you fire the poor toggle product info? Has her performance decreased?
Vue 3 course maybe Max, like the update to typescript you did for 2019
I will indeed update the existing course as soon as Vue 3 is final.
Thanks Max for the video 🙏
Why do you send function to the component as prop?
It's not a good practice. Why don't you use "events"?
it's now past halfway in 2020 and it seems vue3 still hasn't come out as the default stable version. maybe in q4
Check news section on their site, it comes in august!
Vue 3 has just been released!
When I do vue --version I get 3.8.4 as of December 12, 2019. So why do you say "vue 3 is not out yet?"
Is that your CLI version?
@@flogginga_dead_horse4022 Oh, that's it. That command is used to check the vue cli version, not Vue.js version itself. Thanks.
감사합니다. Thank you for sharing good contents. nice explanation.
Great Video Max, love your content. I have bought a couple of your courses on Udemy. Amazing contnet
sadly it did not improve your spelling.
Are you going to update the Vue course or make a new one
I will update the existing one.
everything is bouncing above my head. I always use pure js and I know ionic. Which is best for beginner to start among all react , vue , angular , nest etc ?
Don't hesitate to choose Vue, it has smoother learning curve and beloved by developers.
I had the same question a couple of years ago. I chose Vuejs. I am happy I made the right choice.