Empowering EveryNote with two plugins
If you Google Vuex plugins, you may find various plugins for different purposes. I selected two that you will probably want to use in your next Vuex project. These plugins are:
- vuex-persistedstate
- vuex-router-sync
We are going to use the first one to save the EveryNote state with localStorage,
so that we don't lose all the notes every time the browser page is reloaded.
It is strongly recommended that you use the second one, vuex-router-sync, if you are creating a single-page web application. In this case, you are already using vue-router and vuex-router-sync will synchronize the current route, as part of Vuex store's state.
Saving the app state with vuex-persistedstate
The EveryNote application currently shows two fake notes and loses newly created notes every time you reload the page. By adding the vuex-persistedstate
plugin, notes will be saved with localStorage
.
To add the vuex-persistedstate
type, enter the following:
npm install --save vuex-persistedstate...