docs: add mastering pinia link

diff --git a/packages/docs/core-concepts/index.md b/packages/docs/core-concepts/index.md
index 01d458ccb96e70591613a7e333867ddbf1f185e4..4bbe1f9ff1ffc6b97cd3ed7ec9d1388e9c6afb70 100644 (file)
--- a/packages/docs/core-concepts/index.md
+++ b/packages/docs/core-concepts/index.md
@@ -98,7 +98,7 @@ Do not return properties like `route` or `appProvided` (from the example above)
 
 ## What syntax should I pick?
 
-As with [Vue's Composition API and Options API](https://vuejs.org/guide/introduction.html#which-to-choose), pick the one that you feel the most comfortable with. If you're not sure, try [Option Stores](#option-stores) first.
+As with [Vue's Composition API and Options API](https://vuejs.org/guide/introduction.html#which-to-choose), pick the one that you feel the most comfortable with. Both have their strengths and weaknesses. Options stores are easier to work with while Setup stores are more flexible and powerful. If you want to dive deeper into the differences, check the [Option Stores vs Setup Stores chapter](https://masteringpinia.com/lessons/when-to-choose-one-syntax-over-the-other) in Mastering Pinia.
 
 ## Using the store
 

diff --git a/packages/docs/core-concepts/state.md b/packages/docs/core-concepts/state.md
index 413557e9bca7d51823114e00cb414c9c70397ef5..3ce0538dc6bea57f640986815ed618dc87f08954 100644 (file)
--- a/packages/docs/core-concepts/state.md
+++ b/packages/docs/core-concepts/state.md
@@ -1,5 +1,9 @@
 # State
 
+<!--
+https://masteringpinia.com/lessons/the-3-pillars-of-pinia-state
+ -->
+
 <VueSchoolLink
   href="https://vueschool.io/lessons/access-state-from-a-pinia-store"
   title="Learn all about state in Pinia"

diff --git a/packages/docs/getting-started.md b/packages/docs/getting-started.md
index e7972c76091397fafd6daaa1a556f22aa761d9cc..30bd4aeed4e3d855c7b3b71bc18de30bc7d57f13 100644 (file)
--- a/packages/docs/getting-started.md
+++ b/packages/docs/getting-started.md
@@ -64,3 +64,7 @@ A store should contain data that can be accessed throughout your application. Th
 On the other hand, you should avoid including in the store local data that could be hosted in a component instead, e.g. the visibility of an element local to a page.
 
 Not all applications need access to a global state, but if yours need one, Pinia will make your life easier.
+
+## When should I **not** use a Store
+
+Sometimes we end up using a store for too many things. If you feel like your application is over using stores, you might want to re consider the purposes of your stores. Namely, if some of their logic should just be composables or if some of their state should be local to a component. This is covered in depth in the [(Not) Overusing stores](https://masteringpinia.com/lessons/not-overusing-stores) lesson of Mastering Pinia.

diff --git a/packages/docs/introduction.md b/packages/docs/introduction.md
index 389dcd357016cd49a4604b52cf6320aa117e1b65..7213ee392fc0d5bc1809630377a7a1e347ef55b1 100644 (file)
--- a/packages/docs/introduction.md
+++ b/packages/docs/introduction.md
@@ -9,8 +9,16 @@ Pinia [started](https://github.com/vuejs/pinia/commit/06aeef54e2cad66696063c6282
 
 ## Why should I use Pinia?
 
+<!-- 
+https://masteringpinia.com/lessons/why-use-pinia
+ -->
+
 Pinia is a store library for Vue, it allows you to share a state across components/pages. If you are familiar with the Composition API, you might be thinking you can already share a global state with a simple `export const state = reactive({})`. This is true for single page applications but **exposes your application to [security vulnerabilities](https://vuejs.org/guide/scaling-up/ssr.html#cross-request-state-pollution)** if it is server side rendered. But even in small single page applications, you get a lot from using Pinia:
 
+- Testing utilities
+- Plugins: extend Pinia features with plugins
+- Proper TypeScript support or **autocompletion** for JS users
+- Server Side Rendering Support
 - Devtools support
   - A timeline to track actions, mutations
   - Stores appear in components where they are used
@@ -18,9 +26,8 @@ Pinia is a store library for Vue, it allows you to share a state across componen
 - Hot module replacement
   - Modify your stores without reloading your page
   - Keep any existing state while developing
-- Plugins: extend Pinia features with plugins
-- Proper TypeScript support or **autocompletion** for JS users
-- Server Side Rendering Support
+
+If you still have doubts, check out [the **official** Mastering Pinia course](https://masteringpinia.com). In the begining we cover how to build our own `defineStore()` function and then we move to the official Pinia API.
 
 <VueMasteryLogoLink for="pinia-cheat-sheet">
 </VueMasteryLogoLink>
@@ -124,6 +131,10 @@ export default defineComponent({
 
 You will find more information about each _map helper_ in the core concepts.
 
+## Official Course
+
+The official course for Pinia is [Mastering Pinia](https://masteringpinia.com). Written by Pinia's author, it covers everything from the basics to advanced topics like plugins, testing, and server-side rendering. It is the best way to get started with Pinia and to master it.
+
 ## Why _Pinia_
 
 Pinia (pronounced `/piːnjʌ/`, like "peenya" in English) is the closest word to _piña_ (_pineapple_ in Spanish) that is a valid package name. A pineapple is in reality a group of individual flowers that join together to create a multiple fruit. Similar to stores, each one is born individually, but they are all connected at the end. It's also a delicious tropical fruit indigenous to South America.