componentDidMount() { fetch('--------------------------------------------',{ method: "GET", headers: { "access-control-allow-origin" : "*", "Content-type": "application/json; charset=UTF-8" }}) .then(results => results.json()) .then(info => { const results = info.data.map(x => { return { id: x.id, slug: x.slug, name: x.name, address_1: x.address_1, address_2: x.address_2, city: x.city, state: x.state, postal_code: x.postal_code, country_code: x.country_code, phone_number: x.phone_number, } }) this.setState({warehouses: results, lastPage: info.last_page}); }) .then(console.log(this.state.warehouses)) }

// package.json "private": true, "proxy": "http://localhost:5000", "dependencies": {

package.json
"proxy": "backend localhost i.e., https://localhost:5000"
react frontend
useEffect(() => { const res = fetch('/api'); console.log(res); }, [])
backend
app.get('/api', cors(), (req, res) => { res.set('Access-Control-Allow-Origin', '*'); const link = 'https://yourApiLink.com'; fetch(link).then(response => response.text()).then(text => console.log(text));
});

 "private": true, "proxy": "http://localhost:5000", "dependencies": {

{"tags":[{"tag":"p","content":"This article might help for setting up CORS and resolving any error occurring:-&nbsp;<a target=\"_blank\" rel=\"nofollow\" href=\"https:\/\/www.stackhawk.com\/blog\/react-cors-guide-what-it-is-and-how-to-enable-it\/\">https:\/\/www.stackhawk.com\/blog\/react-cors-guide-what-it-is-and-how-to-enable-it\/<\/a>"}]}

//simply use axios instead of fetch.
//here is the code
import axios from "axios";
export const marketSentimentApi = async () => { const url = 'https://www.alphavantage.co/query?function=NEWS_SENTIMENT&tickers=AAPL&apikey=TLIW5MVYS5FZE0Y' const data = await axios.get(url); return data;
}