FAQ: Requests I - XHR Post Requests III

Thanks, may i know what should be shown on screen if it works? Thanks!

Hello i tried again still no show…

1 Like

I think if you just remove the angle brackets < > from around your api key value, you’ll have it. Keep the quotation marks, but delete the brackets. :slightly_smiling_face:


what a stupid mistake! thank you so much!

and thanks for reminding me keeping api key secret, otherwise i would be spreading around the world :joy:


How does the main,js access the renderResponse fuction in helperFuntion.js here as its not exported in this excercisei

If you look in the index.html file for the exercise, you see these two lines of code near the end of the file just inside the closing body tag:

  <script src="public/main.js"></script>
  <script src="public/helperFunctions.js">

Because both files are linked to the html file, the functions inside of helperFunctions.js are accessible to the functions in main.js.
Check out this thread: Code using function from another file without import / export


is there an alternative to rebrandly? The site doesn’t generate an API key for me - clicking the button does nothing and i’ve tried on several browsers.

1 Like

Thank you! I had the same ‘problem’ today.

1 Like

I just followed this lesson today, and had the same issue. In my case, I had created my OWN const for the API key. However, there was already a const for the API key defined that said ‘’, or something along those lines. Make sure there aren’t two copies like I had, press “run code” again (this updates the output area), put in your URL, and try again.

This lesson is truly disappointing. I learned nothing. It’s just about copying stuff. Barely anything is explained. A lot of concepts are just thrown at you…


I wish more was explained. I’m trying to piece it together by looking at documentation, but a little more explanation would help direct me instead of fumbling around.


I’m having difficulty to sign up with rebrandly. My account is suspended even its fresh account. Anybody have same case?

if we assigned const xhr = new XMLHttpRequest wouldn’t (xhr.readyState === XMLHttpRequest.DONE) be the same as (xhr.readyState === xhr.DONE)? If not, why?


I have another question.
in XHR GET Requests III step 5 theres .word method that I cant find, were is it?

 // Creates an empty array to contain the HTML strings
  let wordList = [];
  // Loops through the response and caps off at 10
  for(let i = 0; i < Math.min(res.length, 10); i++){
    // creating a list of words

Theres one similar in step 9: .shortUrl ?

const renderResponse = (res) => {
  // Displays either message depending on results
    responseField.innerHTML = "<p>Sorry, couldn't format your URL.</p><p>Try again.</p>";
  } else {  
    responseField.innerHTML = `<p>Your shortened url is: </p><p> ${res.shortUrl} </p>`;

thankfull for answers

Hi all,
Even though I’ve completed the exercise correctly, the application doesn’t do anything after clicking ‘shorten’.
By the I’m having the same issue with the exercise ‘XHR GET Requests IV’.
Absolutely no clue as to what I’m doing wrong.
(since API keys appear to be secret, I replaced it here with XXX)

I’m quite at loss here…

Thanks :slight_smile: !

// Information to reach API

const apiKey = ‘XXX’;

const url = ‘https://api.rebrandly.com/v1/links’;

// Some page elements

const inputField = document.querySelector(’#input’);

const shortenButton = document.querySelector(’#shorten’);

const responseField = document.querySelector(’#responseField’);

// AJAX functions

const shortenUrl = () => {

const urlToShorten = inputField.value;

const data = JSON.stringify({destination: urlToShorten});

const xhr = new XMLHttpRequest;

xhr.responseType = ‘json’;

xhr.onreadystatechange = () => {

if (xhr.readyState === XMLHttpRequest.DONE) {





xhr.setRequestHeader(‘Content-type’, ‘application/json’);

xhr.setRequestHeader(‘apikey’, apiKey);



1 Like

I’m cancelling my account after this course module. It’s been a bumpy ride, but I think it’s high time I moved on to something else.

Important course modules are bugged or under-explained. Throughout the entirety of this course module, I got all the ticks and made the course work, but I didn’t understand anything.

I laughed when the tutor said “as a challenge, try to rebuild it all from scratch”. How will I do that when I know nothing of what was done?

From promises/await…async, we are thrown into a code that uses a module for reading files and we’re expected to know all of that. I’m lucky that I have a Python background, so I was able to get the basic gist. There was a sentence “now you’ve written a boiler plate for constructing an XMLHttpRequest”. We don’t even know what a boiler plate is, we do not know what an XMLHttpRequest object is, but the sentence was made anyway. It seems like they can’t be bothered to try to make us understand.
The mentality now is;
First step: throw in an image of the code.
Second step: Make them write everything in the image in the editor.
Last step: Repeat step one and two for every single thing.

The course module explaining how to export modules was overly verbose, we should have finished that in 15 minutes, but we had lessons upon lessons of literally copying and pasting.
The “higher-order function” course module was a mess, I don’t even want to remember it.

In my opinion, get the person who wrote the module on classes and ask him to rewrite the remaining modules here.
It was nice knowing you all, and thanks to everyone who answered my questions or linked to helpful materials when we needed that.


Same here. I winged it. Fortunately, you don’t need to get a valid response from rebrandly to continue with the lesson. Hopefully they don’t rely on it for other lessons.

I had a bit same feeling, and I also have a bit of experience from python, and thought the same. Agree with what you have written, a bit typical approach, such obvious, over explaining simple things, and omitting more advance, but I’ll still stick to it and see what’s next. I don’t mind rewriting examples, if they also give some small insights, suggestions… For now I also backing up reading mdn, wiki etc, and connecting dots. This course still seems fine to me. We will see, I’ll give feedback after I finish. Keep learning bro, we will do it :slight_smile:

1 Like

Just wanted to say this to you, keep on. I went to FCC’s tutorial and even they didn’t explain it well. I even thought I was going to stop using codecademy, but I still am lol. I started making some little interactive webpage projects with js, based off the knowledge I gained here. If you’re still confused, look at javascript.info. The documentation there is lovely.

I feel like this should be stated in the lesson. For many of us is our first time dealing with API keys, and this is very imortant security information.

A disclaimer telling people to not post them in the forums, or share them in any other way would be, in my opinion, vital.