쉼표

관광데이터 공모전 앱 개발 프로젝트

2025년 8월 16일부터 9월 18일까지 진행된 관광데이터 공모전 프로젝트는 React Native 기반으로 처음 모바일 앱을 개발하며 원스토어 배포까지 완료한 프로젝트였다. 프론트엔드 전체 개발을 담당했고, 데이터 시각화와 관광 정보 검색 기능을 중심으로 사용자 경험을 설계했다. 이 경험은 기술적 성장뿐 아니라 위기 상황 속에서도 끝까지 완주하는 책임감을 배울 수 있었던 중요한 계기가 되었다.

프로젝트 배경과 위기 상황

프로젝트는 ‘관광 데이터 API를 활용한 지역 기반 정보 제공 앱’을 목표로 시작되었다. 그러나 마감 3주 전, 기획자가 갑작스럽게 팀을 이탈하면서 큰 위기를 맞았다. 당시 기획안은 거의 완성되지 않았고, 디자인은 초기 단계에 머물러 있었으며, 서버 API만 최소한의 형태로 구축된 상태였다.

이 시점에서 팀원 모두가 프로젝트 지속 여부를 고민했지만, 끝까지 완성하자는 결심을 내렸다. 회의 주기를 주 1회에서 3회로 늘리고, 매일 밤 진행 상황을 공유하며 부족한 기획안을 직접 보완했다. 디자인 시안이 나오면 즉시 반영해 개발을 이어갔고, 수시로 발생하는 디자인 변경에 맞춰 UI를 완전히 다시 구현하는 과정을 반복했다.

무엇보다도 앱스토어 배포 절차를 처음 진행했기에, 빌드 환경 설정과 심사 과정에서 많은 시행착오를 겪었다. 그럼에도 불구하고 마감 당일 새벽까지 테스트를 진행했고, 최종적으로 오전에 원스토어 승인을 받아 제출에 성공했다.

기술적 구조 설계와 구현

React Native를 처음 다루며 가장 중점을 둔 부분은 네이티브 환경에서의 데이터 흐름 관리와 성능이었다. 상태 관리는 React Query와 Zustand를 병행해 구성했고, 서버 요청에 따른 캐싱과 무한 스크롤 구현을 위해 useInfiniteQuery를 적극 활용했다.

useInfiniteQuery를 사용한 이유는 관광 데이터 API의 페이징 구조를 효율적으로 처리하기 위함이었다. API 한 번의 요청으로 20개씩 데이터를 가져오도록 설정하고, 사용자가 리스트 끝에 도달하면 자동으로 다음 데이터를 불러오는 구조로 만들었다. 이 과정에서 스크롤 이벤트와 비동기 로딩 간의 경합 상태를 방지하기 위해 isFetchingNextPage 상태를 기반으로 렌더링 로직을 제어했다. 또한 FlatList 성능 최적화를 위해 keyExtractor 최적화와 windowSize 조정을 적용했다.

UI는 React Native의 LayoutAnimation과 Reanimated 라이브러리를 활용해 페이지 전환 시 부드러운 애니메이션을 추가했다. 이미지와 지도 데이터를 함께 써야 했기 때문에 캐싱된 이미지 로더와 Lazy Loading 전략을 도입하여 메모리 사용량을 최소화했다.

API 구조상 데이터가 일관되지 않고, 일부 엔드포인트가 null을 반환하는 경우가 많아 예외 처리 로직을 세밀하게 구현했다. 이를 위해 transformResponse 단계에서 비어 있는 필드를 기본값으로 변환하고, API 장애 상황에서도 앱이 비정상 종료되지 않도록 Error Boundary를 구성했다.

협업 및 문제 해결

기획자의 부재로 인해 API 스펙과 디자인이 확정되지 않은 상황에서, 개발자는 단순 구현자에 머무르지 않고 사실상 프로젝트 기획을 병행해야 했다. API의 응답 구조를 직접 분석해 프론트엔드 개발에 필요한 데이터 형태를 정의했고, 서버 구조 일부를 테스트 서버에서 자체 검증하여 기능 흐름을 맞췄다.

디자인 역시 매번 수정 사항이 발생할 때 즉시 UI를 재구현해야 했으며, 이로 인해 1주일 동안 두 차례 전체 화면을 다시 설계하는 일도 있었다. 하지만 이러한 과정 덕분에 React Native의 렌더링 구조와 컴포넌트 재활용성에 대한 깊은 이해를 쌓을 수 있었다.

결과와 배운 점

결국 마감 당일, 앱스토어 심사를 통과하면서 완성된 결과물을 제출할 수 있었다. 약 한 달간의 개발 기간 동안 주기적인 야간 작업이 이어졌지만, 팀원 모두 끝까지 프로젝트를 완성해냈다는 성취감은 매우 컸다.

이 경험을 통해 배운 점은 다음과 같다.

• React Native 환경에서의 무한 스크롤, 이미지 최적화, 캐싱 구조 설계
• 백엔드 미확정 상태에서도 데이터 모델링을 스스로 주도하는 능력
• 디자인 변경 및 API 수정이 빈번한 상황에서 UI 구조를 효율적으로 재사용하는 경험
• 불확실한 상황에서도 유연하게 개발 방향을 조정하는 문제 해결력

이 프로젝트는 기술적으로 React Native와 원스토어 배포 경험을 처음 쌓은 의미 있는 출발점이었다. 동시에, 예기치 못한 변수 속에서도 끝까지 완주해야 한다는 책임감과 포기하지 않는 태도를 몸에 새긴 경험이었다. 이후 해커톤과 각종 프로젝트에서도 이때 배운 집중력과 실행력이 큰 원동력이 되어, 어떤 제약 상황에서도 주저하지 않고 도전할 수 있는 자신감을 갖게 했다.