Learn Vuex in 30 MINUTES! (Vue JS 3)

In this video I’m gonna show you how to get started with Vuex (within a Vue 3 project) - in around 30 minutes!
👉 My Courses: dannys.link/courses
👉 Download Fudget: www.fudget.com
👉 My VSCode Setup: dannys.link/vscodesetup
👉 DONT CLICK THIS: dannys.link/dontclick
0:00 Introduction
0:52 Create a VueJS 3 Project
2:39 Counter App - Design
4:35 Counter App - Data & Methods
6:08 What is Vuex?
7:54 Vuex Store Sections Explained
10:51 Setup State
12:01 Setup Mutations
13:54 Setup Actions
20:01 Setup Getters
22:01 Vuex & Two-Way Binding
28:19 Child Components
We’re gonna create a simple counter app - in the usual way Vue JS way - by adding data and methods to our view component.
And then we’re gonna move all of our data and methods into a Vuex store - using State, Mutations, Actions and Getters.
You’ll also see how to use an API within Vuex - using Axios.
I’ll also explain what Vuex is and why you would use it.

[@MakeAppswithDanny]

Thanks for watching! Please like, share, subscribe & leave a comment. All of these really help me to create more content for this channel. Timestamps:
0:00 Introduction
0:52 Create a VueJS 3 Project
2:39 Counter App - Design
4:35 Counter App - Data & Methods
6:08 What is Vuex?
7:54 Vuex Store Sections Explained
10:51 Setup State
12:01 Setup Mutations
13:54 Setup Actions
20:01 Setup Getters
22:01 Vuex & Two-Way Binding
28:19 Child Components
👉 My Courses: dannys.link/courses
👉 Download Fudget: www.fudget.com
👉 My VSCode Setup: dannys.link/vscodesetup
👉 DONT CLICK THIS: dannys.link/dontclick

[@Jjjabes]

One of the best tutorials I've seen in a while. Really well explained and to the point. Thank you!

[@MakeAppswithDanny]

Thanks JB!

[@PurpleGlobe]

I'm teaching myself to code, and have had a hard time understanding Vuex. This has helped a lot!

[@MakeAppswithDanny]

Glad to hear it PurpleGlobe! 👍

[@hamzadahmoun5102]

coming from Asp Net Core and C# .... trying to learn Vuejs, and now Vuex, I had actually 0 difficulty to understand this tutorial! Thanks a lot Danny

[@MakeAppswithDanny]

Great to hear Hamza!

[@werneralonzo1230]

Finally I understand how vuex works, thanks for the great tutorial

[@MakeAppswithDanny]

Wow, thanks Werner!

[@ianmcfall7]

This translation from vuejs to vuex was critical to my project and my learning. Thanks for laying everything out and addressing all the presuppositions. Cheers!

[@MakeAppswithDanny]

Thanks Ian. I'm glad it was helpful!

[@jesseschoonveld7706]

Thanks for explaining things so clearly! Been learning this with help of the documentation but this video really helped me wrap my mind around this concept.

[@MakeAppswithDanny]

Glad it helped!

[@octavian3033]

Awesome stuff. Just came from your composition API tutorial and I must say these have been a lot of help.

[@MakeAppswithDanny]

Glad it was helpful!

[@vampirejs758]

How about making an ionic vue app tutorial or one more Quasar framework video.......... love your videos

[@paulotrajano83]

The kind of video you want to watch over and over again. Thank you very much, Danny! Greetings from Brasil

[@MakeAppswithDanny]

Wow, thanks!

[@tartarusdivision1054]

hands down one of the best tutorial channels out there

[@MakeAppswithDanny]

Wow thanks Tartarus!

[@davel9130]

So good. This course covers essential aspects that I haven't been able to find elsewhere (a tutorial that discusses updating the Vuex store via an async API). Thank you!!

[@MakeAppswithDanny]

My pleasure, Dave. Thanks for watching! 👍

[@jeyjeymohaa3081]

First time i found your channel, easy and direct to the point explanation. Definitely subscribing🤗

[@MakeAppswithDanny]

Thanks Jeyjey. Welcome! 👍

[@ricklove8358]

this was very helpful. keep on the hard work we are here to support you through thick and thin.

[@MakeAppswithDanny]

Thanks tarick! 👍

[@jbarriossandrea]

I usually play videos at 2x speed but this video is so straight to the point I didn't needed to, thanks for the great video 💪

[@MakeAppswithDanny]

No worries, thanks Jhonny!

[@Tommy-ev6gv]

This was really good Danny, learned alot from this!

[@MakeAppswithDanny]

Glad to hear it Tommy!

[@sunraiii]

So clean and concise.
I love it when tutorials start from the bare minimum and build up apps atom by atom.

[@MakeAppswithDanny]

Thanks that's very kind!

[@d30x58]

Thanks so much, learned Vue for the first time from your tutorials and I've been loving it since.

[@MakeAppswithDanny]

That's great to hear Deon, thanks!

[@joshuaberrios]

I am grateful to have found this tutorial. Very clear, concise, easy to follow, and super helpful. I have been needing to learn more about VueX State Management for my new software engineering role and finally came across this video. Also, noticed you have not uploaded in a while, will you be uploading new content soon?

[@MakeAppswithDanny]

I'm focused on getting my app (Fudget 2) released at the moment: www.fudget.com
We are beta testing at the moment, so hopefully won't be too long. Once it's published and stable I will hopefully start doing videos again. 👍

[@napoleonbonaparte1260]

I will share this vuex tutorial to the vue js group in Facebook. This tutorial is the best I seen so far. Keep it up, you are a great software developer/professor.

[@MakeAppswithDanny]

Wow thanks Napoleon! 👍

[@ibrahimyosif]

very useful tutorial, thank you for explaining in detail and a decent pace

[@MakeAppswithDanny]

Glad it was helpful Ibrahim!

[@illusiveCode]

This tut couldn’t get any better, thanks for making vue easy to learn!

[@MakeAppswithDanny]

Thanks illusiveCode. I've got a "Learn Pinia in 30 MINUTES!" video coming soon too! 👍

[@Yabai-fc9kv]

To the point and easy to understand!
Thank You!

[@MakeAppswithDanny]

Thanks Sonam!

[@oketafred]

I think the best Vuex Tutorial on TH-cam for me. Thanks, Danny

[@MakeAppswithDanny]

Thanks Oketa!

[@hillno]

Great tutorial! Love it starts from the beginning

[@MakeAppswithDanny]

Thanks Hieu!

[@anhhoangtuan4865]

Thank you saved me a lot of time trying to browse videos for an actual working one

[@MakeAppswithDanny]

No worries, thanks Anh!

[@myblender3djourney]

This is exactly what I needed!!! Thank you so so much!!

[@MakeAppswithDanny]

You're welcome!

[@MeonisRP]

It was a complicated theme for me, but I finally got it. Thanks for the tutorial!

[@MakeAppswithDanny]

My pleasure Олег! Glad it helped 👍

[@knotcircle2844]

You explained better than the videos I watched before. Good thing I found your video, I saved lots of money without signing-up to the course I have difficulty to wrap my mind about Vuex

[@MakeAppswithDanny]

Glad it helped Mogi!

[@maskman4821]

I am pretty sure it is the best vuex tutorial, I have learned a lot from this 30 minutes tutorial which Danny condense the essence / core of vuex in this terrific example. Danny is an excellent instructor / teacher / developer, everything is straight to the point, walking you through every step with great and detailed explanations. if you want to learn building mobile apps with vuejs, Danny's tutorials / courses are the only and the best !!!

[@MakeAppswithDanny]

Wow, thanks Stephen. Great comment! 👍

[@Raj_Patel21]

Concise and to the point, Thanks for the video :)

[@MakeAppswithDanny]

Glad it was helpful Raj!

[@fariazkhan1779]

Great explanation. It was very easy for me to learn Vuex. Thanks for the video!

[@MakeAppswithDanny]

Glad it helped Fariaz!

[@marksantosss]

This video is precise and well explained. Thank you danny.

[@MakeAppswithDanny]

No worries. Thanks Mark!

[@juzerhakimji9720]

Beautifully explained. Really helpful Thanks :)

[@MakeAppswithDanny]

Thanks Juzer!

[@Pss19940909]

very clear and to the point. Thanks a lot for this video!!!

[@MakeAppswithDanny]

Glad it was helpful, Ashley!

[@gowdhamt1651]

Thank you very much for such a crisp and clear tutorial.

[@MakeAppswithDanny]

You're very welcome!

[@danmontesinos2094]

Hands down! Finally understood how Vuex works. Thanks for creating this great video!

[@MakeAppswithDanny]

Thanks Dan. Glad it helped!

[@iAmTheSquidThing]

This is the best introduction to state management I've ever seen.

[@MakeAppswithDanny]

Wow thanks Martin!

[@abhinavkashyap2196]

Great video. Clear and to the point. Thank you! You earned a sub.

[@MakeAppswithDanny]

Thanks Abhinav, welcome aboard!

[@ravimukti690]

Very best tutorial ever, clear and strike to the point, thanks for the video

[@MakeAppswithDanny]

Glad it helped Ravi!

[@raymondkalumbajoseph5789]

Am coming from react just two days into vue, have found this video interesting with great explanations on the state management using vuex, big ups Danny

[@MakeAppswithDanny]

Thanks Raymond. Hope you enjoy Vue 👍

[@MrScalleta]

Danny please more content for Quasar Framework! Cross-platform apps are the future!

[@googleanalytics3717]

I agree with all the commentators - really the best lesson of all while being simple and visual! Thank you!
And for Christmas, I want the same haircut 🥳🎄

[@MakeAppswithDanny]

Be careful what you wish for 😂

[@sanjaytk]

Wow!! nicely clarified the store... thanks for sharing 👌👌

[@MakeAppswithDanny]

My pleasure 👍

[@rpralica]

Thank You .Your tuts are very simple and understandanble.

[@MakeAppswithDanny]

Thanks Rade!

[@scientist.entity6609]

Amazing channel and its rly easy to understand you. Thank you !

[@MakeAppswithDanny]

Glad you think so Enguerrand!

[@koleto155]

Understandable, Focused and Practical => Excellent

[@MakeAppswithDanny]

Thanks Koleto!

[@jeremiaholuwaseun7327]

God bless you sir, you just made my day. simple and straightforward

[@MakeAppswithDanny]

Glad to hear it Jeremiah!

[@sergioalejandroservinarce3005]

for Christmas I want you to appear again with the quasar video series, thank you!

[@MakeAppswithDanny]

Thanks, we'll see what Santa can do 👍

[@ramasif9983]

Smashed the like-button! Keep up the good work, Danny! Wish: more Quasar videos!!

[@MakeAppswithDanny]

Thanks Ram! 👍

[@demolatheophilus9394]

You've really helped me so much 🙏🙏.
Bless you sir.

[@MakeAppswithDanny]

Glad to hear that Demola!

[@shubhamjain8130]

wonderful video and the way of teaching..Thanks a lot!!

[@MakeAppswithDanny]

Thanks Shubham!

[@josephridge3646]

Thank you Mr.Danny this is a well laid our tutorial ! Thank you again

[@MakeAppswithDanny]

My pleasure, Mr Joseph! 👍

[@SushanGhimire55]

Finally best vue3/vuex tutorial popup on my timeline❤️

[@MakeAppswithDanny]

Thanks Sushan. Glad it helped! 👍

[@gesley_neres]

What a great tutorial. Congrats Danny!!!

[@MakeAppswithDanny]

Thanks Gesley!

[@GergelyCsermely]

Thank You very mutch. Excellent tutorial. Very professional examples.

[@MakeAppswithDanny]

Thanks Gergely!

[@hotchaddi]

Legends say that Danny is still giving hearts to this day!

[@harishpillarisetti6658]

You're King Danny. A King.

[@unkn0wnrge189]

Thank you very much! Only video in youtube where I really got Vuex, because it is a simple example, now I remember a tip from a developer which told me "When learning start with small projects", I only wish you had covered modules.

[@MakeAppswithDanny]

Thanks! Couldn't agree more. The simpler the better, at first!

[@christianjayreyes4962]

Just subscribed! Wonderful tutorial!

[@MakeAppswithDanny]

Thanks Christian!

[@emcysquare]

Very well explained and clear, thanks

[@MakeAppswithDanny]

Thanks Marco!

[@marcelodheni]

absolutely great, thank you very much for the content, cheers from Brazil.

[@MakeAppswithDanny]

Thanks for watching Marcelo!

[@jrguedes]

Thank you so much. I've learned a lot of things from this video

[@MakeAppswithDanny]

Glad to hear it Júnior!

[@thaleschadiarakos196]

Great tutorial!. It helps me alot. Thank you

[@MakeAppswithDanny]

Glad it helped Thales!

[@whatinthai]

Amazing VDO, easy to understand Vuex and clearly explaination. Thank u

[@MakeAppswithDanny]

Thanks!

[@nickbrown6754]

Really helpful and simple little video thank you.

[@MakeAppswithDanny]

Thanks Nick 👍

[@JacobDunbar]

exactly what i needed, thanks!

[@MakeAppswithDanny]

Glad it helped, Jacob!

[@narekpetrosyan7989]

finally I managed to find an actual video or some kind of tutorial about Vuex, thanks a lot mate, you're doing a great job for such people like me (trying to move from react+redux to Vue), I am looking forward to seeing your actual videos about Vue

[@MakeAppswithDanny]

Thanks Narek! Glad it was helpful! Btw, what made you decide to move from React to VueJS?

[@narekpetrosyan7989]

​@@MakeAppswithDanny Truly I can't explain it, besides I don't want to stay only with React and Redux

[@mrinalsharma9540]

Best vuex crash course till date! Thanks man this was really helpful.

[@MakeAppswithDanny]

Thanks Mrinal!

[@IwonaSitnik]

Great material! Thank you!

[@MakeAppswithDanny]

Glad you liked it, Iwona!

[@marcunnocello3092]

It helped me a lot, thanks mate

[@MakeAppswithDanny]

No worries Marcunno! Thanks for watching & commenting!

[@rickycaron2177]

This video saved my life! I have an exam in 2 days which I didn't learn anything at all. And my teammate urged me to do the Vue project. I need to add user authentication for the Vue CLI. I found a lot of videos but they made me upset. Either use Vue 2 or use Vue in composition which I don't know or didn't make the sense of Veux. I worked 2 days on it and nearly gave up. Fortunately, I found this video which made the mechanism of Vuex so much clear! I am so excited and moved now. Thank you again for making this video!!!

[@MakeAppswithDanny]

Wow thanks Ricky. Glad it helped so much 👍

[@malek6303]

you are such a life saver

[@MakeAppswithDanny]

Happy to help!

[@franzdarellemacatangga858]

i hope you continue creating tutorials you are great at it. thank you very much.

[@MakeAppswithDanny]

Thank you Franz. Yes hopefully I'll start making more videos soon 🤙

[@yehezkielwijaya5863]

Awesome tutorial, thank You Sir!

[@MakeAppswithDanny]

Thanks Yehezkiel! 👍

[@omairzamir1246]

Very Well Explained in short Time...!

[@MakeAppswithDanny]

Thanks Omair!

[@user-rn9gh8uz8k]

Thank you for the excellent video. you saved my time a lot.

[@MakeAppswithDanny]

Great to hear! 👍

[@michael.028]

Excellent video Danny!

[@MakeAppswithDanny]

Thank you very much Michael!

[@mohammadnabi8910]

Superb video for anyone who wanna explore and learn the basics of Vuex.

[@MakeAppswithDanny]

Thanks Mohammad!

[@LowRider1500]

You are my hero, thanks for this awesome tutorial.

[@MakeAppswithDanny]

Thanks! 👍

[@Arabian_Epileptic]

You can also square the counter like this:
Math.pow(state.count, 2)

[@MakeAppswithDanny]

Slick 👍

[@imranlashari6578]

Wow Simple and straightforward in 30 minutes... Great

[@MakeAppswithDanny]

Thank you 🙂

[@nirajankarki6297]

Best Vuex Tutorial out there, Thanks Man!!

[@MakeAppswithDanny]

Thanks Nirajan! 👍

[@nickoquiamco978]

This is good. Thanks a lot!

[@MakeAppswithDanny]

Thanks Nicko! 👍

[@RavagetheRain]

Great video. Definitely makes Vuex a little more approachable.

[@MakeAppswithDanny]

Glad to hear it, thanks!

[@toyeseaderibigbe2363]

You don't know how helpful this was to me. Thanks I really really really appreciate it 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰❤️❤️❤️❤️❤️❤️❤️

[@MakeAppswithDanny]

Thanks Toyese I'm glad it was helpful 👍

[@vc7057]

Perfect ! That's what I needed :-)

[@MakeAppswithDanny]

Glad I could help, Valentyn!

[@illestoth9298]

This video saved my life. Thank you!

[@MakeAppswithDanny]

Great to hear, Illés!

[@bertrandatemkeng6509]

Thanks Danny. Its been a minute

[@MakeAppswithDanny]

Thanks Bertrand!

[@minskinho]

Excellent! Thank you very much!

[@MakeAppswithDanny]

Thanks for your comment Matheus!

[@dweebycat9929]

Very helpful, thank you!!

[@MakeAppswithDanny]

Glad it was helpful!

[@martinn1071]

thanks so so much !! super clear !!

[@MakeAppswithDanny]

Thanks Martin!

[@vulcan2230]

Thanks Danny, this tutorial was excellent

[@MakeAppswithDanny]

Thanks!

[@ASSassINS111111]

Great course! thank you!

[@MakeAppswithDanny]

Glad you liked it!

[@aswinpreman907]

Great video bro. Thanks a lot

[@MakeAppswithDanny]

My pleasure Aswin!

[@besmellahbasam5751]

Explained very well. thanks

[@MakeAppswithDanny]

Glad it was helpful!

[@mezianibelkacem650]

Wow thank you, it was amazing :)

[@MakeAppswithDanny]

No worries, thanks for commenting, Meziani!

[@truthteachers]

Really fantastic, Danny. I searched all over for a simple vuex course and found yours and learnt in 30 minutes, truly. Please keep me informed of all your upcoming courses

[@MakeAppswithDanny]

Thanks Murugappan! I have a course coming out very soon, "Vue 3: Composition API (with Pinia & Vite)" sign up to the newsletter to get the opening discount here: dannys.link/compositionapi

[@truthteachers]

@@MakeAppswithDanny I did already and i am already watching. In first video you said you will not do Pinia but the title says "with Pinia". Sort of confused here.

[@MakeAppswithDanny]

@@truthteachers It's because this TH-cam series is taken from my full Udemy course "Vue 3: Composition API (with Pinia & Vite)". Pinia will be covered in the full course on Udemy 👍

[@truthteachers]

@@MakeAppswithDanny I checked udemy and I guess from your reply the course is not in udemy yet?

[@MakeAppswithDanny]

@@truthteachers not yet but hopefully next week 👍

[@meetbardoliya6645]

You're the Gem! Thanks a lot:)

[@MakeAppswithDanny]

Thanks Meet! 👍

[@feyziz]

Bravo !.. Excellent job Danny;

[@MakeAppswithDanny]

Thanks feyziz!