In the past, there were two ways to make requests. One was with XMLHttpRequest. The other was with jQuery, namely the ajax() method. Fortunately, JavaScript now offers a third way, the Fetch API. In this tutorial, you will learn all you need to know to get started with JavaScript Fetch API.

A quick introduction

The Fetch API is a newer addition to JavaScript standard. What this API does is it provides an easier and cleaner way to make server request. What’s even better is that this API is based on  promises. This makes it easier and more friendly to use. It is also what makes it preferable to both, XMLHttpRequest and also jQuery’s ajax().

The basics of JavaScript Fetch API

When you want to make requests with fetch API you will mostly need two things. The first one is fetch() method. This method is what makes the request. This method requires one argument, the path or URL you want to make request to. Aside to this argument, you can also provide this method with config object.

This config object is optional. It allows you to set various settings for the request. For example, you can add headers, body with some data, set mode for cross-origin requests, enable cache, allow or disallow redirect, specify referrers and referrerPolicy, and so on. You can find all available options on  MDN.

#javascript #development #web design #web development