Hey, can someone help me? I'm stuck on Animal Fun Facts

Preformatted textI’m stuck between steps 7 & 8. I’m not sure what i’m doing wrong so far, have searched elsewhere & in the forum for helpful articles, and just want some help to understand where im going wrong to move on.

Here’s a link to the project. Thanks, in advance.
https://www.codecademy.com/courses/react-101/projects/js-react-animal-fun-facts


const background = <img className='background' alt='ocean' src='/images/ocean.jpg'/>;

const title = '';
const animalFacts = (
  <div>
    <h1>
      {title === '' ? 'Click an animal for a fun fact' : title}
  </h1>
  {background}
  <div className='animals'>
    {images}
  </div>
 </div>
);

const images = [];
for (const animal in animals) {
  images.push(
    <img key={animal} 
    className='animal' 
    alt={animal} 
    src={animals[animal].image} 
    role='button'
    aria-label='button'/>)
};

ReactDOM.render(
  animalFacts, 
  document.getElementById('root')
);

Hello, and welcome to the forums!

In the JSX for animalFacts, you’re using {images} to show the images of the animals. Where are you defining images?

Click here for another hint

Your images array isn’t being created until after you’ve already attempted to use it in the value for animalFacts. You don’t have any syntax issues, you just have a code order issue.

2 Likes

I can’t thank you enough. I’ll keep that in mind next time.

1 Like