자주 사용하는 웹사이트를 매번 브라우저에서 검색하거나 주소를 입력해 열고 계신가요?
PWA로 만들어진 웹사이트는 스마트폰 홈 화면에 추가해 일반 앱처럼 실행할 수 있습니다.
별도의 설치 파일을 내려받거나 앱스토어에서 검색할 필요도 없습니다.
이번 글에서는 안드로이드와 아이폰에서 웹사이트를 홈 화면에 설치하는 방법을 소개합니다.
처음 설치하는 분도 아래 영상과 순서를 따라 하면 어렵지 않게 완료할 수 있습니다.
PWA란 무엇인가요?
PWA는 Progressive Web App의 약자입니다.
이름만 보면 어렵게 느껴질 수 있지만, 쉽게 말하면 홈 화면에 설치해 앱처럼 사용할 수 있도록 만든 웹사이트입니다.
설치를 완료하면 스마트폰 홈 화면에 아이콘이 만들어집니다.
이후에는 브라우저를 먼저 열지 않고 이 아이콘을 눌러 바로 실행할 수 있습니다.
PWA마다 지원 기능은 다르지만 다음과 같은 장점이 있습니다.
- 앱스토어에서 검색할 필요가 없습니다.
- 별도의 설치 파일을 받을 필요가 없습니다.
- 홈 화면의 아이콘으로 빠르게 실행할 수 있습니다.
- 웹사이트가 업데이트되면 최신 버전을 사용할 수 있습니다.
설치하기 전에 확인할 것
사용하는 스마트폰에 따라 권장 브라우저가 다릅니다.
- 안드로이드: Chrome 또는 Samsung Internet
- 아이폰: Safari
아이폰에서 Chrome으로 웹사이트를 열었다면 주소를 Safari에서 다시 여는 것이 좋습니다.
화면에 표시되는 메뉴 이름과 위치는 스마트폰 기종, 운영체제와 브라우저 버전에 따라 조금씩 다를 수 있습니다.
안드로이드 Chrome에서 설치하는 방법
- Chrome에서 설치할 웹사이트를 엽니다.
- 주소 표시줄 오른쪽의
⋮버튼을 누릅니다. - 메뉴를 내린 뒤
설치 및 바로가기 만들기를 누릅니다. 설치를 선택합니다.- 앱 이름을 확인하고 다시
설치를 누릅니다.
설치가 끝나면 홈 화면에 앱 아이콘이 표시됩니다.
Chrome 버전에 따라 메뉴가 앱 설치 또는 홈 화면에 추가로 표시될 수도 있습니다.
Samsung Internet을 사용하는 경우
- Samsung Internet에서 웹사이트를 엽니다.
- 화면 아래쪽의
☰메뉴를 누릅니다. 현재 페이지 추가를 누릅니다.홈 화면을 선택합니다.- 이름을 확인하고
추가를 누릅니다.
자세한 화면별 안내는 Android 설치 도움말에서 확인할 수 있습니다.
아이폰 Safari에서 설치하는 방법
- Safari에서 설치할 웹사이트를 엽니다.
- 화면 아래쪽의
…를 누른 뒤공유를 선택합니다. - 공유 화면에서
더 보기를 누릅니다. 홈 화면에 추가를 선택합니다.- 표시할 이름을 확인하고
추가를 누릅니다.
Safari 버전에 따라 화면 아래쪽에 공유 버튼이 바로 표시될 수 있습니다.
이 경우 공유 버튼을 누른 뒤 홈 화면에 추가를 선택하면 됩니다.
홈 화면에 추가가 보이지 않는다면 공유 화면의 목록을 끝까지 내린 후 동작 편집에서 해당 항목을 추가해 보세요.
자세한 화면별 안내는 iPhone Safari 설치 도움말에서 확인할 수 있습니다.
cart 장보기앱으로 직접 따라 해보세요
설치 과정을 직접 연습할 수 있도록 WizardOfCode에서 만든 cart 장보기앱을 이용해 보세요.
cart 장보기앱은 장을 보면서 입력한 상품의 결제 총액을 계산하고, 쿠폰이나 할인 행사의 실적에 포함되는 금액과 제외되는 금액을 나누어 확인할 수 있는 웹앱입니다.
회원가입이나 로그인 없이 바로 사용할 수 있으며 다음과 같은 기능을 제공합니다.
- 식료품·주류·소모품·할인 등 분류별 항목 관리
- 결제 총액과 실적 포함·제외 금액 확인
- 상품 금액과 계산식을 바로 입력할 수 있는 숫자판
× 2,× 3,− 10%빠른 계산- 여러 장부와 분류 구성 관리
- 데이터 백업 및 복원
- 한 번 연 뒤 사용할 수 있는 오프라인 실행
설치뿐 아니라 입력, 할인, 장부, 분류와 백업 방법까지 확인하려면 cart 장보기앱 도움말을 이용하세요.
저장한 데이터는 어디에 보관되나요?
cart 장보기앱의 장부, 항목, 분류와 설정은 현재 기기의 브라우저 저장 공간에 보관됩니다.
서버 계정에 장보기 내역의 사본을 저장하지 않으며 다른 기기와 자동으로 동기화되지 않습니다.
브라우저 데이터 삭제, 기기 변경 또는 앱 삭제에 대비해 중요한 장부는 장보기를 마친 뒤 백업 파일로 저장하는 것이 좋습니다.
브라우저와 홈 화면에 설치한 앱의 저장 공간이 기종에 따라 다르게 관리될 수도 있으므로, 설치 방식이나 브라우저를 변경하기 전에도 먼저 백업해 주세요.
자주 묻는 질문
앱스토어에서 설치해야 하나요?
아니요.
PWA는 해당 웹사이트를 지원되는 브라우저에서 연 뒤 홈 화면에 추가합니다.
설치 파일을 다운로드해야 하나요?
별도의 APK나 설치 파일을 받을 필요가 없습니다.
설치 메뉴가 보이지 않습니다
안드로이드 Chrome에서는 앱 설치 또는 홈 화면에 추가를 찾아보세요.
Samsung Internet에서는 현재 페이지 추가 안의 홈 화면을 선택합니다.
아이폰에서는 Safari를 사용하고 있는지 확인한 뒤 공유 화면의 목록을 끝까지 내려보세요.
그래도 보이지 않으면 브라우저와 운영체제를 최신 버전으로 업데이트한 후 다시 확인해 보세요.
설치하면 인터넷 없이도 사용할 수 있나요?
cart 장보기앱은 인터넷에 연결된 상태에서 한 번 연 뒤에는 오프라인으로 열 수 있습니다.
처음 실행하거나 새 버전을 받을 때는 인터넷 연결이 필요합니다.
삭제한 데이터는 복구할 수 있나요?
앱 화면에서 삭제한 항목이나 장부는 바로 되돌릴 수 없습니다.
삭제 전에 저장한 백업 파일이 있다면 해당 시점의 데이터로 복원할 수 있습니다.
마무리
PWA 설치 방법은 생각보다 간단합니다.
- 권장 브라우저로 웹사이트를 엽니다.
- 브라우저 메뉴에서
홈 화면에 추가또는설치를 선택합니다. - 홈 화면에 만들어진 아이콘으로 실행합니다.
아래 cart 장보기앱으로 직접 설치 과정을 따라 해보세요.
설치나 사용 중 문제가 생겼다면 cart 장보기앱 도움말에서 기종별 설치 방법과 문제 해결 안내를 확인할 수 있습니다.