대소문자 구분에 주의

// PokemonList.jsx

const PokemonList = ({ pokemonList, onAddPokemon }) => {
  return (
    <ListContainer>
      {pokemonList.map((pokemon) => (
        <div>{pokemon.korean_name}</div>
        <PokemonCard
          key={pokemon.id}
          pokemon={{}}
          onAdd={() => {}}
          isSelected={false}
        />
      ))}
    </ListContainer>
  );
};

// Dex.jsx
export default function Dex() {
  const [selectedPokemon, setSelectedPokemon] = useState([]);

  return (
    <DexContainer>
      <Dashboard selectedPokemon={selectedPokemon} />
      <PokemonList PokemonList={MOCK_DATA} />
    </DexContainer>
  );
}

PokemonList.jsx에서 pokemonList, onAddPokemon을 props로 받아오고 있었는데 문제발생

=> 페이지가 안열림 확인해보니 Dex.jsx 파일의 pokemonList를 불러오는 부분이
PokemonList로 앞글자가 대문자로 작성됨 이로 인해 props가 일치하지 않게 되어 오류가 발생했었다

하필 얼핏보면 구분이 힘든 ( p, P ) 차이 때문에 한번에 알아차리기 어려웠던것도 큼

& ( i, I) 같은 경우에도 주의하자