모바일 브라우저 사용자 경험 향상을 위해

곽태욱·2026년 3월 27일

Capacitor

  • https://capacitorjs.com/
  • 웹 기번 서비스를 간단하게 모바일 앱으로 변환하는 라이브러리
  • Capacitor가 Android와 iOS의 네이티브 컨테이너 역할만 맡고, 실제 앱 콘텐츠는 웹 사이트 결과물을 직접 불러옴
  • 앱 프로젝트는 앱 식별자, 아이콘, 배포 설정 같은 플랫폼 고유 영역만 관리하면 됨
  • 웹만 개발하고 앱을 관리하고 싶지 않을 때 사용하면 좋음
    • 파일 시스템, 앱 푸시 알림, 딥링크 등 앱 고유 기능을 사용하고 싶다면 Flutter / React Native 가 더 좋음

AltStore

  • https://altstore.io/
  • iOS 기기에 App Store에 배포되지 않은 앱을 설치할 수 있게 도와주는 앱
    • App Store로 배포하려면 연 $99 유료 Apple 계정이 필요함
  • AltStore에 앱을 배포하려면 .ipa 파일과 AltStore 문법의 source.json 까지 생성해야 함

저데이터 모드

  • Network Information API의 saveData와 effectiveType을 사용
  • “저데이터 모드” 와 현재 네트워크 종류 (2G/3G/4G 등)를 알 수 있음

WebAuthn Signal API

  • https://developer.chrome.com/docs/identity/webauthn-signal-api?hl=ko
  • 웹 서비스의 패스키 상태와 패스키 제공자(예: 비밀번호 관리자)에 저장된 정보를 맞춰 주는 WebAuthn API
  • 서버가 패스키 제공자에게 "이 패스키는 더 이상 유효하지 않음", "이 계정에서 허용되는 패스키 목록은 이것임", "사용자 이름/표시 이름이 바뀜" 같은 신호를 보낼 수 있음
  • 서버에서는 삭제됐는데 비밀번호 관리자에는 남아 있는 패스키 때문에 로그인에 실패하는 문제를 줄이는 데 유용함
  • 사용자가 로그인했을 때, 패스키를 삭제했을 때, 사용자 이름이나 표시 이름을 변경했을 때 호출하면 좋음
profile
이유와 방법을 알려주는 메모장 겸 블로그 (Frontend, AI, 경제, 책)

0개의 댓글