40주 간의 체크리스트를 구현하는 프로젝트
- React Native
- Styled Components
- Jotai
- 체크리스트 추가/삭제
- 주차별 체크리스트 UI
- React Native를 처음 접해 세팅에 문제 발생
- 콘솔에 발생한 에러문구대로 버전 업데이트 실행
- 구글링 후, x-code 설치
- 애니메이션 구현의 어려움
- 웹 구현할 때와 다르게 css transition이 동작하지 않음
- Reanimated 라이브러리 공식 문서 정독 및 구글링으로 토스트 팝업, 진행 바 작업
- 주차 변경 시의 체크리스트 컴포넌트 애니메이션은 주차 별로 다른 페이지로 구성해야할 것 같아 React Navigation 라이브러리를 이용해보았으나 동일 컴포넌트를 재사용하여 스크린 구성하는 부분에서 문제 발생 / 시간이 오래 걸려 다른 기능에 중점을 두기로 함
- 주차 슬라이드 애니메이션의 경우, 라이브러리를 이용해보았으나 원하는 디자인 적용 불가로 직접 구현
- 체크리스트 추가 시 Input 컴포넌트가 키보드 위에 위치해야 하는 문제
- 구글링 후, InputAccessoryView로 해결
- 주차 변경 시, 체크리스트 컴포넌트 애니메이션 미구현
- 피그마에 기재되어있지 않은 border-radius 임의로 적용