Created a Quote API for all to use!

Hi all,

As I progress on my adventure that is programming, I decided to (with a helpful nudge from @forkerino ) create my own quotes API.
When I created my Random Quote generator so long ago, I wanted to use quotes from The Simpsons, but alas, I could not find an API, so instead I created my own array of quotes at the time. Now that I’ve been learning Node/Express/Mongo, the idea of making my own quote API sounded fun and intriguing! I made it easy to use, and it shouldn’t have any CORS issues!
Please feel free to comment on it, share it, and direct others to use it when creating their own Random Quote generator!

https://thesimpsonsquoteapi.glitch.me/

33 Likes

Amazing that I found this post on google rather then FCC while searching for an API. I looked at the date and realized this was posted hours ago and not years, ha!

An awesome contribution, thanks.

1 Like

This is great! Including the direction the character is facing is a really great touch, too.

In fact, I liked it so much I went back and redid the random quote generator challenge with it.

2 Likes

@JLuboff are you certain that this api is functioning correctly? I’m currently in the process of creating a Simpsons random quote generator and no quotes are being produced, so I’m unsure as to whether the problem is with my code or your api.

That looks awesome, the Itchy & Scratchy loading gif really ties it all together! Great job!

Hi @Embustero , the API is working correctly, you can see Lionel’s example above. The API may take 5-10 seconds for the initial quote, but after that should be quicker (I am using Glitch which is free, but after so long of inactivity, it will “shutdown” and when it gets pinged again has to start up).
Personally I use jQuery’s $.getJSON to get back API information…for example:

$.getJSON('https://thesimpsonsquoteapi.glitch.me/quotes', function(data){
console.log(data) //You should see in the console the returned JSON document
});

Brilliant. I hope you added my favourite quote…
Nelson Muntz - “Ha ha!” :smile::point_right:

1 Like

That is brilliant work!

@lionel-rowe your random quote generator works in Chrome, but not in IE. Is there a reason for that? Neither the Itchy and Scratchy animation shows up, nor the quotes with the associated pictures.

Yep, it’s hilariously broken on IE8. I believe it probably wouldn’t work on any versions of IE, even 11, because the code uses ES6 features and no IE version supports ES6 (lol Microsoft). Perhaps I should run the code through Babel and see if that fixes it.

1 Like

Funny…I swore I had that one in there, but after checking my database, I did not! However, it is now in there :smiley:

1 Like

Does anyone still use IE? :open_mouth:

I’ve tried using this Api with Codepen and also without Codepen, and nothing is happening. Here is my Simpsons quote generator: https://codepen.io/Crimson_Macaw/pen/xrXXjY . Could someone take a look and tell me if I’ve coded everything properly?

@Embustero Bootstrap complains about missing tether requirement. You should include tether.min.js before you include bootstrap.min.js.

The bootstrap issue is unrelated to the JSON not functioning properly. I’ve added the tether.min.js link but that produced zero results.

Could someone please create a functioning quote generator using this Api with Ajax? I’ve tried it through both Ajax and Json and cannot get it to work. Lionel-rowe’s quote generator is through xml and so isn’t of much help.

@Embustero finally fixed it in a fork : https://codepen.io/rainbru/pen/XgVxNJ/. You were so close :slight_smile:

  1. The url is wrong (you must add /quotes endpoint);
  2. The returned object is an array, you have to use response[0].quote instead of response.quote.

Thanks rainbru I finally understand it now. I just had no idea that the object came back as an array.

Also, I’m not sure if you get this issue as well, but after I’ve clicked on the New Quote button 2-3 times the quotes start to appear in quick succession, one after another, and then stop after a few seconds. This is an issue that comes up in both Chrome and IE (I’m getting the same issue even when I use other quote APIs e.g. forismatic) and I’m not sure what’s causing it.

I think I fixed the quote succession issue. The curly bracket closing the getQuote() function l35 should be before the #buttonOne click handling block (l23 in https://codepen.io/rainbru/pen/XgVxNJ). I’ve only tested it with chrome though, let me know how it works with others.

Thanks again rainbru. I had placed the curly bracket in the correct position originally, but after commenting out the $.getJson call which I had been experimenting with, I had accidentally commented out the getQuote() function’s closing curly bracket as well.