Import the Card Component

Import hooks and components

We’ll import Card.js and pass the data to the Card component in the App.js file so that we can view the real layout of the cards. Before doing that, however, let’s first import hooks like useState and useEffect. Then we’ll create some states to select the cards, as well as the disabled state.

In the following snippet, choiceOnce and choiceTwo hold the state of the card that’s being flipped by us in the turn, and setChoiceOne and setChoiceTwo are the functions that update the state. The disabled variable holds the state of the flipped card. If it’s true, the card doesn’t flip back, and if it’s false, the card does flip back.

import { useEffect, useState } from "react";
import Card from "./Card/Card";

// It

...