Random Quote Machine - API, React

Random Quote Machine - API, React


So, I have done this project once before using jQuery: https://codepen.io/videiraft/pen/JbNQJZ

Right now I am doing it using React. https://codesandbox.io/s/x98k1llpl4 The problem I am facing is that it’s behaving much slower than with jQuery. Does anyone know why or how to solve it? Am I doing something wrong?

Thank your for your attention!

Random quote machine "invalid token"

Do you mean fetching the quote is slow? If so, it is probably just the cors proxy.

You might also want to add a catch to the promise (fetch).


Yes, that is what I meant. Is there any other way to solve the cors problem without the proxy? (without jQuery too) Thank your for your answer. And I will add a catch to the promise, thank you!


And why does this happen?

SyntaxError: Unexpected token ’ in JSON at position 24
at JSON.parse ()
at eval (App.js? [sm]:32)

The JSON data is:
{“quoteText”:“Truth isn’t all about what actually happens but more about how what has happened is interpreted.”, “quoteAuthor”:“Byron Pulsifer”, “senderName”:"", “senderLink”:"", “quoteLink”:“http://forismatic.com/en/0fd1de2765/”}

There is a backslash before the ’ symbol. So why does this happen?


I can see you have switched away from the API you were using, so I guess it doesn’t matter much anymore, however. The API really should not be sending strings with escaped single quotes (it’s invalid as far as I know).

\' is never a valid escape sequence in a JSON string. It doesn’t need to be, because JSON strings are always double-quoted.

Here is another one I got from the API (this will fail validation), so it’s probably better not to use it anyway.

	"quoteText": "There is nothing in a caterpillar that tells you it\'s going to be a butterfly.",
	"quoteAuthor": "Buckminster Fuller",
	"senderName": "",
	"senderLink": "",
	"quoteLink": "http://forismatic.com/en/c9007aae7e/"


Yes, I had too many problems with it, it was too slow, and took me much time to understand what was happening, so I moved on… Anyway thank you for your response! I didn’t even think about that since the jquery version was working with the same API.
Thank you so much! Now I know what the problem was.
By the way, just another question I had: do you know why the twitter logo takes so much time to load? I would like to solve it but didn’t really understand why was it happening.


You can add the image as a local resource instead of fetching it online. I think you have to be signed in on codesandbox for uploading to work.