How to load resources from an API and display them as rows in the scheduler?

You can load resources from an API like this:

async componentDidMount() {

  const {data} = await DayPilot.Http.get(`/api/resources`);
  this.setState({resources: data});

}

The returned data must follow the structure described in the API documentation (https://api.daypilot.org/daypilot-scheduler-resources/).

Any idea how to give the body with get request?
I am using the following but I am not getting any response (I am getting a response in Postman so API works):

async componentDidMount() {
    const requestOptions = {
      method: 'GET',
      body: JSON.stringify({ "email": "sandhu@abc.com" })
    };
    const {data} = await DayPilot.Http.get('http://localhost:8089/employee/findbyemail', requestOptions);
    this.setState({resources: data});
  }

It's not possible to send a body with GET requests. For POST requests, there is a special method:

async componentDidMount() {
  const params = {
    { email: "sandhu@abc.com" }
  };
  const {data} = await DayPilot.Http.post('http://localhost:8089/employee/findbyemail', params);
  this.setState({resources: data});
}

See also:
https://api.daypilot.org/daypilot-http-post/

Thank you so much for your help. I have one more question. How can I get a parameter value from another page? I need to get the email above from the login page.

You need to be careful with passing the identity of the logged-in user as a parameter - you must not trust this on the server side.

In this case, you should derive the identity from an authentication token that you issue during login (the token can be stored as a cookie, in sessionStorage or in localStorage).

Ok thanks. Is it possible to have a new event with dropdown values?
When we click an event, then instead of inserting text, we get values from SQL which the user can then select?

Providing the context: I want to create a timesheet for employees for the time spent on the project the employees are working on. For this, I want to load the current projects from SQL database for a given employee. Then the employee enters the time for projects per day. Afterwards, I need to calculate the total hours spent per project by the employee and store in a database.

It is possible to use the built-in modal dialog (DayPilot.Modal). Here you can find a description of the basics:
https://code.daypilot.org/60913/javascript-scheduler-edit-multiple-fields-modal-dialog

It also supports dropdown fields (type: "select" or type: "searchable") that will let you select a value from a list.

For more details about the DayPilot.Modal.form() method please see the API docs:
https://api.daypilot.org/daypilot-modal-form/

You can also define the dialog fields using a visual tool:
https://modal.daypilot.org/builder/