Home

🌎 traveline

여행 일정을 타임라인으로 기록하고 공유하는 여행 SNS 서비스입니다.
나만의 여행을 공유하고 다양한 여행들을 만나보아요 :)

나랑 비슷한 취향과 환경을 가진 다양한 여행들을 만나고 나만의 여행 계획을 짜보아요 !

• 지역, 기간, 테마 등 총 8 가지의 필터를 통해 내가 원하는 여행을 찾을 수 있어요.
• 키워드 검색을 통해 원하는 여행을 바로 탐색할 수 있어요.
• 매 날짜마다 시간 순으로 기록된 여행들을 통해 보다 쉽게 일정을 확인할 수 있어요.
• 지도로 보기 기능을 통해 어떤 장소에 머물렀는지 지도로 한눈에 볼 수 있어요.

Traveline 팀 소개

S009 김영인	S013 김태현	S041 홍기웅	J048 박경미	J170 황정민
@0inn	@kth1210	@otoolz	@kmi0817	@yaongmeow
iOS	iOS	iOS	BE	BE

프로젝트 구조

iOS
BE

iOS 기술 스택

MVVM + CleanArchitecture

• 현재 서비스 기획 간 복잡한 아키텍처의 필요성을 느끼지 못했고, 작업 간 로직 분리의 용이함을 위해 선택했습니다.
• 또한 여러 명이 동시에 개발해야하기 때문에 CleanArchitecture를 활용해 역할 분리를 확실히 해두어 코드의 통일성을 유지했습니다.
• Repository 패턴을 통해 Data Source를 캡슐화할 수 있었고, RepositoryMock을 이용해 서버 개발 상황에 관계없이 개발을 진행할 수 있었습니다.

Combine

• Third-party인 RxSwift에 비해 시간, 공간적 성능이 우수하기 때문에 First-party인 Combine을 선택했습니다.
• 데이터 스트리밍을 조작하고 구독하는 것에 최적화된 Combine을 UI Binding에 활용했습니다.

Swift Concurrency

• Concurrency를 활용해 단발성 비동기 응답인 네트워크 로직을 보다 직관적으로 처리해주기 위해 선택했습니다.
• Repository - Network의 흐름을 간결하게 작성할 수 있었습니다.

MapKit

• 지도 위에 마커를 표시하고 정보를 보여주기 위해 사용했습니다.
• 위치 좌표 정보만 서버에서 받아오면 되기 때문에 다른 Third-party 지도를 사용할 필요가 없다고 생각해 애플 프레임워크인 MapKit을 선택했습니다.

Keychain

• 로그인 이후 토큰 등 민감한 사용자 정보를 안전하게 저장하고 관리하기 위해 사용했습니다.

BE 기술 스택

NestJS + TypeORM

• 원활한 협업과 코드 리뷰를 위해 자율성이 높은 Express는 적절하지 않다고 생각했습니다. 따라서 아키텍처가 갖춰지고, TypeScript가 기반인 NestJS를 선택했습니다.
• 일인자 TypeORM과 요즘 핫한 Prisma. TypeORM 사용자에게 Prisma가 인기 있는 이유를 이해하려면 TypeORM을 알아야 합니다. 따라서 저희는 먼저 TypeORM을 경험하고자 했습니다.

RDB

• traveline 앱은 하나의 게시글에 여러 타임라인 글이 연결됩니다. 또한 각 게시글에는 좋아요와 신고 정보가 존재합니다.
• 테이블 간 join 연산이 많이 발생할 것이므로 NoSQL보단 RDB가 적절하다고 판단했습니다.

GitHub Actions + Docker

• 원래 수동 배포를 시도했지만, node 버전 이슈와 systemd service 등록 과정에 어려움을 겪었습니다. 따라서 로컬 작업 환경을 그대로 컨테이너를 구성할 수 있고, 이식성이 뛰어나며 지속적인 배포에도 유용한 Docker를 사용했습니다.
• Swagger API를 서둘러 iOS 측에 공유하기 위해 러닝 커브가 낮고, 신속한 세팅이 가능한 GitHub Actions로 배포를 진행했습니다.

Let’s Encrypt + Nginx

• 애플 정책상 ipa는 https에서만 배포할 수 있습니다. 이에, 90일마다 SSL 인증서를 갱신해야 하지만 무료로 발급받을 수 있는 Let’s Encrypt를 사용했습니다.
• Nest 서버에서 직접 SSL 인증서를 관리하려면 코드 수정이 불가피합니다. 반면 웹 서버를 Reverse Proxy로 사용하면 간단하게 SSL 구성을 완료할 수 있습니다. 또한 애플리케이션 코드에 SSL 관련 횡단 관심사 코드가 존재하지 않아, 더욱 핵심에 집중할 수 있습니다.

AWS SES (Simple Email Service)

• traveline은 새로운 IP로 로그인 시 본인 확인 메일을 전송하는 서비스를 제공합니다.
• Nest 내장 모듈인 nodemailer는 보안상 취약점이 발견되어 실서비스에서는 사용되지 않습니다. NCP의 Cloud Outbound Mailer는 어뷰징 문제로 인해 현재 (2023.12) 서비스 신청이 막혀 있습니다. 이에, AWS SES를 사용했습니다.

🔥 우리의 도전들

iOS

- 단방향 플로우 ViewModel 구현기

- Concurrency와 Combine의 공존

- traveline의 이미지 관리하기

- traveline 디자인 시스템 구축기

- KeychainWrapper로 사용자 정보 관리하기

- 권한 설정 없이 사진의 시간 메타데이터 가져오기

- 사이드 바 사용성 개선기

- MapKit으로 타임라인 보여주기

- 작업을 서로 바꿔서 해보자!

BE

- 생애 첫 CI CD 도전기

- @nestjs/swagger로 이미지 업로드 form을 어떻게 만들지?

- 클라이언트에서만 발생하는 413 Content Too Large 에러?

- 애플 로그인 구현 과정

- 이메일 서비스 적용 과정

- 로그인 로그아웃 처리

📚 문서	Wiki	팀 노션	그라운드 룰	컨벤션	회의록	기획/디자인