# pwa

44개의 포스트
post-thumbnail

Service worker를 간단하게 사용해자

저번 면접을 통해 PWA의 존재에 대해 알게 되었었다.PWA를 간단하게 말해보자면, PWA는 앱과 웹의 장점들만 합친걸로 html,css,js등을 클라이언트 캐시에 저장해둬 앱처럼 사용할 수 있도록 하는 것이다.PWA의 장점은 정말 앱처럼 사용할 수 있다. Twitte

2022년 3월 22일
·
0개의 댓글
post-thumbnail

PWA? 프로그레시브 웹앱?

모바일 앱과 같은 경험을 주는 웹 앱앱 아이콘, 오프라인, 모바일 푸시, 보안(Https) 등의 기능을 제공네이티브 앱과 달리 HTML,JAVASCRIPT, CSS를 이용하여 구현반응형(Responsive) : 데스크탑, 모바일, 테블릿등 여러 기기에서 동일한 사용자

2022년 3월 11일
·
0개의 댓글
post-thumbnail

PWA에 대해 알아보자

본격 개발 전 알아보는 PWA!

2022년 2월 2일
·
0개의 댓글

pwa

pwa ( Progressive Web Apps) : 모바일 사이트에서 네이티브 앱과 같은 사용자 경험을 제공하는 기술 , 웹과 앱 모두 장점을 결합한 제품 pwa에서 구현 할 수 있는 기능 푸시 알림 아이콘을 홈 화면에 추가 설치 불필요 , 네이티브 앱과 같은

2021년 12월 22일
·
0개의 댓글

[PWA] PWA의 개념 & 실행해보기

기존에 있는 Spring boot 기반의 웹 사이트를 가지고 간단하게 PWA를 만들어보려고 한다. 1. ngrok 설치하기 ngrok 다운로드하기 ngrok 사이트는 여기에서 확인할 수 있다. ngrok 압축풀기 (개발자를 확인할 수 없기 때문에 앱을

2021년 11월 15일
·
0개의 댓글

SEO와 PWA에 대해 알아보자 !

정의 : 검색 엔진으로부터 웹 사이트나 웹 페이지에 대한 웹사이트 트래픽의 품질과 양을 개선하는 과정웹 페이지 검색엔진이 자료를 수집하고 순위를 매기는 방식에 맞게 웹 페이지를 구성해서 검색 결과의 상위에 나올 수 있게 한다.웹 페이지와 관련된 검색어로 검색한 검색 결

2021년 11월 5일
·
0개의 댓글
post-thumbnail

React 기초

정보 출처 https://www.youtube.com/watch?v=nahwuaXmgt8&list=PLfLgtT94nNq1e6tr4sm2eH6ZZC2jcqGOy&index=2 기초 명령어 npx create-react-app 프로젝트 이름 폴더 구조 node_

2021년 11월 4일
·
0개의 댓글

[프로젝트 배경]

웹으로만 구현된 프로젝트에 대한 사용자의 접근성을 높이기 위한 방법을 요청받았다.모바일 앱이 푸시 노티 가능, 장소에 구애 받지 않는다는 점에서 사용자의 접근성을 극대화할 수 있다고 판단했고, 이에 대한 리서치를 시작했다.먼저, 웹프론트엔드 개발자이기 때문에 앱개발에

2021년 10월 14일
·
0개의 댓글

CSR / SSR, SPA/MPA, PWA 에 대하여

CSR / SSR, SPA/MPA, PWA

2021년 10월 11일
·
0개의 댓글
post-thumbnail

PWA(Progressive Web Apps)

요즘 웹의 필수 요구사항이라 언급되는 PWA(Progressive Web Apps)이다. 최근 웹 만큼이나 앱(모바일)의 사용이 크게 증가함으로써 이를 위해 사용되고 있는 기술인 만큼 웹 개발에서 큰 비중을 차지하고 있다.

2021년 9월 27일
·
0개의 댓글

PWA

페이지가 업데이트 될때마다 이전 캐시스토리지를 초기화 해줘야되는 문제들이 발생.이렇게 index.html파일에서 실행을 시키고 worker.js파일을 구현. 그래서 캐싱할 파일을 지정하고 오프라인일때 나오는 페이지도 캐싱목록에 넣어서 지정했다.이렇게 캐시스토리지네임을

2021년 9월 4일
·
0개의 댓글

실전 프로젝트 - 8

pwa, service-worker, redux-persist, sentry 적용

2021년 8월 31일
·
0개의 댓글

Service Worker

브라우저가 백그라운드에서 실행하는 스크립트.웹 페이지와는 별개로 동작한다.페이지나 사용자 상호작용이 필요없는 기능에 대한 문호 개방(푸쉬 알림, 백그라운드 동기화 등)PWA를 만들 때 주로 사용된다.해당 api가 오프라인 환경을 완벽하게 통제할 수 있는 권한을 개발자에

2021년 8월 24일
·
0개의 댓글
post-thumbnail

PWA

pwa (progressive web application)의 줄임말이다. PWA는 웹이지만 네이티브 앱(모바일 앱)와 같은 역할을 할 수 있다. 네이티브 앱을 개발하는 속도보다 PWA의 개발 속도가 더 빠르다. 또한 푸쉬 알림, 오프라인 시에도 지원하기 때문에 네이티

2021년 8월 23일
·
0개의 댓글
post-thumbnail

웹 개발 방식(SPA,MPA,SSR,CSR)

웹 개발 방식은 여러가지 방법이 있겠지만, 그 중에서도 모던 웹 개발방식이라 불리는 PWA, SPA 와 전통적인(?) 방식의 MPA를 공부한 글HTML,CSS , JavaScript 같은 웹 기술로 만드는 앱이다.실제 앱은 아니지만 웹에서 사용자로 하여금 앱처럼 느낄

2021년 8월 11일
·
0개의 댓글

PWA를 배워보자!

개발 유튜버 '드림코딩 by 엘리' 님의 영상, 'PWA (Progressive Web App) 개념과 따라만들기' 을 보고 PWA가 무엇인지, 그리고 어떻게 간단한 PWA를 만들 수 있는지 알아보았다.

2021년 8월 6일
·
0개의 댓글
post-thumbnail

filter 함수로 minishop 구현하기 (2)

1. 코드 수정 1. 이벤트 위임을 사용하여 수정 2. 중복을 없애기 위해 변수 생성, 버튼이 아닌 빈 곳을 눌렀을 때 취해야 할 조건 추가, onClick 함수 따로 생성 2. 학습 내용 (1) 이벤트 위임 부모 컨테이너는 자식 요소에서 이벤트가 발생하면 모두

2021년 8월 2일
·
0개의 댓글
post-thumbnail

PWA 만들기

모바일과 데스크탑에서 동작하는 웹앱을 만들어 보자

2021년 8월 1일
·
0개의 댓글
post-thumbnail

PWA를 이용하면 모바일앱인척 만들기

PWA(Progressive Web App)웹사이트를 모바일 앱으로 발행해서 그냥 쓰자는겁니다1\. 스마트폰, 태블릿 바탕화면에 여러분 웹사이트를 설치 가능합니다.(저거 설치된 앱 누르면 상단 URL바가 제거된 크롬 브라우저가 뜹니다. 일반 사용자는 앱이랑 구분을 못함

2021년 6월 18일
·
0개의 댓글

Vue.js PWA manifest.json 파일 존재하지 않거나 인식하지 않을 때

@vue/cli 4.5.13@node -v v12.16.1npm -v 6.13.4위와 같이 프로젝트를 생성하면서 메뉴얼을 선택하는 구간에 pwa를 선택했으나, manifest.json파일이 생성되어있지 않았다.잘못 프로젝트 개설한건가 싶었는데,build를 하고 난 di

2021년 6월 16일
·
0개의 댓글