I have data stored in an object and I want to loop through the data and set it as the props for my component.

My component is a card, and I want to show a card for every piece of data in the loop.

This is code so far -

```
function App() {
  let title = [];
  for (let key in projectDataObject) {
    let newObj = projectDataObject[key].sites;
    for (let key in newObj) {
      title = newObj[key].title;
    }
    return (
      <div className="App">
        <header className="App-header">
          <Card title={title}></Card>
        </header>
      </div>
    );
  }
}
export default App;

```

The problem here is because of the "return" it stops the loop at the first item, and does not loop through everything else.

How can I do this?