아직 완벽하진 않지만 간단한 웹서비스를 만들고 나니까(사실 보완해야할 게 산더미) 그 다음에 든 생각은 하이브리드 앱을 만들고 싶다는 생각이 었습니다.
제가 알고 있는 지식은 플러터나 리액트 네이티브를 가지고 앱을 만들 수 있다 정도 였습니다. AI에게 물어보니까, Capacitor를 활용하여 현재 코드를 최대한 활용하는 방식을 권유받게 됩니다.
Capacitor?
웹 앱을 네이티브 앱으로 변환하는 프레임워크입니다. 장점으로는 PWA와의 통합이 더 쉽다고 합니다. 근데,, PWA.. 어디서 주워 들어본 거 같은데, PWA는 또 뭐길래 통합이 더 쉽다고 하는지가 궁금하여 추가로 AI에게 PWA가 무엇인지를 물어봤습니다.
PWA (Progressive Web Apps)
웹 기술로 개발되었지만, 네이티브 앱과 유사한 사용자 경험을 제공하는 웹 애플리케이션이라고 합니다. 앱스토어가 필요없고, 홈 화면에 아이콘으로 추가가 가능하며, 푸시 알림 등이 지원됩니다. 생각해보니, Capacitor를 사용해볼 게 아니라, PWA 적용이 먼저이겠다 싶어서, PWA를 빠르게 도입해보기로 결정했습니다.
현재 만들어진 웹앱에 간단하게 PWA가 될 수 있도록만 적용을 하고, 심지어는 외부 인터넷에 연결도 되어 있지 않은데, 제가 가지고 있는 아이폰에서 동작하는지를 확인하고 싶어서, ngrok으로 외부 인터넷에서 접근할 수 있는 임시 url를 생성해서 로컬에서 띄운 웹앱을 접근했습니다.
iOS 모바일의 경우에는 PWA를 이용하기 위해서는 Safari 브라우저에서 접근해야합니다. 홈 화면에 추가가 되는 것을 확인했고, 홈 화면에 추가된 앱으로 열어보니 검색창 같은 브라우저 요소가 보이지 않고 네이티브 앱과 같은 모습임을 확인했습니다.
아이폰으로 푸시 알림을 받기 위해서는 버전이 16 이상이 되어야 한다고 합니다. 제가 만드는 서비스를 이용하는 사용자의 스마트폰은 안드로이드입니다. 이러나 저러나 사용자에게 푸시 알림도 보낼 수 있는 여건이 마련됐습니다.
제가 만든 웹 서비스는 url을 통해 카카오톡으로 알림톡 등을 발송할 계획에 있습니다. 앤드유저가 굳이 PWA로 모바일에 추가했을 때의 이점은 없어보이지만, 카카오톡 인앱 브라우저에서 PWA 다운로드를 하기 위해 다른 브라우저로의 접근해달라도 메시지 안내 등을 내보내면 좋겠다는 아이디어도 얻게 됐습니다.
