# \[Feedback\] Quotes Generator with ReactJS

**URL:** <https://forum.freecodecamp.org/t/feedback-quotes-generator-with-reactjs/346137>\
**Category:** I Built This\
**Created:** [January 31, 2020, 3:11am UTC](https://forum.freecodecamp.org/t/feedback-quotes-generator-with-reactjs/346137 "2020-01-31T03:11:55Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Hash2C](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hash2c/32/132447_2.png) [@Hash2C](https://forum.freecodecamp.org/u/Hash2C)\
**Post date:** [January 31, 2020, 3:11am UTC](https://forum.freecodecamp.org/t/feedback-quotes-generator-with-reactjs/346137/1 "2020-01-31T03:11:55Z")

</div>

Hello everyone, here I am sharing the [quotes generator project](https://codepen.io/Hash2C/full/VwYNwLQ).

- It was built with React (but not Redux)
- It was really fun to build the “scrapping” js script to get those quotes from [goodreads.com](http://goodreads.com); the list of quotes is hard-coded; ideally it would be fed by some API
- I had to invest a little bit of time (more than expected) getting around some char encodings
- Even though it could be better, I’m fairly pleased with the result

Feel free to give me feedback, it is much appreciated! 😀  
P.S: One of the things I definitely want to add is some [Accessibility capabilities](https://www.essentialaccessibility.com/blog/web-content-accessibility-guidelines-wcag/)

---

<div class="post-metadata">

**Author:** ![bahaa1985](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/bahaa1985/32/118973_2.png) [@bahaa1985](https://forum.freecodecamp.org/u/bahaa1985)\
**Post date:** [February 1, 2020, 1:09pm UTC](https://forum.freecodecamp.org/t/feedback-quotes-generator-with-reactjs/346137/2 "2020-02-01T13:09:04Z")

</div>

It’s very cool ! nice work

---

<div class="post-metadata">

**Author:** ![ArinWu](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/arinwu/32/78494_2.png) [@ArinWu](https://forum.freecodecamp.org/u/ArinWu)\
**Post date:** [February 2, 2020, 4:58am UTC](https://forum.freecodecamp.org/t/feedback-quotes-generator-with-reactjs/346137/3 "2020-02-02T04:58:11Z")

</div>

Everytime u click the Button, box will change it’s own width, and height along with the content…, also the Button position will change too…  
My personal idea is find the ‘longest string’ generate the fixed biggest width and height, set it to the box… or put the button outside of the box.

---

<div class="post-metadata">

**Author:** ![Hash2C](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hash2c/32/132447_2.png) [@Hash2C](https://forum.freecodecamp.org/u/Hash2C)\
**Post date:** [February 2, 2020, 5:13am UTC](https://forum.freecodecamp.org/t/feedback-quotes-generator-with-reactjs/346137/4 "2020-02-02T05:13:32Z")

</div>

Thanks for the feedbak!  
During development I noticed that, it’s not a good UX - but “_only if one is rushing through the quotes_”, like when testing.

The solution you provide is great (actually these quotes are already the result of applying a filter on their length).

I thought I wanted some “chill vibes”, that’s why I want to add a fading transition between quotes, so people can take time to enjoy each one. Maybe even adding a Autoplay button would be nice, what do you think?

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [June 1, 2021, 1:41pm UTC](https://forum.freecodecamp.org/t/feedback-quotes-generator-with-reactjs/346137/5 "2021-06-01T13:41:30Z")

</div>

Closed on June 1, 2021, 1:41pm UTC