0. JIRA Issue 생성 및 GitHub 설정

1. 프론트 설계

1) 와이어 프레임

2) UI 디자인

2. 주요 화면 및 기능

1. 홈 화면:
   • 구성 요소: 사용자가 앱에 처음 접근하는 화면으로, 약물 인식 기능을 시작할 수 있는 버튼과 설정 메뉴를 제공
   • 기능: 사용자가 쉽게 약물 인식 기능을 사용할 수 있도록 간단한 인터페이스로 구성
2. 약물 인식 및 결과 화면:
   • 기능: 사용자가 촬영한 약물 이미지를 업로드하고, 앱은 해당 이미지를 서버로 전송하여 약물 인식 결과를 받아옴
   • 결과 표시: 인식된 약물의 이름, 인식 확률, 제조사 등의 정보를 사용자에게 표시. 사용자는 인식된 약물의 상세 정보를 클릭하여 확인할 수 있음
   • 추가 기능: 사용자는 결과 화면에서 다른 후보 약물을 선택하여 상세 정보를 확인할 수 있음
3. 약물 상세 정보 화면:
   • 구성 요소: 특정 약물의 상세 정보를 표시하는 화면으로, 약물의 성분, 용량, 부작용, 제조사 등을 포함
   • 기능: 사용자에게 필요한 모든 약물 정보를 직관적으로 제공
4. 약물 인식 히스토리 화면:
   • 기능: 사용자가 과거에 인식한 약물의 기록을 시간 순으로 확인할 수 있는 화면
   • 구성 요소: 과거 인식된 약물 목록과 각 약물에 대한 상세 정보를 포함

3.구현 개요

프론트엔드 기술 스택

• React Native: ToFindPill의 모바일 애플리케이션 개발을 위해 선택된 크로스 플랫폼 프레임워크. 이를 통해 iOS와 Android 환경 모두에서 동일한 코드베이스로 앱을 개발할 수 있었다.
• Axios: HTTP 클라이언트 라이브러리로, 백엔드 서버와 통신하기 위해 사용. 약물 데이터와 이미지를 백엔드에 전송하고 결과를 받아오는 데 사용.
• React Navigation: 화면 간의 이동을 관리하는 데 사용된 라이브러리로, 앱 내 다양한 기능을 유기적으로 연결 가능.

구현 상세

파일 구조: