title: React Native, using RapidAPI inside source code
body: <p>I used to have this code to retrieve JSON file that has personal data in my React Naive source code:</p>
  <pre><code>async componentDidMount() {
  try {
      const response = await fetch('mydomain.org/personaldata.json');
      const responseJson = await response.json();
      this.setState({
          isLoading: false,
          dataSource: responseJson,
      });
  }
  catch (error) {
      console.error(error);
  }
  }
  </code></pre>
  <p>Then I decided to used RapidAPI to make it more secure, but I couldn't figure out how to use it and it gives me white page with no data:
  This is my modified code:</p>
  <pre><code>async componentDidMount() {
  try {
      const response = await fetch('coin-flip1.p.rapidapi.com/headstails', {
          &quot;method&quot;: &quot;GET&quot;,
          &quot;headers&quot;: {
            &quot;x-rapidapi-host&quot;: &quot;mydomain.org&quot;,
            &quot;x-rapidapi-key&quot;: 'lkweruytv43578tv3urhgciuyv2b738465873465c87xnb746'
          }
        });
      const responseJson = await response.json();
      this.setState({
          isLoading: false,
          dataSource: responseJson,
  
      });
  }
  catch (error) {
      console.error(error);
  }
  }
  </code></pre>
  <p>This is RapidAPI code from their documentation:</p>
  <pre><code>const fetchData = () =&gt; {
  startFlip()
  setLoading(true);
  fetch('https://coin-flip1.p.rapidapi.com/headstails', {
  &quot;method&quot;: &quot;GET&quot;,
  &quot;headers&quot;: {
    &quot;x-rapidapi-host&quot;: &quot;coin-flip1.p.rapidapi.org&quot;,
    &quot;x-rapidapi-key&quot;: 'apikey'
  }
  })
  .then((response) =&gt; response.json())
  .then((json) =&gt; setData(json.outcome))
  .catch(() =&gt; Alert.alert('Something went wrong..', 'There was an error fetching coin flip.'))
  .finally(() =&gt; {
    setLoading(false)
    resetFlip()
  });
  };
  </code></pre>