Progressive Web Appliction
1. 오프라인 작동(캐시 이용)
2. 푸시메시지
3. 홈화면 추가 가능
이번 새로운 프로젝트를 웹기반으로 만들 것 같아서 지나가다 보았던 PWA를 적용하기로 마음 먹었다
구글 개발자에서 친절하게 예제를 만들어주었기에 차근 차근 따라가면 몇시간이면 충분히 만들 수 있다.
(https://developers.google.com/web/fundamentals/codelabs/your-first-pwapp/?hl=ko)
스크립트 언어여서....한 30%정도?..만 이해한것 같다...난 아무래도 java개발자인가보다
(서비스 워커와 프라미스도 반드시 알아야 한다 그래서 프린트해서 정독 하였지만 30%정도 이해하였다...아무래도 이해력이 딸리는 것 같다.)
크롬 웹서버를 통해서 처음에는 만들었는데 https 기반에서 작동한다고 해서 직접!! 가비아에서 도메인을 사버렸다... ㅠㅠ꺅
www.hamnya.com ....깃헙이랑 연동해서 쓰려는 데 아무래도 바로 바로 도메인이 적용되는 건 아니여서 기다릴까 하다가 그냥
회사에서 사용하는 https 서버에 올려버렸다!
그리고 드디어 휴대폰으로 확인해보았을땐 정말 신기했다ㅇㅏ아아ㅏ 오오오오오오오 ㄷㅐ박사건
아무래도 안드로이드여서 그런지 진짜 네이티브 앱처럼 사용된다.
일단 카카오톡을 통해서 해당 주소를 보내고, 다른 브라우저로 열었을 때, 아래 스샷의 첫번째 화면이 나타난다.
그리고 홈화면에 추가한 후에 들어가면 글쎄 진짜 네이티브 앱처럼 주소창도 없이!!! 세번째 사진처럼 저것만 나타난다 ....대박임...와우..
인트로도 추가된 채로............ 대단해....어플처럼 바탕화면이나 앱 보기에 Weather이라고 아이콘도 나타난다.
안드로이드에서는 진짜 앱으로 설치되어서 삭제하려면 앱 설치 삭제도 해야한다!! 대단해
처음 접해봐서 넘 재밌고 흥분되는데 사무실에 ㅇ ㅏ무도없어서 혼자서 즐거워하는 중 ㅎㅎ..
(어차피 아셔도 개발자는 나밖에 없으니까 나처럼 재밌어 하는 사람은 없을 거 같지만...........)
그래서 카톡으로 동일한 주소로 들어가서 다른 브라우저로 열기를 하면 weather에서 열건지, 크롬에서 열건지 선택도 되어서
weather로 클릭하면 계속해서 그 url은 weather앱으로 자동으로 열린다.
대단하다 대단해! ..만든 사람은 정말 천재같당
아래에 어떤 분께서 친절하게 정리해 놓으셔서 안드로이드에서, 아이폰에서는 어떤 기능이 가능한지 적혀있다. 다들 들어가서 박수쳐야함
https://medium.com/@firt/progressive-web-apps-on-ios-are-here-d00430dee3a7
사파리에서는 홈화면에 추가가 나오지 않아서 슬펐다...ㅠㅠ..개발해주세요 얼른....!!
이제 시작이라고 생각한다. 이번 프로젝트에서 PWA를 잘 이용할 수 있길 바란당쿄쿄쿄
+
엘지그램 노트북이 스레기통 업데이트하다가 고장나서 이제 맥으로만 살고 있다...
사진을 올리려면 플레쉬를 깔아야한대서 파일로 업로드 해봤는데 아무래도 잘 되는 듯?!!
잊어버린 티스토리를 찾아와야겠다.