How do I use the Fetch API in TypeScript to make a GET request?

How do I use the Fetch API in TypeScript to make a GET request?

You can use the Fetch API in TypeScript by calling the fetch function with the URL and handling the response. Here's a basic example:

fetch('https://api.example.com/data')
  .then(response => {
    if (!response.ok) {
      throw new Error('Network response was not ok');
    }
    return response.json();
  })
  .then(data => {
    console.log(data);
  })
  .catch(error => {
    console.error('There was a problem with the fetch operation:', error);
  });

What if I want to add headers to my request?

You can add headers by passing an options object as the second argument to the fetch function. Here's how:

fetch('https://api.example.com/data', {
  method: 'GET',
  headers: {
    'Content-Type': 'application/json',
    'Authorization': 'Bearer your-token'
  }
})
  .then(response => response.json())
  .then(data => console.log(data));

How can I handle errors more effectively?

You can create a custom error handling function to manage different types of errors. For example:

function handleError(response: Response) {
  if (!response.ok) {
    throw new Error(`HTTP error! status: ${response.status}`);
  }
  return response;
}

fetch('https://api.example.com/data')
  .then(handleError)
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error));