I have a react native mobile application and I need some pages to work offline (without internet connection) I am using redux persist library.
My question is where to initialize the store and persist it?
Should I make it for each page or one time?
You use it to persist either your entire redux store, or a part of the store. If your not using redux yet then you will need to implement that first.
It’s setup at the same time you create your redux store.
There are links to several examples and a guide start guide in the GitHub project readme.
Related
I want to build an app where users can jointly work on lists. The app should be avialable offline and sync changes when it goes online again.
For the app iteself, I've decided to go with Ionic Vue. For storage, I created a Firestore and was able to sync between my app and Firestore by using the Firesotre method onSnapshot() (doc). Although this working at the moment, the resulting code does not look very elegant and I have to create multiple very similar Firebase calls in different components. This slows the app down and (I think) also prevents me from making the lists available offline and sync them again when there is a connection.
I recently discovered vuex and the idea sounds quite fitting for my case: I store all app data in the vuex store and sync it (both ways) to Firestore. My components access the vuex store instead of the Firestore directly. Here are some questions regarding this idea:
Is this in general how the vuex store and Firestore are supposed to be used?
Can I make the vuex store data available on my phone and only sync it to the Firestore whenever there is a connection (to make the app available offline inlc. modifying data)?
If so, what is the easiest way to sync the vuex store to Firestore?
Regarding the syncing: I found Vuexfire, but it does not really work for me as expected - I guess this is because it is built on Vue 2 (as against Ionic which is built on Vue 3). I also found Vuex Easy Firestore, but I'm a bit reluctant to try new tools, as Vuexfire cost me several hours.
Thanks for reviewing my implementation ideas!
I'm about to start working on a expense tracker app for mobile and I would like to use React Native with Expo (pretty new to mobile techs). Maybe I will share it with some friends or other people and the question that cames up is where to store their data (in this case is sensitive as they will register their money's movement).
What I mean is, I could use any cloud DB (Mongo, Firestore, etc) but I will have access to everything they register there and I wouldn't like that, just for security and their privacy sake.
So, is there a way to store their data or everything they register locally in their phones? So the app can only access to the data that is stored there and I can't see it. Or any other possibility?
I found the AsyncStorage API but I don't know if this is the correct approach for what I'm looking for. I didn't code anything yet as I don't know which would be the right path.
You can use Secure Store since you're using expo.
expo-secure-store provides a way to encrypt and securely store key–value pairs locally on the device. Each Expo project has a separate storage system and has no access to the storage of other Expo projects.
See https://docs.expo.dev/versions/latest/sdk/securestore/
I had a similar case and i went for realm.js .
I basically made a login page which could grab user/password from the text input, but if I want to use these to get auth from my website which has a REST API, where should I start it, is any lib that I can use?
I don't know how deeply you want to make. So I'll guess your concerning.
If you want to just send and get response from server
You can use fetch() method in js. Luckily react-native have documentation. https://reactnative.dev/docs/network Look this documents. React-Native have own fetch method for communicating with server.
If you want to manage state of your client-side data
Redux : You might probably hear this one. you can include redux in your package. we can use redux in react-natvie not only react. I just googled articles. https://www.digitalocean.com/community/tutorials/react-react-native-redux
MobX : Redux is pretty much complicate way to deal with state. So If you need simple things. you can try MobX. try this one. (also googled) https://www.smashingmagazine.com/2020/08/mobx-state-manager-react-native-applications/
Hope this idea helps you.
Best regards.
I have to choose the best multilingual react native app. One performs with application state and the other gets results with caching which I'm not sure is possible.
Which one gives the best performance to save language data. Should I save it in state or in a cache?
There are multiple ways you can create multilingual app, in react-native, there is an async-storage which is supported by the react-native community. Through async-storage, you can detect and switch the language of the app.
In order to use state, for that, you would need a persistent redux store to check the state of the app and switch your app language.
I would recommend you to go through to the below article
Multilingual app in react-native and redux
Multilingual app react-native with async-storage
I have a use case for synchronous storage for my react native app.
Before app renders a home view, I want to check if there is a session token stored on the local storage and proceed if it is available, otherwise want to render login component instead as the initial view.
Using sync storage will simplify the code.
I don't think there is a simple synchronous storage option. According to this answer localstorage is not implemented in the core IOS javascript engine. AFAIK the other options such as those used in this localstorage polyfill don't work. That leaves us with needing a react native module which are asynchonous by design. From the docs:
React Native bridge is asynchronous, so the only way to pass a result to JavaScript is by using callbacks or emitting events
So I think Async is the way to go.
For those who are searching for this,
I found this npm package that served this need
react-native-sync-localstorage
I have a similar situation and found Realm supports synchronous read, which is what I need. Realm is a bit big for single token storage. I use AsyncStorage for everything else. Let me know if you find a simpler solution.
There's no solution similar with Native Mobile development such as SharedPreferences in Android.
Native Way: most of the operations are synced. (such as read from storage, etc), some of the operations are async.(http request, load image)
React Native way: almost all of the operations are asynced. this is explained by #Ryan Harmuth 's answer.
So, let's start to use Redux as a solution. :)