목록pwa (3)

자유로이

PWA 시작하기 3편 - 데모띄우기

안녕하세요 자유로이 입니다. 오늘은 PWA를 시작하기에 앞서 예제를 띄우고 간단하게 코드를 알아보도록 하겠습니다. 먼저 쉽고 간단하게 로컬 웹 서버 구축하기위해 구글 크롬 확장프로그램을 설치해줍니다. chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb?hl=ko Web Server for Chrome A Web Server for Chrome, serves web pages from a local folder over the network, using HTTP. Runs offline. chrome.google.com 설치가 완료된 Web Server for Chrome 크롬확장프로그램을 실행 시켜..
IT/프로그래밍 2020. 10. 13. 16:02
PWA 시작하기 2편

1편에 이어 PWA를 이해하기 쉽게 요약하자면 PWA는 웹앱입니다. HTML + CSS가 페이지 레이아웃과 UI를 담당하고 PWA는 서비스워커를 통해 캐싱, 푸시 등 기술적인 기반만 제공합니다. 쉽게 크롬확장프로그램 같은 느낌이라고 생각하시면 편할꺼 같습니다. 모질라 디벨로퍼 페이지에서 PWA로 웹사이트를 설치가능하게하려면 필요한 요구사항을 알려주고 있습니다. 요구 사항 올바른 필드가 채워진 웹 매니페스트 보안 (HTTPS) 도메인에서 제공 할 웹 사이트 기기에서 앱을 나타내는 아이콘 서비스 노동자는 오프라인으로 작업에 응용 프로그램을 (이 현재 안드로이드 크롬 만 필요) 할 수 있도록 등록 그럼 첫번째로 필요한 Manifest 파일에대해 알아보겠습니다. 매니페스트는 화면 방향, 아이콘 배경 색깔 이름같..
IT/프로그래밍 2020. 9. 9. 11:20
PWA 시작하기 1편

안녕하세요 자유로이입니다. 오늘은 PWA에 대해서 간략한 소개를 알아보겠습니다. 다음편부터 예제를 통한 포스팅으로 좀더 쉽고 PWA에 대해 심층적으로 공부해보겠습니다. PWA는 Progressive Web App의 약자로, 웹과 앱의 장점을 결합한, 웹의 기능들과 모바일 앱의 기능을 활용한 웹 애플리케이션입니다. PWA는 데스크톱과 모바일용으로 네이티브 같은 앱을 개발할 수 있게 해주는 도구입니다. 애플리케이션의 기능을 높은 수준으로 유지하면서도 일반적인 웹사이트처럼 로딩됩니다. PWA 특징 재참여기능성 뛰어난 성능으로 사용자 참여를 개선하고, 사용자가 브라우저에 없을때 전송되는 시스템 알림(푸시알림)과 같은 기능을 통해서 재참여의 기능성을 높입니다. 공유가능성 모든 pwa들은 특정한 url 링크로 연결..
IT/프로그래밍 2020. 9. 3. 14:51
Prev 1 Next