Github Link
Foodle
팀 간장치킨
팀원
- 박진희(팀장, 프론트)
- 김지현 (백)
- 정민정 (프론트)
개발하게 된 이유
- 친구들과 약속을 잡고 맛집이나 카페를 방문하는 것을 좋아한다. 국내에서 많이 사용하는 네이버 지도에서는 장소 저장 리스트를 공유할 수는 있으나, 리스트의 주인만 수정 가능하다. 친구들끼리 맛집 정보를 모을 때 총대를 맨 한 명만이 이를 일일히 추가하는 것이 번거롭다고 느껴져 해당 앱의 아이디어를 생각하게 되었다.
내가 약속을 잡을 때 느꼈던 아쉬움은 다음과 같다.
- 카카오톡에서 약속을 잡을 경우 채팅이 묻혀 계속 약속 시간, 장소 등을 재차 확인하게 됨
- 방문할 장소 또한 제대로 정리되어있지 않음. 네이버 지도로 저장하더라도 매번 총대가 카톡을 확인하고 리스트를 수정해야 함
- 저번 약속때 어디를 방문했었는지 찾아보기 어려우면 다시 물어봐야 함
그래서 이런 아쉬움을 해소할 수 있도록 프들을 기획하였다.
(왜 프들인가? Food + doodle, 또한 푸들같아서 귀엽잖아..)
애플리케이션 소개
- <프들>은 지도 어플리케이션과 캘린더 어플리케이션, 공유 문서 기능을 통합하여 기존 어플리케이션의 한계점을
없앤 지도+캘린더 통합 iOS 어플리케이션이다.
- 기존 N사의 지도 어플리케이션과는 달리 약속 일정에서 방문할 장소 리스트의 수정을 공유 받은 사람 또한 참여할
수 있다.
- 캘린더 어플리케이션과는 달리 방문할 장소를 시간 정보를 포함하여 여러 군데 지정 가능하다.
- 그 외 사용자의 편의성을 위한 시간선호도 설정에 맞춘 약속 시간 추천, 선호/비선호 키워드 설정을 통한 방문 장소 검
색 필터링 기능, 마음에 드는 장소 저장 기능인 마이플레이스 기능이 제공된다.
사용 스택
- XCode(swift) : iOS 17 기준 개발
- UIKit 및 MKMapView 위주의 프레임워크 사용
- Java, mySQL, SpringBoot, AWS, Firebase
- 협업툴: Slack, Trello, ERDCloud, Figma, Git
개발 과정
- 매 주 정기 회의를 Google Meeting 및 Slack 으로 정리 및 진행
- 해야 할 일 정리는 Trello로 관리
- 작업 순서
- Figma로 레이아웃 및 흐름 디자인
- Xcode로 뷰컨트롤러 생성 및 스토리보드에서 배치
- AutoLayout 추가
- 완성된 뷰에 기획한 기능 코드 작업
- 프론트에서 필요한 정보값을 백에 요청, 이후 명세서 작성 후 프론트-백 연결함.
개발에 걸린 시간
- 1~3월: 아이디어 구체화 및 팀원 모집
- 4~5월: 구체적 기능 논의 및 Figma로 디자인, ERD 작성
- 6월: 실제 XCode로 뷰 작업, 기초적 서버 준비 및 소셜 로그인 코드 작성
- 7~9월: 기능 개발
- 10월: 디버깅 및 졸업프로젝트 발표회 준비
맡은 업무
- 팀장으로서 일정 계획 짜기, 아이디어 제공
- Github 컨벤션 안내, Trello 사용법 안내
- 메인화면 뷰 개발
- 일정 추가/편집 기능
- 일정 확인 기능
- 장소 리스트 추가 기능
- 약속 시간 추천 기능
- 검색 기능(프론트)
- 장소 정보 확인 기능
- 네이버 로그인
기능
- 소셜 로그인 (카카오톡, 네이버)
- 친구 추가 및 친구 정보 열람(친구의 마이플레이스, 친구와의 약속)
- 장소 리스트 저장 기능
- 약속 추가 및 약속 정보 동시 편집 기능
- 약속 시간의 경우 참여자들 간 선호 시간대의 교집합을 추천 시간대로 표시함.
- 방문할 장소를 시간대별로 추가 및 동시 편집 가능
- 이 과정에서 장소 검색 시 참여자들의 선호 키워드와 관련된 장소가 상위 노출됨.
- 장소 검색 기능
- 일정 확인 및 알림 기능
![](https://velog.velcdn.com/images/rudin_/post/48a81b0c-ee47-4482-8990-21a48521a268/image.png)
![](https://velog.velcdn.com/images/rudin_/post/8f173134-98c6-4af0-83fd-323a728b96e0/image.png)
![](https://velog.velcdn.com/images/rudin_/post/2b36979b-ef30-4e28-a3ad-515a239e3080/image.png)
![](https://velog.velcdn.com/images/rudin_/post/6458cc42-bd1b-484b-a096-294ef0a6cf6c/image.png)
![](https://velog.velcdn.com/images/rudin_/post/8a37c3cf-597a-43be-8d07-01f64c955820/image.png)
개발 중 발생한 문제점 및 해결책
1. SheetPresentation 위 탭바 표시 문제
SheetPresentation 은 아래에서 위로 스와이프해서 목록을 볼 수 있게 해주는 BottomSheet 를 쉽게 생성해주는 기능으로, 뷰 표시 방식 중 하나이다. 다만 SheetPresentation 위에 탭바를 표시하는 기능은 기본적으로 제공되지 않으며 탭바를 덮은 상태로 View 가 표시된다. 이를 해결하기 위해 ViewHierarchy 에 대해 다시 확인하고, 계층 구조를 파악하여 새로운 SheetPresentation 뷰를 위한 탭바를 새로 만들어서 등록해주기를 통해 해결하였다. 다만 이는 iOS17 버전까지만 작동하며, iOS18 버전 이후 뷰 계층상의 문제로 제대로 동작하지 않음을 확인하여 추후 수정이 필요하다. 이를 통해 뷰 계층에 대해 다시 복습해야함을 느꼈다. 기초가 탄탄해야 코드를 짜던 뭘 하던 한다.
2. Apple Developer 부재로 인한 Push Notification 불가 문제
iOS 애플리케이션으로 서버에서 Push 를 보내는 것은 Apple Developer 을 구독하지 않으면 제공되지 않는 기능으로 약속이 추가된 경우 참여자들에게 알림을 보낼 수 없는 문제가 발생하였다. 해당 문제를 해결하기 위해 방식을 우회하여 사용자측에서 일정 시간대마다 백그라운드에서 서버의 데이터를 fetch 하는 방식으로 해결하였다. 사용자의 CoreData에 저장된 앞으로 다가오는 약속의 개수와 서버의 다가오는 약속의 개수가 다른 경우, Local Notification을 발생시키는 방식으로 구현하였다. 물론 이는 부정확한 방식(매 정해진 시간마다 백그라운드 실행이 바로 되지는 않는다)이고 효율적이지 못하기 때문에 Firebase와 연동하여 Subscribe 하는 방식이 더 효율적이지만 돈을 내야하므로...
3. 서버 측에서 개발한 소셜 로그인 사용 불가 문제
소셜 로그인을 처음 도입해보았기 때문에 서버에서 개발해야 되는 줄 알았으나, 서버에서 로그인을 통해 얻은 토큰을 프론트에 넘기는 것은 두 번 일을 처리하는 것과 같은 효율적이지 못한 방식이었다. swift 자체에서 카카오 및 네이버 로그인 프레임워크를 import하여 사용하는 것이 바람직했기 때문에, 서버에서 개발했던 코드를 실제로 쓰지 못하는 아쉬움을 얻게 되었다. 이후 개발 전 간략하게나마 방식을 파악하는 것이 팀원들의 혼란을 줄일 수 있음을 알게 되었다. 미안합니다 서버 개발자님!
시연 동영상
시연 동영상 링크
경험
- iOS 개발자로 진로를 틀은 후 처음으로 개발해본 팀 프로젝트
- 기존에 <<향유>> 팀프로젝트에서 서버로 참여해본 경험이 프론트-백 간 데이터 연결에 도움을 줌. 이를 통해 프론트만 고집할 것이 아니라, 서버와 관련된 기초 지식도 필요함을 알게 됨
- SheetPresentation과 같이 기본적으로 제공하는 기능이 어떤 뷰 계층의 방식에서 작동되는지, 기초부터 알아야 응용이 가능함을 깨닫고 이론 공부의 중요성을 느낌
- Apple 앱 런칭을 경험해보려면 Apple Developer을 구독해야함 ㅋㅋ
- 여태까지 여러번 팀장을 하고 성공하기도 하고 엎어지기도 했던걸 바탕으로 일정을 빠듯하게 잡음. 일정을 빠듯하게 잡아야 제 시간에 완성할 수 있음을 느꼈다..