왜 필요했나요?
모바일 웹 로그인 상태를 유지하면서 새 모집 알림과 상세 화면 이동을 앱처럼 연결해야 했습니다.
PROJECT / SOGNORA
Potion GTR
기존 GTR 모바일 웹을 Android와 iOS 앱으로 연결한 React Native 서비스
무엇을 만들었나요?월드 오브 워크래프트 공격대 관리 앱
어떤 흐름인가요?WoW 공격대 모집 웹을 모바일에서 쓰고 알림으로 바로 들어가려는 이용자
담당 범위React Native 모바일 셸과 웹↔앱 연동
참여 기간 2022.07 – 2023.01 · 약 6개월
월드 오브 워크래프트 공격대 관리 앱
Potion GTR은 월드 오브 워크래프트 공격대 모집과 신청을 처리하던 모바일 서비스입니다.
기존 모바일 웹을 Android와 iOS 앱으로 옮기고 로그인 세션, 푸시 알림, 딥링크를 연동했습니다.
어떻게 구현했나요?
React Native WebView에 PHP 세션, FCM, 딥링크, 다크 모드와 기기 등록 브리지를 붙였습니다.
주요 화면으로 확인하기
출시 기록 · 공식 아트 · 앱 저장소 · 재구성 화면
주요 화면
모바일 웹을 Android·iOS 앱으로 옮겼습니다
기존 GTR 모바일 웹을 React Native 앱 안에서 실행했습니다. 로그인과 화면 이동이 앱에서도 끊기지 않도록 연결했습니다.
주요 화면
새 모집 알림을 누르면 상세 화면이 열립니다
FCM 알림을 누르면 해당 공격대 모집 화면이 바로 열립니다. 아래 두 화면은 당시 코드와 공식 아트를 바탕으로 다시 구성했습니다.
작업 정보
- 담당 범위
- React Native 앱 · Android·iOS 배포 · WebView 연동 · 푸시 알림 · 딥링크 · 로그인 세션 유지
- 참여 기간
- 2022.07 – 2023.01 · 약 6개월
- 사용 기술
- REACT_NATIVE
- 현재 상태
- 서비스 종료 · 기능은 Discord로 이전
- 확인 자료
- 출시 기록 · 공식 아트 · 앱 저장소 · 재구성 화면
구현 범위 자세히 보기
- React Native 앱
GTR 모바일 웹을 Android와 iOS에서 사용하는 하이브리드 앱으로 구성
- WebView 연동
웹의 기기 등록·테마 요청과 앱의 기기 정보·처리 결과를 양방향으로 전달
- 로그인 유지
웹 세션 쿠키를 앱에 저장하고 다시 실행해도 로그인 상태가 이어지도록 처리
- 푸시 알림
FCM 기기 등록, 알림 권한, 포그라운드·백그라운드 알림 처리
- 딥링크
알림과 외부 링크에서 GTR의 해당 모집 화면을 앱으로 바로 연결
- 플랫폼 대응
Android 백 버튼·화면 방향과 iOS 스와이프·상태바·iPad 화면을 각각 조정
다음 프로젝트
프로젝트 문의 비슷한 서비스를 만들고 있나요?
현재 화면이나 필요한 기능을 보내주시면, 필요한 범위부터 함께 정리합니다.