@@hellocheng7071 Found it: marketplace.visualstudio.com/items?itemName=RobbOwen.synthwave-vscode You then still need to enable Neon Dreams (Descriped in the theme readme)
I hate the extra layer of indirection with the Vuex map* helpers. I always like code to be obvious and simple. I honestly don't know why someone would mind using the full store accessing syntax when it is pure and simple and readable and you don't have to hunt down an extra layer of indirection to find out where that function your calling is coming from.
What would be the difference on storing state at the root vue level and read/ update from all children vue components? To me, vuex is too verbose just to read write “global” state vars
bro, thank you so much, I just finished the video and had an unstoppable impulse to press the subscribe button ..... I almost broke my finger lol , you are a great teacher.
So I use Angular. Started learning Vue recently. so Vue does not use singleton services? We have to use state management like redux ie: Vuex? Is this the best practice for Vue?
Is it bad to put all my async code in actions that can be shared throughout my app. I find myself using this pattern a lot, rather then mixins, rather than putting asycn code in the component methods, i put it in async actions. btw i like the pro tip with mapgetters object.
@@ProgramWithErik Thanks for your reply Erik! Can I ask what do you mean it's cleaner? In what way? Yup, I understand the part about using getters if you need to transform the results, but if it's just a direct use of the state, what's the benefit of using getters?
Damnn, that was one hell of a clean explanation. I am new to vue but I have experience with react-redux and man you made my life so much simpler, thanks a lot!!
8:30, if you run into to that problem, stop, think about your poor life choices, take a nap, eat well, paint some UML diagrams, and refactor your way out of the messy race condition you've made. One of the few people I feel like slowing down. Gj.
IMHO you're using Getters wrong, I see this a lot. As the docs say 'Sometimes we may need to compute derived state based on store state', you don't need them to just return a store property, they are more like Vuex `computed` properties based on state. You can already access `this.$store.state.currentJoke` in your Component (or using the corresponding `MapState` helper) without needing a getter at all. The problem with the way you are using them is people end up thinking they need to create a getter for every store property, and you end up with loads of unnecessary getters just to access store props that are already exposed on the state.
To answer everyone's question, the name of the theme is SynthWave '84. It was in his top themes video (ruclips.net/video/IX6ADPY52Io/видео.html). To enable the glow, you have to press Ctrl+Shift+P and enter 'Enable Neon Dreams'
For the actions functions, they take in the store as the first argument, not state. I think you made a mistake on that side Erik. Great tutorial overall though :)
Don't know if it's an inside joke or whatever, but it's spelled like this: "(a)synchronous" www.merriam-webster.com/dictionary/synchronous www.dictionary.com/browse/synchronous?s=t dictionary.cambridge.org/dictionary/english/synchronous
I just learned that we shouldn't use index as v-for key attribute. There is a great article on this topic by Michael Thiessen: michaelnthiessen.com/understanding-the-key-attribute/ Hope this helps!
Your videos are a big save. The only problem for me is that you don't explain much when you are doing your magic, therefore this is the main reason I wouldn't purchase your Vue.js 3 course. That's a boomer for me because I really like your topics, but you must dedicate more time to explain the things you are doing.
Very quick and not really informative video...instead of explaining what's what you just sprint through the stuff without letting people understand them properly. By just copying your code I won't learn anything bruh
🚨 Sign up to Linode using the code below and get a $20 credit!
linode.com/programwitherik
pro trick : watch movies at InstaFlixxer. Been using it for watching loads of movies during the lockdown.
@Jairo Jake yea, have been watching on InstaFlixxer for years myself :D
@Jairo Jake Definitely, I've been using InstaFlixxer for months myself =)
@Jairo Jake Definitely, been watching on InstaFlixxer for since december myself :)
Hey, can you help me how to mounted mutation, I want to extract something and update state on page load , how would i do that.
Erik, what VS Code theme are you using? I love it.
It's syntwave ´84. Erik is featuring it here: ruclips.net/video/T_sL7SO4wMg/видео.html
The part where you explained mapGetters and mapActions and the fact that you could rename them, was insightful. Thanks!
Amazing. I was intimidated by Vuex at first but this tutorial really helped me. Thank you.
Dude, this was so good! My team and I are learning VueX and this really helped.
The most important Question: How did you get the glowing syntax highlight? Is this inclueded in your vs code theme or something else :D
ruclips.net/video/T_sL7SO4wMg/видео.html
Same question!!! The codes is so cool!
@@hellocheng7071 Found it: marketplace.visualstudio.com/items?itemName=RobbOwen.synthwave-vscode
You then still need to enable Neon Dreams (Descriped in the theme readme)
What theme extension are you using?
ruclips.net/video/T_sL7SO4wMg/видео.html
clean and right to the point explanation, I like how you code naturally even while making videos 👍
which extension are you using for higlighting color for some codes
I hate the extra layer of indirection with the Vuex map* helpers. I always like code to be obvious and simple. I honestly don't know why someone would mind using the full store accessing syntax when it is pure and simple and readable and you don't have to hunt down an extra layer of indirection to find out where that function your calling is coming from.
Thank You for the VUE content bro. We needed this
Dude, what VS Code theme is that? It looks sick.
Hi, I wanna get data from the store, make some calculation then pass it to the template. how can i achieve it?
Do you prefer Tailwind above Vuetify n Qarsar?
Any idea what extension is used for those colorful neon fonts?
Are ...mapActions and this.$state.dispatches the same thing? Or there is difference?
Best Vuex tutorial I've ever seen
very clean speaking, I now understand how state&stores behaves in VueJs, thanks so much, Erik
This was amazing. Great job explaining everything, Erik.
Glad you liked it!
What would be the difference on storing state at the root vue level and read/ update from all children vue components? To me, vuex is too verbose just to read write “global” state vars
Vuex is suited for more complicated projects. You can totally set up shared store without all those bells and whistles with Vue.observable
bro, thank you so much, I just finished the video and had an unstoppable impulse to press the subscribe button ..... I almost broke my finger lol , you are a great teacher.
please what is your theme name in vs code
You can simply use getters and actions after spreading mapGetters and MapActions by their names in template without wrapping them in objects
Victor Cozhuhari yeah I know, but I wrapped them in objects so I could change their names
Thank you, very useful info. What theme do you use in vscode ?
I saw the answer in the below comments
Nice tutorial, but I was hoping to see how you would update the store from the page as opposed to the state updating itself.
Great video Erick and cool Vscode theme!
An updated video about extensions and themes you use would be awesome!
What theme extension are you using?????????????????
Thanks a lot!! I really needed to cram this and your explanation was so perfect and spot on without wasting time
A quick way to refresh Vuex, to the point. MapState helper fn could also be added for completeness.
Oh yeah, that's true!
So I use Angular. Started learning Vue recently. so Vue does not use singleton services? We have to use state management like redux ie: Vuex? Is this the best practice for Vue?
Is it bad to put all my async code in actions that can be shared throughout my app. I find myself using this pattern a lot, rather then mixins, rather than putting asycn code in the component methods, i put it in async actions. btw i like the pro tip with mapgetters object.
How do you make your methods names glow?
It will be nice to see the tutorial of setting up the shared state for simple projects with Vue.observable
Dude ty for the tutorial. Helped me to keep going!
What is you vscode theme?
clean and well explained, thanks!
Good vimmer! Thanks! Coming from react background can understand vuex in 15 mins!
Why do we need to use getters and not read directly from the state? Isn't it reactive anyways?
It's a bit cleaner to use getters. And you can use getters to map, reduce, or filter your results.
@@ProgramWithErik Thanks for your reply Erik! Can I ask what do you mean it's cleaner? In what way? Yup, I understand the part about using getters if you need to transform the results, but if it's just a direct use of the state, what's the benefit of using getters?
Damnn, that was one hell of a clean explanation. I am new to vue but I have experience with react-redux and man you made my life so much simpler, thanks a lot!!
Direct, simple and clear! thanks a lot, great tutorial!
please make a video to show how to use vuex 4 + vue 3 + typescript + vue clie latest.
Great video, I learned a lot!
Great Tutorial!
Great content thanks for summing it up!
Which extension is that?
Hi Erik! Can I get the source code? Im quite new in vue js and i think your code will help me understand a lot on this state management
nice. What theme is this ?
Synthwave 84
Amazing. Thanks a million.
That was very smooth tutorial (y)
so cool thanks Erik
excure me,what's the vscode plugins
I like ur explaining. Thank you very much
Tquu soo much sir.. Nice and clean explanation 😊👍❤️
Helped a lot .. Thanks
extremely helpful content, thank you very much for that !!!
8:30, if you run into to that problem, stop, think about your poor life choices, take a nap, eat well, paint some UML diagrams, and refactor your way out of the messy race condition you've made.
One of the few people I feel like slowing down. Gj.
Very informative and great explanation, thank you!
thankyou eric, awesome
The BEST as always!
Nice exppanation dude, will be good to raise the text size.
Getting an error that looks like this? "npm ERR! typeerror Error: Missing required argument #1"
$ npm --version
3.5.2
$ node --version
v8.10.0
Maybe try: sudo npm install -g npm@latest
Node 8 and NPM 3 are deprecated :P
always on point ! ty :D
Awesome. I learned a lot in this video👍👍
Glad it was helpful!
IMHO you're using Getters wrong, I see this a lot. As the docs say 'Sometimes we may need to compute derived state based on store state', you don't need them to just return a store property, they are more like Vuex `computed` properties based on state. You can already access `this.$store.state.currentJoke` in your Component (or using the corresponding `MapState` helper) without needing a getter at all. The problem with the way you are using them is people end up thinking they need to create a getter for every store property, and you end up with loads of unnecessary getters just to access store props that are already exposed on the state.
thanks for the tip
Very nice, thanks.
Excellent teaching!
Thank you!
Fantastic stuff!
That keyboard thock is beautiful
Thanks for the content. Are you on Patreon at all yet?!
To answer everyone's question, the name of the theme is SynthWave '84. It was in his top themes video (ruclips.net/video/IX6ADPY52Io/видео.html). To enable the glow, you have to press Ctrl+Shift+P and enter 'Enable Neon Dreams'
How to mock state data
I AM READING YOUR BOOK!
How do you comment an entire line without selecting it?
commenting: CTRL K C
and un-commenting: CTRL K U
More info: www.google.com :)
I think CTRL + } is also for comment and uncomment entire line or selection (just in VSC)
Ctrl + /
For the actions functions, they take in the store as the first argument, not state. I think you made a mistake on that side Erik. Great tutorial overall though :)
I had a ridiculous amount of trouble getting this to work. Store was never recognized.
What was the problem? I'm having It too, cant acess getters because store is undefined
very good video，thank u
Learn Vuex in 10 mins.
Video length: 13 mins.
Learn Vuex in 15 mins.
Video length: 18 mins.
Haha yeah it went a few minutes over, but if you subtract out the sponsor it's closer!
@Kapil ... You should be happy (!!) with all the effort Erik does... #JustSaying ...
@@johnnydriesen7575 bro, i am. I was just being silly.
@@ProgramWithErik Hey thanks for the video. I was just getting started with axios in VueJS and your video was great help.
What is your favorite global or local state management in vue-apollo?
Thank you!
Don't know if it's an inside joke or whatever, but it's spelled like this: "(a)synchronous"
www.merriam-webster.com/dictionary/synchronous
www.dictionary.com/browse/synchronous?s=t
dictionary.cambridge.org/dictionary/english/synchronous
Alright, that was easy. thanks
You're welcome!
Should've shown how to update from payload
why
semicolons
Exactly
as cool as this colours are very difficult to follow up
Why do I feel like this is a joke😄😄
I just learned that we shouldn't use index as v-for key attribute. There is a great article on this topic by Michael Thiessen: michaelnthiessen.com/understanding-the-key-attribute/
Hope this helps!
Why do you say gitters instead of getters? xD
So handsome!
Synthwave '84 VS code theme
The Vue syntax is weird af. Totally inconsistent and has terrible naming conventions.
Too much boilerplate. Mobx is the only sane state management solution. Everything else is just ridiculous.
I hope I'll win and get your course for free. I'm 15 y/o
Your videos are a big save. The only problem for me is that you don't explain much when you are doing your magic, therefore this is the main reason I wouldn't purchase your Vue.js 3 course. That's a boomer for me because I really like your topics, but you must dedicate more time to explain the things you are doing.
Thanks for the tip! I do go a bit fast, I am trying different types of videos. Maybe I'll change up my teaching style
Very quick and not really informative video...instead of explaining what's what you just sprint through the stuff without letting people understand them properly. By just copying your code I won't learn anything bruh
Sorru Bruh! This is free content , if you don’t like it go somewhere else!
You just doing yourself & showing quickly. Not teaching others ;)
THanks for the tips!
Meh
Too fast, dude! It should be a hand-holding tutorial explaining every concept and decision you make, not a video showing how fast 'you' can code.
this is not a live video; just pause it whenever you want or set the playback speed~
Vue is dead
Troll
nah!
@@ProgramWithErik yes especially when they fired on of the lead devs because of some racist BS. F Vue
Prefer dreamweaver?
@@ThomazMartinez Just in case there was any doubt about whether or not this was a troll?! 😂