제출 폼 UI 구현 : 나라 이름 필드, 메달 갯수 필드, 제출 후 빈 값 초기화, submit 했을 때 나라와 메달 수 추가

메달 집계 CRUD 기능

메달 집계 정렬

중복 국가 처리

존재하지 않는 국가 알림

로컬 스토리지 활용

localStorage를 활용해 영화 카드에 북마크 기능 추가

🔭[배포용 링크] [(https://minjun2131.github.io/MedalTracker/)]

• CRUD

  • 국가별 메달 집계 내역 화면에 출력
  • 국가 메달 갯수 로컬스토리지에 저장
  • 원하는 국가 삭제가능
  • 원하는 국가에 대한 메달 정보를 수정 가능

• 메달 정렬

  • 최초 금메달로 내림차순 정렬 (위 -> 아래)
  • 원하는 항목 옆 아이콘 클릭시, 클릭한 항목 기준으로 내림차순 정렬

• 입력 중 오류

  • 메달 갯수가 음수 혹은 99 초과일 경우 경고 메세지 표기
  • 나라 이름이 중복되었을 경우 경고 메세지 표기

이름을 조금 더 신경써서 지을 수 있게 제작하기

useState는 리렌더링을 일으키기에 이를 염두하고 있어야 한다.

useState 와 props의 작동방식에 대해 이해할 수 있었다.

components를 분리하는 기준에 대해서 생각할 수 있었다.

js와 다른 react의 환경에서의 사용법을 익힐 수 있었습니다.