10 - Post Data with JavaScript XMLHttpRequest Method - JSON APIs and AJAX - freeCodeCamp Tutorial

At 10:12 put a capital S in readyState and you should be gucci! We can also post data using the JavaScript XMLHttpRequest. This time, we open it with a 'POST' attribute, set some headers specifying the content-type, and send it. We can register functions with the onreadystatechange to run code once we get a response.

Link to challenge : https://www.freecodecamp.org/learn/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method Concepts: XMLHttpRequest.readyState The XMLHttpRequest.readyState property returns the state an XMLHttpRequest client is in. https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/readyState

XMLHttpRequest.status The read-only XMLHttpRequest.status property returns the numerical HTTP status code of the XMLHttpRequest's response. https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/status https://developer.mozilla.org/en-US/docs/Web/HTTP/Status

XMLHttpRequest.onreadystatechange An EventHandler that is called whenever the readyState attribute changes. https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/onreadystatechange

XMLHttpRequest.setRequestHeader() The XMLHttpRequest method setRequestHeader() sets the value of an HTTP request header. When using setRequestHeader(), you must call it after calling open(), but before calling send(). If this method is called several times with the same header, the values are merged into one single request header. https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/setRequestHeader

JSON (JavaScript Object Notation) is a lightweight data-interchange format. It is easy for humans to read and write. It is easy for machines to parse and generate. https://www.json.org/json-en.html

parse() The JSON.parse() method parses a JSON string, constructing the JavaScript value or object described by the string. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse

stringify() The JSON.stringify() method converts a JavaScript object or value to a JSON string, optionally replacing values if a replacer function is specified or optionally including only the specified properties if a replacer array is specified. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify

XMLHttpRequest XMLHttpRequest (XHR) objects are used to interact with servers. You can retrieve data from a URL without having to do a full page refresh. This enables a Web page to update just part of a page without disrupting what the user is doing. XMLHttpRequest is used heavily in AJAX programming. https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest

XMLHttpRequest.open() The XMLHttpRequest method open() initializes a newly-created request, or re-initializes an existing one. ht ... https://www.youtube.com/watch?v=j4wM2L9xcUI