이제는 PWA다 웹 기술의 놀라운 발전에도 불구하고 많은 사람이 웹에서 불쾌감을 경험하고 있다. 무겁고, 버그투성이에 느리기까지 한 웹사이트가 너무 많다. 사람들이 모바일 앱을 선호하며 웹을 외면하게 된 이유다. 상황을 개선할 만한 해결책으로 PWA가 등장했다. PWA는 최고의 웹과 앱이 만나 느린 네트워크에서도 빠르게 로드되고, 관련 푸시 알림을 전송하며, 네이티브 앱과 같은 경험을 제공한다. 또 오프라인에서 작동하고, 누구라도 쉽게 접근할 수 있으며, 앱 스토어 없이도 배포하고 설치할 수 있다. 네트워크가 문제다 앨릭스 러셀은 PWA의 특징으로 크게 세 가지를 꼽는다. 첫째, ‘반응성(Fast)’이다. 사용자와의 상호작용에 빠르고 부드럽게 반응해야 한다. 둘째, ‘안정성(Reliable)’이다. 불안정한 네트워크 환경에서도 PWA는 안정적으로 작동해야 한다. 마지막으로 ‘체감성(Engaging)’이다. 마치 진짜 앱처럼 몰입감 있는 사용자 경험을 제공해야 한다. 구글은 여기에 융합성(Integrated)이라는 특징을 더해 PWA를 F.I.R.E.라는 말로 규정했다. 이 같은 특징을 가지는 PWA는 사용자에게 더 나은 사용자 경험을 제공할 뿐 아니라 네트워크 속도가 느린 지역에서도 비교적 쾌적한 웹 활용을 돕는다. 사용자 경험을 개선하라 우리 모두가 추구해야 하는 것은 PWA를 만드는 그 자체가 아니다. 사용자 경험을 개선하고 저마다의 비즈니스 목표를 달성하는 것이다. PWA를 초창기에 도입한 회사들은 적은 투자로 막대한 효용 가치를 얻었다. PWA는 누구나 빠르고 몰입감 있는 경험을 누릴 수 있는 새 시대를 열고 있다. 선도적인 회사들이 PWA를 가장 먼저 도입한 곳은 모바일 환경이었다. 현대를 사는 우리는 모바일과 불가분의 관계다. PWA는 누구라도, 어디에서든 실행할 수 있다. 웹 브라우저에서도, 모바일 홈 화면에서도 모두 실행된다. 네트워크가 느리거나 오프라인일 때도 구현된다. 이 책은 PWA를 설계하고 제작하려는 팀이 스스로 할 일이 무엇인지 판단하도록 도와줄 것이다. 또 디자이너, 프로덕트 매니저, 사업주가 PWA를 바로 이해하고 회사에 맞는 기능이 무엇이며, 사용자를 위해 어떤 환경을 제공할 것인지 함께 파악할 수 있도록 이끌어줄 것이다. ◆이 책에서 다루는 내용 -프로그레시브 웹 앱이란 무엇인가 -프로그레시브 웹 앱 도입 사례 -앱에 가까운 웹 만들기 -오프라인이란 무엇인가 -푸시 알림 기능 -자격 증명 관리 API, 결제 요청 API 같은 기타 기능 -점진적 향상을 위한 로드맵 -PWA로 나아가기

한국어판 출간에 앞서 추천의 글 서문 chapter 1 프로그레시브 웹 앱의 정의 chapter 2 프로그레시브 웹 앱의 사례 chapter 3 앱의 느낌 살리기 chapter 4 앱 설치와 앱 스토어 검색 chapter 5 오프라인 chapter 6 푸시 알림 chapter 7 프로그레시브 웹 앱 너머의 기능 chapter 8 점진적 로드맵 chapter 9 모두를 위한 웹 감사의 글 옮긴이의 글 참고 자료 참고 URL 찾아보기

추천의 글 프로그레시브 웹 앱은 기술이 아니라 사용자 경험에서 영감을 받아왔다. 이 책의 저자 제이슨 그릭스비는 UX 전환의 의미와 웹 브라우저가 이를 권장하는 이유를 가장 먼저 알아차린 사람 중 하나다. 그릭스비는 따분한 기술에 초점을 맞추기보다 모바일 우선주의를 기반으로 PWA를 채택할 경우에 비즈니스와 사용자에게 미치는 영향에 대해 안내한다. chapter 1 프로그레시브 웹 앱의 정의 오랫동안 웹 기술을 이용해 앱과 유사한 경험을 제공하는 서비스를 개발하기 위해 많은 사람이 노력해왔다. 2015년 앨릭스 러셀과 프랜시스 베리먼은 웹 브라우저에서 진화한 기능을 이용해 변혁적인 프로그레시브 웹 앱(PWA)을 만들었다. 브라우저 탭에서 빠져나와 스스로 앱으로서 기능하면서도 어디서든 실행할 수 있고 무엇이든 링크할 수 있는 웹의 장점을 살린 앱이다. chapter 2 프로그레시브 웹 앱의 사례 PWA가 무엇을 할 수 있는지, 어디에 사용되는지, 네이티브 앱과는 어떤 관련이 있는지 혼란스러워하고 이런 불확실성으로 인해 도입을 망설이는 회사가 많다. 또 PWA를 네이티브 앱의 대체제로 보는 관점 때문에 거부감을 보이는 사람도 있다. 그런 논쟁은 접어두고 먼저 고객을 생각해야 한다. 회사 사이트를 방문한 고객이 어떤 경험을 할 것인가에 초점을 맞춰야 한다. PWA는 많은 고객을 유인하고, 웹사이트의 보안을 개선하고, 더 많은 수익을 창출하고, 보다 안정적인 경험을 제공하고, 사용자에게 업데이트를 알려줌으로써 네이티브 앱의 보완재 기능을 한다. chapter 3 앱의 느낌 살리기 앱처럼 느껴진다는 것은 무슨 뜻일까? 네이티브 앱과 같은 모습으로 작동하고, 로딩이 빠르고, 전환 효과가 부드러우며, 전체화면을 제공하고, 깔끔한 마감과 개성을 갖추고 있다는 의미일 것이다. 웹사이트가 앱처럼 느껴지느냐는 문제는 웹사이트가 얼마나 훌륭한 경험을 제공하느냐는 문제에 비하면 중요하지 않다. PWA를 더 앱처럼 느껴지도록 하려면 우선 목표를 명확히 하고 앱이 추구하는 것을 잘 파악하는 것이 무엇보다 중요하다. chapter 4 앱 설치와 앱 스토어 검색 보통 우리는 앱 스토어에서 앱을 검색하고, 사용 승인을 얻어 설치하게 된다. 그렇다면 PWA를 설치한다는 것은 무슨 의미일까? PWA는 사용자가 다운로드하고 설치하지 않아도 사용할 수 있다. 사용자가 웹사이트에 처음 방문했을 때 서비스 워커가 조용히 설치될 뿐이다. 덕분에 PWA로는 무엇이든 할 수 있다. 오프라인 기능을 추가하거나 푸시 알림 권한을 요청할 수도 있다. 개발자는 사용자가 PWA를 좋게 평가하고 홈 화면에 설치해주길 바란다. 따라서 개발자는 사용자가 아이콘을 홈 화면에 설치할 수 있는 여러 가지 수단을 지원하도록 브라우저에 필요한 정보를 제공해야 한다. chapter 5 오프라인 서비스 워커는 자원을 캐시하는 도구다. 또 서비스 워커는 오프라인에서도 웹사이트를 이용할 수 있게 해준다. 서비스 워커를 이용하면 데이터를 오프라인에 저장해둘 수 있고, 네트워크 요청을 뜻대로 중계할 수 있다. 또 웹 앱을 어떤 네트워크 환경에서도 안정적으로 작동시킬 수 있다. 데이터를 오프라인에 저장하면 사용자가 중간에 떠나더라도 세션을 유지할 수 있다. chapter 6 푸시 알림 푸시 알림은 사용자가 세상 어디에 있든 가장 친숙한 기기를 통해 사용자와 맞닿을 수 있는 수단이다. 그러나 사용자가 납득할 만한 이유도 없이 마구 푸시 알림을 쏟아내는 웹사이트가 너무 많다. 푸시 알림은 올바르게 사용했을 때에만 사용자와 사업 모두에 이익이 될 수 있다. 푸시 알림을 이용하고 싶더라도 먼저 사용자에게 가치 있고 관련성 있는 정보를 제공하기 위한 계획과 체계를 갖춰야 한다.