kkh.dev
Bredis | Frontend Developer | 2024-06 - 2025-01

Chitacare

#웹개발#헬스케어#하이브리드앱#React

매일 쉽게 실천 가능한 습관을 통한 지속 가능한 헬스케어 프로젝트

Chitacare

기술 스택

ReactViteTypeScriptEmotionTanStack QueryJestStorybookGitHub Actions

주요 기능

  • WebView Native Bridge 구축
  • 헬스 커넥트 데이터 연동 (걸음, 수면)
  • 이메일 인증 (딥링크 연동)
  • 동적 import를 사용한 프로젝트 최적화

상세 내용

치타케어는 매일 쉽게 실천 가능한 습관을 통한 지속 가능한 헬스케어 프로젝트입니다.

구현 내용

  • 프로젝트 세팅 및 WebView Native Bridge 구축
  • 헬스 커넥트 데이터 연동: 걸음, 수면 데이터를 불러온 후 서버로 전송
  • 이메일 인증: 이메일 인증메일에 딥링크를 심어 웹이나 이메일 앱에서 인증하기 버튼 클릭 시 앱으로 이동 후 회원가입 재개

성과

  1. Native Bridge Protocol을 이용해 헬스 데이터 웹뷰로 전송
  2. 동적 import를 사용하여 프로젝트 최적화

배운 점

  • Native Bridge Protocol을 이용해 헬스 데이터 웹뷰로 전송
  • React의 lazy import 기술을 이용하여 필요할 때 컴포넌트 호출
Google Play