치카치카는 인터넷상 무분별한 치과 광고와 개인간의 입소문으로만 전해지는 정보에 의해
나에게 맞고 믿을 수 있는 치과를 찾지 못하는 문제를 해결하기 위해 기획된 프로젝트입니다.
- 서비스 기획 및 개발
2020.10 ~ 2021.02 - MVP 테스트 및 오류 개선
2021.02 ~ 2021.03 - iOS, Android 스토어 출시 (현재 삭제됨)
2021.03
| 이름 | 담당 | 기능 |
|---|---|---|
| 이재연 (zaeyon) | 프론트엔드 | 로그인/회원가입, 치과지도, 리뷰작성 기능 담당 |
| 이태규 (postmelee) | 프론트엔드 | 커뮤니티, 홈화면 기능 담당 |
| 정지원 (jiwon11) | 백엔드 | 백엔드 전체 기능 담당 |
| 전윤정 | 디자인 |
React-Native를 사용하여 iOS, Android를 모두 지원하는 하이브리드앱으로 개발하였습니다.
타입 에러를 방지하기 위해 TypeScript를 도입하여 기존의 JavaScript와 함께 사용하였습니다.
빠른 개발과 테스트가 중요한 스타트업이므로 iOS, Android 앱을 한번에 만들 수 있는 React-Native를 선택하여 하이브리드 앱을 만들었습니다.
styled-components를 사용하여 CSS 코드를 JS파일안에 작성함으로써 생산성을 높였습니다.
Axios를 사용하여 비동기 API를 연동하였습니다.
서비스에서 사용되는 사용자의 로그인 데이터, 치과 데이터와 같이 전역으로 사용되는 데이터를 관리하기 위해 Redux를 사용하였습니다.
Container 컴포넌트에선 비즈니스 로직과 상태 관리, 라우팅에 대한 코드를 작성하고 사용자한테 보여지는 UI에 대한 코드는 Presentational 컴포넌트로 나눠서 작성하여 코드의 재사용성과 유지보수를 용이하게 하였습니다.
사용자가 치과의 위치를 보다 시각적으로 확인하기 위해 네이버 지도 API를 연동하였습니다.
- 사용자가 휴대폰 번호 문자 인증을 통해 회원가입을 하면 서버에서 jwtToken을 생성하여 응답합니다.
응답받은 jwtToken은 클라이언트에 저장하여 사용자가 어플 재실행 시 자동 로그인 되도록 구현하였습니다.
- 네이버 지도 API를 연동하여 사용자는 주변 위치, 원하는 위치에서 치과를 검색 할 수 있습니다.
또한 방문일자, 교정 전문의, 야간 진료, 일요일/공휴일 진료와 같은 상세한 필터링을 통해 사용자는 보다 자신에게 치과를 찾을 수 있습니다.
- 사용자는 리뷰를 작성할때 사진, 치과 이름, 질명 및 치료 항목, 치료 비용, 교정 시작/종료 날짜와 같은 정보를 추가할 수 있고 문단별로 사진/설명을 작성할 수 있어 보다 상세한 리뷰를 작성 할 수 있습니다.
- 사용자는 마이페이지를 통해 작성한 리뷰, 커뮤니티 게시글을 확인 할 수 있습니다.
- 키워드를 통해서 원하는 치과를 검색할 수 있습니다.
검색된 치과의 상세 페이지로 이동하면 전국 치과 공공데이터로 부터 추출한 해당 치과의 설립 연도, 요일별 진료 시간, 상세한 위치, 진료 과목, 전문의 여부, 주차와 같은 상세한 정보를 확인 할 수 있습니다.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent