As of now, my app contains an array and the user can manipulate the order of items in it by dispatching actions. I'm using redux persist and even if I directly change the array elements by editing the source file, the array does not update unless I clear the app cache.
What are my options to update this kind of persistent data after I publish it to the store without forcing users to clear the cache?
What are you looking for is migrations.
How it works:
Load user's previous state from local storage on app start
Update fields you need
Here is a setup example
Related
I'm using Nuxt 2.15 with target: "static" and hosting on a shared hosting "hostinger". I fetch the data from an external API using axios and Vuex state management and here comes the problem where the app doesn't load the new data it gets from the API.
How can I make the app rerenders its data and output the newly updated data it gets from fetching the API?
I assume you are using nuxtServerInit or asyncData for getting the data from API. This used with static mode means that data is get only during generation. Which is great for not too often updated content because it doesn't have to connect to server every time it's faster.
Depend on your needs you can:
Get data from API in mounted() hook this will get data from API every time the page is loaded BUT it also means that it could be loaded with some delay and it probably wouldn't be indexed by search engines
You can go with universal mode (https://nuxtjs.org/docs/configuration-glossary/configuration-mode/) and start your site on node.js server which will use up-to-date data from API each time user will open your site.
EDIT: as #kissu corrected me in comment this one is deprecated, please use this one: target:'server' instead of target:'static', which is default so you can just remove this line (https://nuxtjs.org/docs/configuration-glossary/configuration-target/ )
I've read blog React Admin 3.3: Faster Navigation And Reduced Footprint Thanks To Application Cache but still do not understand know create real cache without need to full update list.
For several list resources which changed rarely I want to cache response in IndexedDb.
Logic for updating and optimistic rendering should be following (if previous version of list already in cache):
Each entry in list have timestamp field last_updated.
When opening list for cached resource my dataprovider return current list version from IndexedDb.
Ideally during this loading spinner should continue to rotating (I do not sure if it is possible since I've resolved Promise during previous step)
At same time during step 2 data provider asynchroniously launch fetch new data from API like "Give me new entries updated after timestampN, where timestampN most newest timestamp in cache.
After receiving data from API cache will be updated and data provider should notify react-admin somehow that cached data changed and it need to re-render data table.
Finally loading spinner stopped.
Mostly I do not know how to achive step 5 since it is most important here.
Can someone help with ideas how to implement such or similar application cache?
I seek to save user data for my electron.js app. The app has a graph with adjustable values, which disappear when relaunching the app. Demo:
https://puu.sh/Bx5Or/ffb0382d0c.gif
How do I preserve these values? Can (and should) it be done with SQL?
You have a lot of modules to store data in an Electron app :
http://lokijs.org
https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
https://github.com/agershun/alasql
https://github.com/amark/gun
https://github.com/google/leveldb
https://github.com/google/lovefield
https://github.com/jakearchibald/idb
https://github.com/jakearchibald/idb-keyval
https://github.com/sql-js/sql.js
https://github.com/localForage/localForage
https://github.com/louischatriot/nedb
https://github.com/pouchdb/pouchdb
https://github.com/pubkey/rxdb
https://github.com/typicode/lowdb
https://github.com/w3c/IndexedDB
https://github.com/yathit/ydn-db
https://github.com/TomPrograms/stormdb
I would suggest nedb which is pure JS and cross platform compatible.
The simplest is localStorage, which is browser native.
Or more simply, you can read/write data in a JSON file.
So, in your case, when the values are changed, save the data.
On start, get them from the database and put them in your adjustable values.
I am trying to make my first Vue.js CRUD application with Vuex, and I am running into a struggle with how to properly load state.
I have a route that lists all accounts /accounts and I am easily loading accounts state for all accounts in a list form.
My challenge/question, how can I effectively use state to view/update an individual record in another route? (ie. /accounts/1). If the user refreshes the browser on /accounts/1 I have no state. What is the best strategy to manage state for both a collection of things, and an individual record in that collection?
You can have a look on https://github.com/JiriChara/vuex-crud. It creates Restful Vuex modules with all actions: CRETE, READ, UPDATE, DELETE. The source code is pretty straightforward, so you can have a look how state is designed and modified.
If you want to retain state after a hard reload you might want to make sure state is saved in localstorage then make sure you are using getters to load the data appropriately via lifecycle hooks. Try vue-localstorage
I have a Sencha Touch App that loads data from a REST service into a store using a REST proxy. The load event of this store also copies the records into a localstorage store. This is because the app needs to work in an offline mode. I am trying to write back changes made to records in the localstorage to the REST service, but haven't managed to figure out how to sync the localstorage store and the store that uses the REST proxy. Any ideas?
I followed the example given here http://www.sencha.com/learn/taking-sencha-touch-apps-offline/ , but it covers only read-only scenarios for offline data.
You'll need to implement something similar in the save event on your localstorage store that copies changes over to your onlineStore (much like you're copying new items from your onlineStore to the offlineStore when it loads).
#Lyle Pratt is correct about having a functionality that copy from your "offline" store to your "online" store. But to expand it more, I will create a function inside your offline store where it will save or copy your offline data to your online store.
Ext.define('MyProject.store.OfflineMessage', {
config: {
model: 'MyProject.model.Message' //this should be the same with your online store
},
sync: function(){
var me = this,
onlineMessageStore = Ext.getStore('OnlineMessage'), //you can get your current store or just create a new one
items = me.getData().items;
onlineMessageStore.setData(items);
onlineMessageStore.sync();
}
});
On the other hand, you can also create a same functionality for your online store wherein it will save your online data to your offline store.