React 모바일 페이먼츠 애플리케이션
결과 페이지 보러 가기: https://iborymagic-payments.netlify.app/
Component-Driven Development
에 따라 UI를 구성하고 재사용 가능한Component
를 작성합니다.
✔️ 모바일 타겟
의 웹 앱을 구현하며 사용하기 편리한 모바일 UI/UX
에 대해 고민해봅니다.
✔️ 다른 라이브러리나 프레임워크 없이 오로지 React
만으로 상태를 관리하고 컴포넌트를 설계합니다.
✔️ React Hooks API
를 활용합니다.
✔️ 재사용 가능한 Component
를 직접 작성하고 사용합니다.
✔️ Controlled
& Uncontrolled Components
에 입각하여 Form
을 핸들링합니다.
- 폼을 통한 카드 추가
- 유효성 검증 실패에 대한 UI/UX
- 카드 추가 확인
- 카드 목록 조회
- 나열된 카드 클릭시
카드 추가 확인
화면 재활용- 별칭 수정 가능
Context API
를 활용해 전역 상태 관리 및 계층 재구성