DEV Community

Muhammad Awais
Muhammad Awais

Posted on

In-App switching API URL from testing to production in react-native

Make the state of your endpoint first,

state = {
  endpoint: 'http://test.sample.com'
}
Enter fullscreen mode Exit fullscreen mode

write a method that will change the API endpoint state on button click

envUsage = (environment) => {
  if (environment == 'testing') {
    this.setState({ endpoint: 'http://test.sample.com' })
  } 
  else if (environment == 'production') {
     this.setState({ endpoint: 'http://production.sample.com' })
  }
}
Enter fullscreen mode Exit fullscreen mode

Now, call the method by passing your environment as a parameter,

<Button name="production" title="Use Production" onPress={() => this.envUsage('production')} />

<Button name="testing" title="Use Testing" onPress={() => this.envUsage('testing')} />
Enter fullscreen mode Exit fullscreen mode

I have shown the above as a demo for a sample. you can make a global service and maintain the endpoint this will work better in your all components by inheriting that service.

Github Repo: https://github.com/muhammadawaisshaikh/react-native-switch-url

Top comments (0)