모바일 / 앱
하이브리드 웹앱(Hybrid Web App)
하이브리드 웹앱(Hybrid Web App)은 웹 기술로 만든 화면을 네이티브 앱 컨테이너 안에서 실행하는 앱 방식입니다.
쉬운 설명
웹 기술로 만든 화면을 네이티브 앱 컨테이너 안에서 실행하는 앱 방식.
배경과 쓰임까지 이해하기
조금 더 자세히
하이브리드 웹앱(Hybrid Web App)은 HTML, CSS, JavaScript로 만든 웹 화면을 모바일 앱 안에서 실행하는 방식입니다. 웹 코드를 iOS와 Android에서 함께 재사용하면서 카메라, 알림, 파일 같은 기기 기능을 연결할 수 있습니다.
다만 일반 브라우저와 WebView의 동작 차이, 권한, 뒤로 가기 등을 실제 기기에서 확인해야 합니다. 한마디로, 하이브리드 웹앱은 웹 화면과 네이티브 앱 껍데기를 결합한 앱입니다.
실제로는 이렇게 만나요
웹으로 만든 서비스 화면을 iOS와 Android 앱의 WebView에 넣고 로그인이나 푸시 알림 기능을 네이티브 코드와 연결할 수 있습니다.
- 이런 거 할 때 나와요 웹 코드를 여러 모바일 플랫폼에서 재사용하면서 카메라, 알림 같은 기기 기능을 앱 연결부를 통해 사용할 수 있습니다.
- 이렇게 생겼어요 하이브리드 웹앱(Hybrid Web App)은(는) WebView, Responsive Web, Frontend 같은 주변 개념과 함께 문서, 설정 화면, 오류 메시지에서 자주 보입니다.
- 나오는 화면 예시 모바일 / 앱 작업을 하다가 WebView, Responsive Web, Frontend를 확인하는 화면
헷갈리기 쉬운 점
브라우저에서는 잘 되던 기능도 웹뷰 버전, 권한, 뒤로 가기, 파일 업로드 방식에 따라 다르게 동작할 수 있습니다.
왜 알아두면 좋을까요?
웹 코드를 여러 모바일 플랫폼에서 재사용하면서 카메라, 알림 같은 기기 기능을 앱 연결부를 통해 사용할 수 있습니다.
Checklist
실제로 볼 때 확인할 것
- 01
지원할 OS와 웹뷰 버전을 정한다
- 02
네이티브 연결 기능을 문서화한다
- 03
실제 기기에서 뒤로 가기와 권한을 확인한다