[언그래머] 쉰여덟번째 아티클_PWA 진짜 쉽게 이해하기 feat. PWA 예시

안녕하세요!

김송아입니다.....

 

 

왜인데 주말에 잘먹고 잘 놀면

왜인데 돌아오는 평일은

익숙해지질 않는 걸까요..ㅎㅎㅎㅎㅎ😇

@월요일 아침새

 

 

늘 낯설고 어려운 평일의 시작처럼,

우리 프로그래밍 세계에는 낯설고 어려운 용어들이 아주 매시간 출몰하는 것 같습니다.

 

 

오늘은 그 중에서도

프로그레시브 웹 앱 (Progressive Web Apps)

줄여서,

 

 

에 대해 알아보려 합니다!

 

 

PWA는 쉽게 말해, 

웹 앱 장점 + 네이티브 앱 장점을
모~두 갖춘 어플리케이션

 

입니다.

 

 

 

웹 앱과 네이티브 앱의 각 장점이 대체 무엇이냐구요?

 

 

간단합니다!

 

네이티브 앱 즉, 전통적으로 설치해서 쓰는 앱의 장점은

 

✔️ 운영 체제와의 상호 작용! => 뛰어난 UX

✔️ 설치해서, 경우에 따라 오프라인으로 동작 가능!

cf. UX에 대한 아티클은 지난 아티클을 참고하세요!

[언그래머] 쉰일곱번째 아티클_난 진짜 UX 디자인의 의미를 제대로 알고 있는 걸까?

 

 

반면, 웹 브라우저로 들어가는 웹 앱의 장점은

 

✔️ 별도 설치를 하지 않고, 웹 사이트로 방문 가능 => 뛰어난 접근성! 

✔️ 브라우저만 있으면 장치, 운영체제를 구분하지 않음

✔️ 링크 공유 쉬움!

 

 

아래 표는 조금 있어 보이는 '플랫폼별 앱, 웹 앱, PWA 기능 및 도달 범위' 그래프 입니다.

그냥, 네이티브 앱과 웹 앱보다 좋다. 는 뜻입니다.

 

@web.dev

 

 

 

즉, PWA는 이 장점들을 ✨모두✨ 가지는 웹 앱을 말합니다.

- 검색 엔진을 통해 방문 가능!

- 링크 공유 가능!

- 설치도 가능 = 아이콘을 홈 화면에 추가! 

- 오프라인으로 동작 가능 : 이전 캐시 데이터를 활용하여!

- 푸시 알림도 가능!

 

 

겉으로는 네이티브 앱, 속으로는 웹 브라우저를 통해서 액세스할 수 있는 웹 인거죠!

 

 

다들 오해 하시는 건.. PWA가 특정 기술이 아니냐는 건데요,

 

PWA는 특정 기술이 아닙니다.

 

 

쉽게 말하면,

위와 같은 장점들을 갖도록! 웹 앱을 구축하는 하나의 철학인 것!!!!

 

 

 

애매~하죠?

과연 무엇이 PWA냐구요?

 

 

자.. 갑니다.

아래 그림에서 틀린 그림을 찾아보세요.

 

네이버 vs 네이버 @김송아폰

 

 

찾으셨나요..?

 

이게 바로. PWA입니다.

...

😇

 

 

 

마술쇼가 아니에요..ㅎ.ㅎ

자세히 살펴볼까요?

둘 중 하나는 네이티브 앱이고, 나머지 하나는 PWA입니다.

 

뭐가 네이티브 앱이게~요?

 

동작 그만, 밑장 빼기냐 @타짜

 

 

 

손목 날아가기 전에, 바로 알아보겠습니다 (비장)

 

 

 

아이콘을 꾹 눌렀을 때 (아이폰 기준)

통합 검색, 스마트 렌즈, 현장 결제 등과 같이

네이버 앱을 설치해야만 쓸 수 있는 기능들이 뜨죠?

 

네이버 앱 @김송아폰

 

네이버 네이티브 앱입니다. 

 

 

그럼 PWA는 어떻냐구요?

눌러보죠!

 

 

이건 마치 웹 페이지 @김송아폰

 

PWA입니다.

 

 

이제 확! 느껴지시나요? 🫢

 

 

 

PWA는 웹 브라우저로 네이버에 접속하여, 

[홈 화면에 추가] 기능을 통해 홈 화면에 추가한 

일종의 웹 어플리케이션인거죠🤩

 

@김송아폰

 

 

 

우리 엄마 아빠도 사용하시는 걸 보면 

(딸래미 언그래머 사이트를 홈 화면에 추가하셨더라구욬ㅋㅋㅋ 방문자수 2의 비밀)

 

PWA는 우수 사례가 많아지며, 점점 더 인기 많아진다는 추측💚

 

@web.dev

 

 

 

ps. 혹시 좀더 전문적인 용어로 설명을 읽어보고 싶은 분들은, 아래 링크를 들어가시면 된답니다😉

프로그레시브 웹 앱 소개 - 프로그레시브 웹 앱 | MDN

 

프로그레시브 웹 앱이란?  |  Articles  |  web.dev

 

 

PWA..!

굉장히 낯설고 어려운 단어 같았는데!

생각보다 친숙하고 쉬운 개념이었죠?

 

 

무엇이든 여러분들이 쉽게 이해할 수만 있다면 김송아는 달려오겠습니다💚

 

 

그럼 여러분들의 화요일도

좀 더 친숙하고 쉬운 날이길 바라며,

 

감사합니다😊

김송아 드림