Random Quote Machine project feedback (no JSON or twitter function yet)

Hello all,

Somewhat-finished my random quote generator. I want to eventually have it working with JSON, but I am still learning/not fully understanding json and ajax, so I made an array of random quotes instead and wanted to get the functionality of the page working. I’ve read on here that we don’t HAVE to make the quote machine using json, so I went ahead and did it without json before I ended up throwing my computer out the window out of frustration.

The “tweet” button just fades out the quote text completely, so that aspect of the page is not fully working yet as well. The “motivate me” button selects a random quote from the array of quotes I provided (about 15-ish quotes)

Looking for feedback, recommendations, advice, insight. Really any sort of constructive criticism regarding the project.

Looks pretty good, well done for getting to that point. :slightly_smiling_face:

The only thing that I am not keen on with the current version is the spiralling dots in the motivate me button- they make me think that I should be waiting for something happen (this might just be me though!)

Regarding JSON and AJAX, they took me quite a while to get my head round. Using JSON is basically the same as using a javascript object, so once you get can get JSON back from a server, you should be able to get the info out without too much trouble.

Regarding getting quotes and AJAX, you first want to decide on an api to use. I used https://forismatic.com/en/ to create my random quote machine. The api is fairly simple once you get you head round it.

I suggest that whatever api you choose to query, that you start be putting your query into your browser’s address bar:


The JSON object will then be displayed in the browser window as long as the api address and query parameters are correct. I found that this makes debugging easier when you are starting out.

Hope this points you in the right direction and good luck :slightly_smiling_face:

great, thank you for the helpful tips.

Codepen was really messing with me, and I’m pretty sure I actually got the json working, its just codepen was blocking it for whatever reason. Maybe if I try it somewhere else, instead of codepen, it will help.

Thanks again, I’ll be sure to do what you said

Just a thought as to why codepen may be blocking content, Were you using an insecure link http:// as codepen will blocks those if you are accessing codepen via a secure link https://

Every time I tried to go to htt:// is just bought be back to the secure link https://, I read that suggested on here before thinking it would work, but didn’t :tired_face:

If you would like to past the link you were trying, I can have a quick look to see if can figure it out?