What is Pinia?

Pinia is a modern state management library for Vue.js that has replaced Vuex. It is easier to use, has a more understandable API, and integrates better with Vue 3's Composition API. Pinia allows creating centralized data stores that can be used across all components of an application.

Example of creating and using a Pinia store:

import { defineStore } from 'pinia'

export const useCounterStore = defineStore('counter', {
  state: () => ({ count: 0 }),
  actions: {
    increment() {
      this.count++
    }
  }
})

// In a component
import { useCounterStore } from './stores/counter'

const counter = useCounterStore()
counter.increment()
console.log(counter.count) // 1