Proven Pinia Patterns - VueConf US 2023

With Vue's new-and-improved state management library, we gain a much more modular tool. While being more flexible and lacking the Mutations of Vuex, Pinia presents us with more opportunities to be creative (for better or worse) with our app architecture and how state management is conducted and organized within it. This talk by Vue Mastery's own Adam Jahr explores some @posva-approved best practices and architectural design patterns to consider when using Pinia in production.
Ready to master Vue.js? With weekly Vue js tutorials on the latest topics, and exclusive content with Evan You (the creator of Vue), Vue Mastery is the ultimate learning resource for Vue developers to level-up their skills. Watch more free Vuejs tutorials 👉 www.vuemastery.com/courses
0:00 Intro
3:39 When and why to use Pinia
6:45 Options vs Setup stores
11:02 Modular by design
12:35 Store-ganization
17:12 Accessing state
21:31 Mutating state
28:06 Other ways to work with Pinia

[@kimballle7714]

nice! seems straight forward.

[@ryans4584]

That @posva approved checkmark is ace 😀

[@kenjohnsiosan9707]

thanks for sharing

[@st3nsvk]

I don't see any patterns in the course. It's just like going trough total basics from docs.

[@heruhailiuhuang533]

Yes no more new insights. More advertising but it is ok for new pinia developer

[@oemeraran8183]

I really find it hard to find good advanced patterns for vue 3 in general.. every tutorial or talk just scratches the surface and basically summarizes the docs.. how about solving some more complex problems by example...? All the content is made for complete beginners, which really annoys me lately.

[@em9999999]

@oemeraran8183 You'll find that Nuxt 3 solves most of those questions you might have automatically

[@glatocha]

Good talk, what software was used for the presentation? I like the animations a lot

[@jlovas]

Why don't you use the return block to create getters, actions and watchers in setup mode? Then you wouldn't have to list them separately.

[@alibahrami6810]

very very sweat talk 🍍

[@balmberg]

The presented store.js example (4:15) does not work. I'm having only a small use case where Pinia is overkill.

[@sandorturbucz425]

For a small use case just use composables, and/or provide/inject. Some say even for big use cases you only need composables, you can actually use it just like pinia aka a global state store.

[@chil1181]

How do I create a local store?

[@DontFollowZim]

At 20:37, shouldn't that be userFavorites.value.push...?

[@bergerblancsuisse.]

No because userFavorites would have been initialised as shallowReactive([])