What is the best way to handle the use of staging or production API root url in a React Native app? - react-native

Say I have a staging API url and a production API url. What is the best way to setup the app to use the production API url when I want to release a build to the stores and the staging API url when I am running in debug mode and just uploading to TestFlight/Internal Beta?
I was looking at react-native-config but it seems quite daunting to configure. Would using the DEV variable be possible/practical?
Thanks in advance.

Related

Is there a way to secure aws-export.js in react-native?

I'm currently working on a React-native / Expo app.
After some research on security risk with react-native, I found that it was very easy to do reverse engineering on a APK and get the javascript code source.
For my app, I'm using AWS Amplify for the backend. So, all privates informations like Cognito Pool ID, S3 Bucket and other endpoints are readable easily in the aws-export.js after reverse engineering.
I know that it is possible to obfuscated the file with react-native-obfuscating-transformer or the entire app APK with Proguard but don't know if it is a correct way to secure this file.
So, my question is:
Is there a way to secure aws-export.js accordingly with the today production standard in React Native ?
Thanks in advance to everyone who take the time to answer.

How can I set Vue environment variables without them being included in the JS files after 'build'?

I'm building a Vue app that works as a SPA that gets rendered by my Express backend.
In this Vue app I'm using environment variables. One of these variables is an API key to an external API service.
Obviously I don't want to show the whole world my API key, however after I run the build command it includes all the env variables in the Javascript files, which I believe makes it accessible to anyone.
What would be the right way to go here? Should I make a route in my Express backend that handels requests to this external API, so that I can safely store my API key on the server side?
Or is there a way to make my Vue app autonomously send requests to the external API without having to show the API key?
I'm using Vue 2 by the way.
Yes you should make a backend that will interact with API using your key instead of the front end doing that no matter which version of VueJs your are using
VueJS is front end javascript, which mean users can see the code even minified on their browser
is what you are looking for
Your could use Nuxt, which is an SSR solution to build your app before shipping it to production. During the build, you can get use some sensible stuff since it will run NodeJS and will be on the server only. That way, you could for example fetch some variables and let's say get the content of some blog articles. Then, it will be available on the frontend with the end result only and all your variables safe since they will be used only on the server build.
Other solution is to use your backend as a middleware to do exactly the same process of using something sensitive and just fetch the end result.
Also, serverless functions like on Firebase or Azure are great + cheap for this purpose.

Where to store an Rest API

So I wrote an app in React Native. Now I have my Django Rest framework and a mysql database. I know: I should pay a hosting service to host my database and put the React Native code in the playstore. (This is meant symbolically) But Now I still have the Django Rest framework project - where should I store that? I may also have profile images in the app. Where should I store those? Sorry if the question seems a bit silly
You just need to get a webserver. For example Digital Ocean or Amazon Webservice, etc.. There you have to upload the project and you access the website over your own domain e.g.: www.yourproject.com
Now you can use your urls for example
www.yourproject.com/api/user
I hope I could help you

Is it possible to use react-native-web to create PWA?

We are creating a web site which we want to use RN-web. (it's back port from RN app)
We'd like keep the possibility of converting to PWA later, wonder if it's possible to convert RN-web to PWA?
If you created your application with the expo-cli, now it's super easy to do it.
Expo web projects generate PWA assets and manifest by default, you only need to enable offline web support to get a full PWA.
You can follow the documentation https://docs.expo.io/guides/progressive-web-apps/
And enable service workers on your react native app https://github.com/expo/fyi/blob/master/enabling-web-service-workers.md

What is the best way to test sendgrid parse API on a dev machine?

I am developing a small web app that should receive emails from users, using sendgrid addon on Heroku. What is the best way to test this on a local dev machine? I was thinking about using localtunnel and set up a temporary url for that, but is there any other way I could do that? Also, how could it be tested with rspec or cucumber?
Thank you in advance for your help :)
The SendGrid Parse API needs to have a live URL, so using localtunnel should work, or other services like dyndns, since the Parse API just needs to contact your web app to do a POST operation. Check out the SendGrid docs for how to set it up and work with it.