How to include and modify the downloaded JSON file?

Question

JavaScript

Tell me how to connect this API locally url = ' https://api.lever.co/v0/postings/leverdemo?group=t... '
to make the site work?
here is js

// Replace "leverdemo" with your own company name
url = 'https://api.lever.co/v0/postings/leverdemo?group=team&mode=json'

//url = 'https://api.lever.co/v0/postings/leverdemo?group=team&mode=json'
//Checking for potential Lever source or origin parameters
var pageUrl = window.location.href;
var leverParameter = '';
var trackingPrefix = '?lever-'

if( pageUrl.indexOf(trackingPrefix) >= 0){
  // Found Lever parameter
  var pageUrlSplit = pageUrl.split(trackingPrefix);
  leverParameter = '?lever-'+pageUrlSplit[1];
}

//Functions for checking if the variable is unspecified
function cleanString(string) {
  if (string) {
    var cleanString = string.replace(/\s+/ig, "");
    return cleanString;
  }
  else {
    return "Uncategorized";
  }
}

function nullCheck(string) {
  if (!string) {
    var result = 'Uncategorized'
    return result;
  }
  else {
    return string;
  }
}

function createJobs(_data) {
  for(i = 0; i < _data.length; i++) {

    var team = nullCheck(_data[i].title)
    var teamCleanString = cleanString(team);
    $('#jobs-container .jobs-teams').append(
        '<a href="#" class="btn '+teamCleanString+'">'+team+'</a>'
      );
  }

  for(i = 0; i < _data.length; i++) {
    for (j = 0; j < _data[i].postings.length; j ++) {
      var posting = _data[i].postings[j]
      var title = posting.text
      var description = posting.description
      //Making each job description shorter than 250 characters
      var shortDescription = $.trim(description).substring(0, 250)
      .replace('\n', ' ') + "...";
      var location = nullCheck(posting.categories.location);
      var locationCleanString = cleanString(location);
      var commitment = nullCheck(posting.categories.commitment);
      var commitmentCleanString = cleanString(commitment);
      var team = nullCheck(posting.categories.team);
      var teamCleanString = cleanString(team);
      var link = posting.hostedUrl+leverParameter;

    	$('#jobs-container .jobs-list').append(
      '<div class="job '+teamCleanString+' '+locationCleanString+' '+commitmentCleanString+'">' +
        '<a class="job-title" href="'+link+'"">'+title+'</a>' +
        '<p class="tags"><span>'+team+'</span><span>'+location+'</span><span>'+commitment+'</span></p>' +
        '<p class="description">'+shortDescription+'</p>' +
        '<a class="btn" href="'+link+'">Learn more</a>' +
      '</div>'

      );
    }
  }
}

//Creating filter buttons for sorting your jobs
function activateButtons(_data){
  $('.jobs-teams').on("click", "a", function(e) {
    e.preventDefault();
    for(i = 0; i < _data.length; i++) {
      var teamRaw = _data[i].title;
      var team = cleanString(teamRaw);
      var jobs = $(".jobs-list");if ($(this).hasClass(team)) {
        if ($(this).hasClass("active")) {
          $(this).removeClass("active");
          jobs.find(".job").fadeIn("fast");
        }
        else {
          $(".jobs-teams").find("a").removeClass("active");
          $(this).addClass("active");
          jobs.find("."+team).fadeIn("fast");
          jobs.find(".job").not("."+team).fadeOut("fast");
        }
      }
    }
  })
}

//Fetching job postings from Lever's postings API
$.ajax({
  dataType: "json",
  url: url,
  success: function(data){
    createJobs(data);
    activateButtons(data);
  }
});

Answer 1

The URL you are trying to access is the so-called RESTful service API endpoint. In response to your request, it is not a JSON file that is downloaded to you, but data in JSON format is returned. These data are intended for a program that will somehow process them and perform some actions. For example, in the case of the URL specified in the question, display information about the company's departments in the browser window (only in a form more digestible for the human eye). A program can be, for example, a web frontend, a mobile application, or a program that processes the received data in some other way, for example, converts and feeds it to another service such as an aggregator.
How to work with this data?
Each RESTful API service should have documentation describing how it works with all endpoints (at least when it comes to a public API like the VK API).
In general terms, each endpoint is intended for one action with data that is stored on the side of the service providing the API.
Let's say we are working with data about departments in a company, and this company provides an API for this, which can be accessed at https://api.service.com. This can be a simple data retrieval (GET https://api.service.com/departments) - the response comes in the form of a list of objects. Create a new entry (POST https://api.service.com/departments/create)- in this case, your program must send new data in the format specified in the documentation for the service; also most likely JSON, but it could also be GraphQL or even XML. Update an existing entry (PUT or PATCH https://api.service.com/departments/). As well as deleting an existing entry (DELETE https://api.service.com/departments/).
Thus, no work with JSON files takes place. There is an exchange of data in JSON format between different parts of the application. In the simplest case, these are frontend and backend web applications.
You can learn more about the RESTful architecture:
REST architecture (Habr)
REST API Best Practices (Russian language, translation, Habr)
What is REST API (YouTube)