All games

The Home component will fetch the list of all the games in the game collection using the list API when the component mounts.

mern-vrgame/client/core/Home.js:

componentDidMount = () => {    list().then((data) => {      if (data.error) {        console.log(data.error)       } else {        this.setState({games: data})       }    })}

The list of games retrieved from the server will be set to state and iterated over to render a GameDetail component with each game in the list.

mern-vrgame/client/core/Home.js:

{this.state.games.map((game, i) => {     return <GameDetail key={i} game={game} updateGames={this.updateGames}/>})}

The GameDetail component will be passed the game details and an updateGames method.

mern-vrgame/client/core/Home.js:

updateGames = (game) => { const updatedGames ...

Get Full-Stack React Projects now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.