토이프로젝트 (2) 썸네일형 리스트형 리액트 토이 프로젝트 - 기억력 게임 개선하기 지난번에 리액트를 이용한 토이 프로젝트인 '기억력 게임'을 만들어보았습니다. 2023.10.04 - [코딩/ReactJS] - 리액트 토이 프로젝트 - 기억력 게임 만들기(feat: 42경산 기억력 테스트) 리액트 토이 프로젝트 - 기억력 게임 만들기(feat: 42경산 기억력 테스트) 42서울과 42경산의 기억력 테스트를 간단하게 맛볼 수 있도록 하기 위해서 순서에 맞춰 카드를 클릭하면 승리하는 게임을 리액트로 만들어보았습니다. 물론 에꼴42에서 주관하는 기억력 테스트 bebutae.tistory.com 위 포스팅을 작성한 당시에는 시작 버튼도 없고, 카드를 선택해도 색상 변경이 되지 않는 문제가 있었습니다. 그래서 개선을 해보았습니다. 개선 후의 버전은 1.20버전이며, 시작하기 버튼이 생겼고, 선택.. 리액트 토이 프로젝트 - 기억력 게임 만들기(feat: 42경산 기억력 테스트) 42서울과 42경산의 기억력 테스트를 간단하게 맛볼 수 있도록 하기 위해서 순서에 맞춰 카드를 클릭하면 승리하는 게임을 리액트로 만들어보았습니다. 물론 에꼴42에서 주관하는 기억력 테스트와 다른점이 많습니다. 에꼴42에서는 여러개의 카드 중 몇개의 카드만 순서대로 반짝이고, 반짝였던 카드를 순서대로 클릭하면 승리합니다. 하지만 제가 만든 기억력 테스트는 화면에 표시된 카드 모두에 순서가 부여되고, 부여된 순서에 맞춰 카드를 클릭하면 승리합니다. 저는 이 토이 프로젝트에서 리액트를 사용하였고, 스타일 컴포넌트로 스타일을 주었습니다. 마지막으로 useEffect와 useState 훅을 이용해 코드를 작성하였습니다. 시작하기에 앞서 리액트 프로젝트를 생성하고, 스타일 컴포넌트를 설치하겠습니다. npx crea.. 이전 1 다음