머리말
이 책의 구성
베타테스터의 한마디
====================
첫째마당 프로그레시브 웹앱 시작하기
====================
[01] 헬로! 프로그레시브 웹앱
01-1 프로그레시브 웹앱이 뭐예요?
01-2 프로그레시브 웹앱을 대표하는 6가지 핵심 기술
01-3 비주얼 스튜디오 코드 설치하기
01-4 ‘안녕하세요’ 예제 만들기
[02] 모던 자바스크립트 꼭 필요한 것만 배우기
02-1 재활용할 수 있는 블록 함수
02-2 변수 선언
02-3 화살표 함수
02-4 모듈 내보내기와 가져오기
02-5 콜백 함수와 비동기 처리 방식
02-6 JSON과 Fetch API
02-7 Promise와 비동기 처리 방식
02-8 await 연산자와 async 비동기 함수
미션 코딩! 입력된 숫자의 범주 판별하기
[03] 순수 자바스크립트로 PWA 만들기
03-1 ‘안녕하세요! PWA by JS’ 구경하기
03-2 매니페스트 작성하기
03-3 메인 화면 작성하기
03-4 서비스 워커 만들고 실행하기
미션 코딩! 캐시 변경하고 서비스 워커 다시 등록하기
====================
둘째마당 프레임워크로 PWA 손쉽게 디자인하기
====================
[04] 뷰 기초 쌓기
04-1 뷰, 자바스크립트 프레임워크의 절대 강자
04-2 ‘안녕하세요!’ 예제 만들기
04-3 단방향 바인딩과 v-bind 디렉티브
04-4 양방향 바인딩과 v-model 디렉티브
04-5 조건 판단과 v-if, v-else 디렉티브
04-6 반복문과 v-for 디렉티브
04-7 이벤트 핸들러 실행과 v-on 디렉티브
미션 코딩! v-for 디렉티브로 고객 정보 출력하기
[05] 뷰 고급 기능 익히기
05-1 복잡한 로직과 computed 속성
05-2 이벤트 핸들러 로직과 methods 속성
05-3 컴포넌트로 HTML 엘리먼트 만들기
05-4 컴포넌트 속성 prop
프런트엔드 개발자는 물론 웹 디자이너도 쉽게 배운다!
프로그레시브 웹앱부터 하이브리드 앱 개발 및 배포까지 한번에!
웹 전문가들은 “앞으로 웹은 프로그레시브 웹앱이어야 한다”라고 말합니다. 즉, 네이티브 앱보다 편리하게 설치하고 푸시 알림이 가능하며, 기기의 자원을 활용할 수 있고 오프라인에서도 실행되는 프로그레시브 웹앱이야 말로 모바일 퍼스트 시대에 웹의 미래라고 말합니다. 프로그레시브 웹앱은 성능이나 사용자 경험, 발견성, 개발 효율 면에서 기존 웹뿐만 아니라 네이티브 앱을 만들던 개발자에게도 충분히 매력적입니다.
이 책에서는 프로그레시브 웹앱을 만들고 하이브리드 앱으로 배포하는 방법을 다룹니다. 모던 웹 기술의 핵심을 쉽게 풀어내서 HTML과 자바스크립트의 기본만 알아도 완성된 웹앱을 만들 수 있습니다. 따라서 프런트엔드 개발자뿐만 아니라 웹 디자이너도 웹앱 만들기에 도전할 수 있습니다. 특히 소스를 한 줄 한 줄 세세하게 설명하는 부분에서, 잊을만 하면 한 번 더 떠오르게 해주는 친절함에서 독자를 향한 저자의 진정성을 느낄 수 있습니다.
====================
기초부터 실무까지 6가지 앱을 만들어 보자!
====================
이 책에서는 앱을 개발하고 운용할 때 가장 많이 사용하는 기능을 엄선해 6가지 프로그레시브 웹앱 프로젝트에 담았습니다. 또한 파이어베이스를 활용해 호스팅, 실시간 데이터베이스, 회원 인증 관리, 이미지 업로드 등을 적용하는 방법도 소개합니다. 다음 주소에서 독자 여러분이 만들 프로그레시브 웹앱을 미리 확인해 보세요.
1. 사진 갤러리: https://pwa-gallery-pic.web.app/
2. To-Do 리스트: https://pwa-to-do.web.app/
3. 카메라 사진 갤러리: https://pwa-camera.web.app/
4. 이메일-구글 인증 로그인: https://pwa-auth-login.web.app/
5. 푸시 알림 서비스: https://pwa
