My Random Quote Machine - Pure JS

Hello everyone!

I just finished this project. I wrote it with pure JavaScript. Feedback is most welcomed!

Link to my CodePen


1 Like

works nicely! Looks cool too!

You should look into encodeURIComponent(), currently you can’t tweet quote with special symbols in it (e.g. ;).

Also it looks like forismatic API requires some delay between requests so it shows the same quote if you click “Get Quote” within second or so. I would recommend to add some animation to make a delay, but I understand that with pure JS it will be a pain :wink: Maybe CSS transitions?

1 Like

Yes, I really like that idea.

I found a possible implementation where I can stack both on top of each other, then use CSS transition for the opacity property. I can then change the top quote to opacity: 0.

Thanks for the idea!

I updated the app to fade in and out of each new quote, once again using pure JS. It took me all evening, but it forced me to learn about callbacks and eventListeners!

Check out the updated version: Random Quote Machine