Building A React App 2

Up to this point if you’re looking at index.js there is a lot of card copy.

Let’s create a CardList component and transport them to this file.

and

index.js

Removed the import of Card.

Card list is accepting a robot prop.

In CardList.js,we know that card list receives robots so I have to acces with robots.

We only use robots 0,1,2. I want to use all of them.I have to use loop.

Let’s start with adding another variable,which called const cardComponent, and use map method.

after coding this,our current page is

If we open the console we will see an error:

react-jsx-dev-runtime.development.js:99 Warning: Each child in a list should have a unique “key” prop.

FOR CLEAN CODING:

First version

Last version.