Build a Mood Board - Build a Mood Board

JavaScript
1

Tell us what’s happening:

user story 2 says:
2. Your MoodBoardItem component should return a div with a class of mood-board-item at its top-level element.

and i have made it in my code but i can’t pass it

Your code so far

<!-- file: index.html -->
<!doctype html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Mood Board</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/18.3.1/umd/react.development.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/18.3.1/umd/react-dom.development.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/7.26.3/babel.min.js"></script>
    <script
      data-plugins="transform-modules-umd"
      type="text/babel"
      src="index.jsx"
    ></script>
    <link rel="stylesheet" href="styles.css" />
  </head>

  <body>
    <div id="root"></div>
    <script
      data-plugins="transform-modules-umd"
      type="text/babel"
      data-presets="react"
      data-type="module"
    >
      import { MoodBoard } from './index.jsx';
      ReactDOM.createRoot(document.getElementById('root')).render(
        <MoodBoard />
      );
    </script>
  </body>
</html>

/* file: index.jsx */
export function MoodBoardItem(color, image, description) {
  return (
    <div className="mood-board-item">
      // <img className='mood-board-image' src={image} />
    </div>
 )
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/144.0.0.0 Safari/537.36

Challenge Information:

Build a Mood Board - Build a Mood Board

2

Keep going.

You haven’t rendered any moodboard items to the page yet.

1 Like
4

i’ve made the magic, haha yes i did it :slight_smile:

1 Like