How to use fetch to fetch data from AWS RDS in a react application?

Question

I'm learning Node + React. In my Node + React application, I have the following component FetchData.js to fetch data from localhost :

import React from 'react';

class FetchData extends React.Component {

    static async getData() {
        let response = await fetch('http://localhost:4000/my-project');
        let body = await response.json();
        return body
    }
}

export default FetchData;

I could see the json objects by typing localhost:4000 in the browser.

Now I'm hosting the data in AWS RDS. I have an endpoint like this:

my-project.abc12345def.eu-west-2.rds.amazonaws.com:3306

How can I fetch data from the endpoint like what I did in FetchData.js ? I tried to replace localhost with the endpoint url, no luck; tried to type the endpoint url in a browser, could not see its content. I suppose I need to be able to see its content to be able to fetch data?

Answer 1

I will give you most simple difference

Fetch is a way to access HTTP resources like http://localhost:4000/my-project .

Your RDS endpoint (Most probably MYSQL) does not run an HTTP server.

So these endpoints (Links) are different, and they are not for the same purpose.

Edit: You could connect to RDS using a MYSQL client from your server running on http://localhost:4000 which then return the data to fetch request.