Imgur Api Fetching Gallery using Fetch es6

Question

I have to create a gallery of image using IMGUR API . I have client id which i made using imgur website . Now i have to fetch data from gallery which can be from section like top, user ,viral .

I am not sure how to pass {{section}}/{{sort}}/{{window}} . I get value from input tag like user do viral so i get string "viral" in a variable section.

Whole code is in ES6 javascript

 var myHeaders = new Headers();
myHeaders.append("Authorization", "Client-ID {{clientId}}");

var requestOptions = {
  method: 'GET',
  headers: myHeaders,
};

fetch("https://api.imgur.com/3/gallery/{{section}}/{{sort}}/{{window}}/{{page}}?showViral={{showViral}}&mature={{showMature}}&album_previews={{albumPreviews}}", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));

Api Reference - https://apidocs.imgur.com/?version=latest#eff60e84-5781-4c12-926a-208dc4c7cc94

enter image description here

Answer 1

Use back ticks

fetch(`https://api.imgur.com/3/gallery/${section}/${sort}/${window}/${page}?showViral=${showViral}&mature=${showMature}&album_previews=${albumPreviews}`, requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));