# Random quote machine feedback and questions

**URL:** <https://forum.freecodecamp.org/t/random-quote-machine-feedback-and-questions/420503>\
**Category:** I Built This\
**Created:** [September 13, 2020, 2:38pm UTC](https://forum.freecodecamp.org/t/random-quote-machine-feedback-and-questions/420503 "2020-09-13T14:38:14Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![sdbondt](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/sdbondt/32/144398_2.png) [@sdbondt](https://forum.freecodecamp.org/u/sdbondt)\
**Post date:** [September 13, 2020, 2:38pm UTC](https://forum.freecodecamp.org/t/random-quote-machine-feedback-and-questions/420503/1 "2020-09-13T14:38:14Z")

</div>

Hello all, I just completed the Random Quote Machine project, not for the first, but for the first with “React Hooks”, which is something I want to learn to use.  
Link:[here](https://codepen.io/koffiekan/full/rNevPEJ)

I have got 2 questions of my own about this project though:  
1)when I made the version with hooks, the first quote I got upon loading the page is always the same one(index zero) from the array and I don’t immediately see how I could change this to be more random  
2)To load my quotes i wrote:

```auto
<h1 id="text">{quotes.length>1? quotes[index].quote:''}</h1>

```

Where i work quotes.length. It works but I somehow doubt this is the best way to write that piece of code.

Any advice about these two things would be more than welcome, if there are other remarks, don’t hesitate to give them either.

---

<div class="post-metadata">

**Author:** ![jenovs](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jenovs/32/60963_2.png) [@jenovs](https://forum.freecodecamp.org/u/jenovs)\
**Post date:** [September 13, 2020, 3:01pm UTC](https://forum.freecodecamp.org/t/random-quote-machine-feedback-and-questions/420503/2 "2020-09-13T15:01:13Z")

</div>

> [@sdbondt](#):
>
> when I made the version with hooks, the first quote I got upon loading the page is always the same one(index zero) from the array and I don’t immediately see how I could change this to be more random

Use **two** `useEffect` hooks (first effect runs once on initial render, and second after `quotes` gets updated):

```js
  useEffect(() => {
    getQuotes(API);
  }, []);

  useEffect(() => {
    getIndex();
  }, [quotes]);

```

> [@sdbondt](#):
>
> Where i work quotes.length. It works but I somehow doubt this is the best way to write that piece of code.

Not sure what exactly you don’t like about your code, but you could shorten it to:

```auto
<h1 id="text">{quotes[index]?.quote}</h1>

```

---

<div class="post-metadata">

**Author:** ![sdbondt](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/sdbondt/32/144398_2.png) [@sdbondt](https://forum.freecodecamp.org/u/sdbondt)\
**Post date:** [September 13, 2020, 3:23pm UTC](https://forum.freecodecamp.org/t/random-quote-machine-feedback-and-questions/420503/3 "2020-09-13T15:23:08Z")

</div>

Thank you for the two useEffect’s, that worked indeed.

About 2) I thought I could just work with “quotes ?” instead of “quotes.length\>1?” but that gives me the error: “Type error: quotes[index] is undefined” so I changed it.  
It’s not that I don’t like the code, it’s that I don’t fully understand why it has to be written this way.

---

<div class="post-metadata">

**Author:** ![jenovs](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jenovs/32/60963_2.png) [@jenovs](https://forum.freecodecamp.org/u/jenovs)\
**Post date:** [September 13, 2020, 3:39pm UTC](https://forum.freecodecamp.org/t/random-quote-machine-feedback-and-questions/420503/4 "2020-09-13T15:39:02Z")

</div>

> [@sdbondt](#):
>
> “Type error: quotes[index] is undefined”

It’s because initially `quotes` is an empty array and therefore `quotes[0]` is `undefined` and when you try to access `quote` of `undefined` you’ll get this error.

---

<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:10pm UTC](https://forum.freecodecamp.org/t/random-quote-machine-feedback-and-questions/420503/5 "2021-06-01T13:10:53Z")

</div>