[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"post:pinia-vs-vuex":3},{"type":4,"post":5,"relatedPosts":48,"seo":83,"alternates":85,"editable":88},"post",{"id":6,"title":7,"slug":8,"url":9,"excerpt":10,"reading_minutes":6,"blocks":11,"toc":25,"category":35,"tags":39,"cover":46,"published_at":47},2,"Pinia vs Vuex","pinia-vs-vuex","\u002Fblog\u002Fpinia-vs-vuex","Compare Pinia and Vuex through simple state management examples, API differences, and practical guidance for choosing a store for your Vue application.",[12,16,19,22],{"type":13,"data":14},"general.rich-text",{"content":15},"\u003Cp>Pinia and Vuex are both state management libraries for Vue.js, a popular JavaScript framework for building user interfaces.\u003C\u002Fp>",{"type":13,"data":17},{"content":18},"\u003Ch2 id=\"pinia\">Pinia\u003C\u002Fh2>\n\u003Cp>Pinia is a lightweight alternative to Vuex that focuses on providing a simple and intuitive API. Here is an example of how to use Pinia to manage state in a Vue.js app:\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-javascript\">import { createStore } from 'pinia'\n\nconst store = createStore({\n  id: 'my-app-store',\n  state: () =&gt; ({\n    count: 0\n  }),\n  actions: {\n    increment(state) {\n      state.count++\n    }\n  }\n})\n\n\u002F\u002F Use the store in a component\nexport default {\n  setup() {\n    return {\n      count: store.state.count,\n      increment: store.actions.increment\n    }\n  }\n}\n\u003C\u002Fcode>\u003C\u002Fpre>",{"type":13,"data":20},{"content":21},"\u003Ch2 id=\"vuex\">Vuex\u003C\u002Fh2>\n\u003Cp>Vuex, on the other hand, is a more feature-rich state management library that uses a centralized store to manage state in your application. Here is an example of how you might use Vuex to manage state in a Vue.js app:\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-javascript\">import Vuex from 'vuex'\n\nconst store = new Vuex.Store({\n  state: {\n    count: 0\n  },\n  mutations: {\n    increment(state) {\n      state.count++\n    }\n  }\n})\n\n\u002F\u002F Use the store in a component\nexport default {\n  computed: {\n    count() {\n      return store.state.count\n    }\n  },\n  methods: {\n    increment() {\n      store.commit('increment')\n    }\n  }\n}\n\u003C\u002Fcode>\u003C\u002Fpre>",{"type":13,"data":23},{"content":24},"\u003Ch2 id=\"which-one-should-you-choose\">Which one should you choose?\u003C\u002Fh2>\n\u003Cp>In general, whether you use Pinia or Vuex depends on your needs and preferences, but let's not forget that VueJS' official documentation now recommends using it with PiniaJS. Pinia offers a simpler API and is easier to learn, but may not have all the features of Vuex. Vuex, on the other hand, is more feature-rich but may require more code and have a steeper learning curve.\u003C\u002Fp>",[26,29,32],{"id":27,"label":28,"level":6},"pinia","Pinia",{"id":30,"label":31,"level":6},"vuex","Vuex",{"id":33,"label":34,"level":6},"which-one-should-you-choose","Which one should you choose?",{"id":36,"title":37,"slug":38},7,"Vue","vue",[40,42,44],{"id":41,"title":37,"slug":38},8,{"id":43,"title":28,"slug":27},9,{"id":45,"title":31,"slug":30},10,null,"2022-12-08",[49,68],{"id":50,"title":51,"slug":52,"url":53,"excerpt":54,"reading_minutes":55,"blocks":46,"toc":46,"category":56,"tags":57,"cover":46,"published_at":67},3,"Authentication with Firebase and VueJS","authentication-with-vuejs-and-firebase","\u002Fblog\u002Fauthentication-with-vuejs-and-firebase","Build Firebase authentication in Vue with Pinia, GitHub login, session-aware route middleware, and protected authenticated and guest pages.",6,{"id":36,"title":37,"slug":38},[58,59,63],{"id":41,"title":37,"slug":38},{"id":60,"title":61,"slug":62},11,"Firebase","firebase",{"id":64,"title":65,"slug":66},12,"Authentication","authentication","2023-01-14",{"id":69,"title":70,"slug":71,"url":72,"excerpt":73,"reading_minutes":50,"blocks":46,"toc":46,"category":74,"tags":77,"cover":46,"published_at":82},1,"How do we sort arrays in PHP?","how-do-we-sort-arrays-in-php","\u002Fblog\u002Fhow-do-we-sort-arrays-in-php","Learn how PHP’s sort, rsort, asort, arsort, ksort, and krsort functions order indexed and associative arrays by values or keys.",{"id":55,"title":75,"slug":76},"PHP","php",[78,79],{"id":55,"title":75,"slug":76},{"id":36,"title":80,"slug":81},"Arrays","arrays","2022-10-09",{"html":84},"\u003Ctitle>Pinia vs Vuex - Azad Furkan Şakar\u003C\u002Ftitle>\n\u003Cmeta name=\"description\" content=\"Compare Pinia vs Vuex for Vue state management. Explore simple examples, key API differences, and learn which store is best for your Vue application.\">\n\u003Cmeta name=\"keywords\" content=\"laravel, backend, developer, php\">\n\u003Clink rel=\"canonical\" href=\"https:\u002F\u002Fafsakar.dev\u002Fblog\u002Fpinia-vs-vuex\">\n\u003Clink rel=\"alternate\" hreflang=\"en\" href=\"https:\u002F\u002Fafsakar.dev\u002Fblog\u002Fpinia-vs-vuex\">\n\u003Clink rel=\"alternate\" hreflang=\"tr\" href=\"https:\u002F\u002Fafsakar.dev\u002Ftr\u002Fblog\u002Fpinia-ve-vuex\">\n\u003Clink rel=\"alternate\" hreflang=\"x-default\" href=\"https:\u002F\u002Fafsakar.dev\u002Fblog\u002Fpinia-vs-vuex\">\n\u003Cmeta name=\"robots\" content=\"index, follow\">\n\u003Cmeta property=\"og:title\" content=\"Pinia vs Vuex\">\n\u003Cmeta property=\"og:description\" content=\"Compare Pinia vs Vuex for Vue state management. Explore simple examples, key API differences, and learn which store is best for your Vue application.\">\n\u003Cmeta property=\"og:type\" content=\"article\">\n\u003Cmeta property=\"og:site_name\" content=\"Azad Furkan Şakar\">\n\u003Cmeta property=\"og:url\" content=\"https:\u002F\u002Fafsakar.dev\u002Fblog\u002Fpinia-vs-vuex\">\n\u003Cmeta property=\"og:image\" content=\"https:\u002F\u002Fafsakar.dev\u002Fstorage\u002Fog-images\u002Fposts\u002F2-en.png\">\n\u003Cmeta property=\"article:published_time\" content=\"2022-12-08T17:00:25+00:00\">\n\u003Cmeta property=\"article:modified_time\" content=\"2026-08-10T09:37:57+00:00\">\n\u003Cmeta property=\"article:author\" content=\"Azad Furkan Şakar\">\n\n\u003Cmeta name=\"twitter:site\" content=\"afsakar\">\n\u003Cmeta name=\"twitter:card\" content=\"summary_large_image\">\n\u003Cmeta name=\"twitter:image\" content=\"https:\u002F\u002Fafsakar.dev\u002Fstorage\u002Fog-images\u002Fposts\u002F2-en.png\">\n\u003Cmeta name=\"twitter:title\" content=\"Pinia vs Vuex\">\n\u003Cmeta name=\"twitter:description\" content=\"Compare Pinia vs Vuex for Vue state management. Explore simple examples, key API differences, and learn which store is best for your Vue application.\">\n\u003Cmeta name=\"twitter:url\" content=\"https:\u002F\u002Fafsakar.dev\u002Fblog\u002Fpinia-vs-vuex\">\n\u003Cscript type=\"application\u002Fld+json\">{\"@context\":\"https:\u002F\u002Fschema.org\",\"@type\":\"Article\",\"name\":\"Pinia vs Vuex\",\"description\":\"Compare Pinia vs Vuex for Vue state management. Explore simple examples, key API differences, and learn which store is best for your Vue application.\",\"url\":\"https:\u002F\u002Fafsakar.dev\u002Fblog\u002Fpinia-vs-vuex\",\"image\":\"https:\u002F\u002Fafsakar.dev\u002Fstorage\u002Fog-images\u002Fposts\u002F2-en.png\",\"mainEntityOfPage\":{\"@type\":\"WebPage\",\"@id\":\"https:\u002F\u002Fafsakar.dev\u002Fblog\u002Fpinia-vs-vuex\"},\"headline\":\"Pinia vs Vuex\",\"author\":{\"@id\":\"https:\u002F\u002Fafsakar.dev\u002F#person\"},\"publisher\":{\"@id\":\"https:\u002F\u002Fafsakar.dev\u002F#person\"},\"datePublished\":\"2022-12-08T17:00:25+00:00\",\"dateModified\":\"2026-08-10T09:37:57+00:00\"}\u003C\u002Fscript>\u003Cscript type=\"application\u002Fld+json\">{\"@context\":\"https:\u002F\u002Fschema.org\",\"@type\":\"BreadcrumbList\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\u002F\u002Fafsakar.dev\u002F\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Blog\",\"item\":\"https:\u002F\u002Fafsakar.dev\u002Fblog\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Pinia vs Vuex\",\"item\":\"https:\u002F\u002Fafsakar.dev\u002Fblog\u002Fpinia-vs-vuex\"}]}\u003C\u002Fscript>\u003Cscript type=\"application\u002Fld+json\">{\"@context\":\"https:\u002F\u002Fschema.org\",\"@type\":\"Person\",\"name\":\"Azad Furkan Şakar\",\"url\":\"https:\u002F\u002Fafsakar.dev\",\"@id\":\"https:\u002F\u002Fafsakar.dev\u002F#person\",\"jobTitle\":\"Backend Developer\",\"image\":\"https:\u002F\u002Fafsakar.dev\u002Fstorage\u002Fsettings\u002Fseo\u002F01KZB422BTYXF3J7XS1J2X8GYZ.jpeg\",\"sameAs\":[\"https:\u002F\u002Fx.com\u002Fafsakar\",\"https:\u002F\u002Flinkedin.com\u002Fin\u002Fafsakar\",\"https:\u002F\u002Fgithub.com\u002Fafsakar\"]}\u003C\u002Fscript>",{"en":86,"tr":87},"https:\u002F\u002Fafsakar.dev\u002Fblog\u002Fpinia-vs-vuex","https:\u002F\u002Fafsakar.dev\u002Ftr\u002Fblog\u002Fpinia-ve-vuex",{"type":4,"id":6}]