내일배움캠프 4기 React week_12 WIL

1. 심화 프로젝트

프로젝트 노션 링크

이번 프로젝트 땐

내가 과거에 태어났다면? 을 주제로 프로젝트를 진행하게 되었다.

과거에 있었던 역사적 사실들을 기반으로 역사 교육을 진행하고
그 후 간단한 재미있는 테스트를 통해 자신이 어떤 시대의 사람일까?
알 수 있는 프로젝트 이다.

구글 스프레드 시트를 통해 json 파일을 생성하였다.
배열 속 객체로 생성하여 테스트 하나 안에 점수와 문제, 답으로 구성하였다.

동작 원리는
count 를 이용하여 0부터 9까지 숫자가 올라가고 선택한 답에 따라
점수가 부여되고 합산이 score로 저장이 된다.
count 가 10 이라면 score 를 props 로 결과창에 보내주고
score에 따라 어느 시대의 사람인지 구분된다.

타입스크립트를 이용하여 만들어서 타입지정하는데 좀 애를 먹었지만
하루안에 해결할 수 있었다.

status bar 같은 경우에도 count 값에 따라 색이 점점 채워지게 하고
transition을 통해 부드럽게 상승하는 효과를 주어 훨씬 자연스러워졌다.