# Discourse를 PWA로 설치하기 쉽게 만들기
**URL:** https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034
**Category:** Feature
**Created:** [7월 17, 2020, 1:24오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034 "2020-07-17T13:24:54Z")
**Posts on this page:** 20
**Page:** 1
### Author:  [@JQ331](https://meta.discourse.org/u/JQ331)
#### Post date: [7월 17, 2020, 1:24오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/1 "2020-07-17T13:24:54Z")
Discourse 포럼(호스팅 플랜 사용 중)에서 PWA 기능을 설정하는 데 어려움을 겪고 있습니다. 이는 Discourse 자체보다는 Chrome 브라우저와 관련된 문제인 것 같지만, 혹시 이 부분에 대해 알고 계신 분이 있을까 해서 질문드립니다.
**1** Chrome에서 Discourse의 설치 설정이 이미 지정된 후에 해당 설정을 변경할 수 있는 방법이 있을까요?
PWA 앱(Discourse든 다른 앱이든)을 처음 열 때 Chrome에서 설치 여부를 묻는 메시지가 표시됩니다. 이때(의도적으로든 실수로든) 거절하면 설치 옵션이 사라집니다. 이 옵션을 다시 표시할 수 있는 방법이 있을까요?
마찬가지로, Discourse를 PWA로 데스크톱 홈 화면에 설치해 두었다가 아이콘을 삭제한 경우, 아이콘을 다시 설치하거나 복구하는 방법을 찾지 못하고 있습니다.
**2** Discourse 포럼에 사용자가 PWA로 설치할 수 있는 버튼(데스크톱 및 모바일 모두 지원)을 추가할 수 있는 방법이 있을까요? 이렇게 하면 사용자가 대부분의 경우 이해하지 못하는 수동 설치 과정을 거치지 않아도 됩니다.
---
### Author:  [@Mevo](https://meta.discourse.org/u/Mevo)
#### Post date: [7월 17, 2020, 2:07오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/2 "2020-07-17T14:07:02Z")
운영체제에 따라 다를 수 있지만, 저는 Linux(Ubuntu)를 사용 중이며, 정말 간단합니다. URL 바 오른쪽에 작은 “+” 기호가 있습니다(즐겨찾기 아이콘 바로 앞). 이 기호를 클릭하면 설치됩니다. 설치 후에는 “Discourse Meta에서 열기” 아이콘으로 바뀝니다. PWA를 삭제하면 다시 “+” 기호가 나타납니다.
또한, 여기서 메타를 서핑하면서 Chrome 메뉴를 열면 "Discourse Meta 설치"라는 항목이 표시됩니다. 설치 후에는 "Discourse Meta에서 열기"로 바뀌고, 삭제하면 다시 "설치…"로 돌아옵니다.
즉, URL 바에 아이콘 하나와 메뉴에 항목 하나입니다. 적어도 제 환경에서는 그렇습니다. 더 이상 뭘 더 요청할지 모르겠네요 😉 팝업 메시지에 의존할 필요는 전혀 없습니다.
---
### Author:  [@JQ331](https://meta.discourse.org/u/JQ331)
#### Post date: [7월 17, 2020, 2:20오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/3 "2020-07-17T14:20:09Z")
> [@Mevo](#):
>
> PWA를 삭제하면 다시 설치할 수 있도록 “+” 아이콘이 다시 나타납니다.
PWA를 어떻게 삭제하시나요? 제 경우를 말씀드리면, 메타(Meta)에서 크롬(맥에서)을 사용할 때 주소창에 “열기” 아이콘은 표시되지만, 실제 메타 아이콘은 어디에서도 찾을 수 없어서 삭제할 방법이 보이지 않습니다.
> [@Mevo](#):
>
> 여기서 메타를 서핑하는 동안 크롬 메뉴에 들어가면 “Discourse Meta 설치”라는 항목이 비슷하게 있습니다.
이 항목은 “크롬 메뉴”의 어디에 있나요?
* * *
핵심은 사용자의 홈 화면에 설치할 수 있도록 Discourse에 버튼을 두는 것이라고 생각합니다. 대부분의 사람들처럼 PWA가 무엇인지 모르는 사용자들을 대상으로 하고 있으며, “홈 화면에 설치”처럼 명확한 문구가 포함된 버튼을 클릭할 수 있도록 하고 싶습니다.
참고로, 제 지식 범위 내에서 맥에서는 Safari에 PWA 설치 옵션이 없습니다.
---
### Author:  [@Mevo](https://meta.discourse.org/u/Mevo)
#### Post date: [7월 17, 2020, 3:59오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/4 "2020-07-17T15:59:38Z")
> [@JQ331](#):
>
> PWA를 어떻게 제거하나요?
열어서 메뉴에서 "Uninstall Discourse Meta"를 선택하세요.
첫 단계: 실제로 PWA를 설치해야 합니다. “열기” 아이콘이 이 것과 전혀 관련이 없을 것 같은 느낌이 듭니다.
> [@JQ331](#):
>
> 이것은 "Chrome의 메뉴"에서 어디에 있나요?
실제로 메뉴가 얼마나 긴가요? 중간쯤에 있는 줄 중 하나입니다. 하위 섹션이 아니라 메인 메뉴에 바로 있습니다(적어도 Ubuntu의 Chrome에서는 그렇습니다). 현재 스크린샷을 제공하기가 조금 어렵네요.
> [@JQ331](#):
>
> 사용자가 클릭할 수 있는, 내용이 명확한 버튼이 필요합니다
Mac 사용자들 😂
---
### Author:  [@JQ331](https://meta.discourse.org/u/JQ331)
#### Post date: [7월 17, 2020, 4:41오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/5 "2020-07-17T16:41:16Z")
제가 Mac의 Chrome에서 보는 것과 완전히 다른 것을 설명하고 계신 것 같습니다.
Discourse에 PWA로 설치할 수 있는 버튼을 추가하는 방법이 있을까요? 프론트엔드에 HTML과 JavaScript 코드를 추가해서 가능할 것 같다는 확신이 듭니다. 이전에 누군가가 이를 시도해본 적이 있는지 확인해 보겠습니다.
---
### Author:  [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [7월 17, 2020, 4:57오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/6 "2020-07-17T16:57:01Z")
제 맥에서 크롬을 실행 중인 모습입니다. PWA 메뉴는 오른쪽 상단에 있습니다:
> [@JQ331](#):
>
> Discourse에 PWA로 설치할 수 있는 버튼을 추가하는 방법이 있을까요? 프론트엔드에 HTML과 JavaScript 코드를 추가하여 이를 구현할 수 있을 것으로 확신합니다. 이전에 누군가 이를 해본 적이 있는지 확인해 보고 있습니다.
[How to provide your own in-app install experience | web.dev](https://web.dev/customize-install/) 링크를 찾았습니다. Theme Component를 구축해 볼 수 있을까요?
Meta에는 PWA에 관한 매우 유용한 주제들이 여러 개 있습니다. 그곳에서 더 많은 정보를 얻을 수 있을지도 모릅니다 …
---
### Author:  [@JQ331](https://meta.discourse.org/u/JQ331)
#### Post date: [7월 17, 2020, 5:01오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/7 "2020-07-17T17:01:18Z")
> [@merefield](#):
>
> PWA에서 메뉴는 오른쪽 상단에 있습니다.
아—그 옵션을 보려면 앱이 이미 PWA 모드로 열려 있어야 한다는 점이 핵심입니다(일반 URL 모드로 열면 해당 옵션이 표시되지 않음). 제 포럼에서는 PWA로 설치하는 버튼이 완전히 사라진 것 같습니다(예전에는 있었는데…)
> [@merefield](#):
>
> 메타에 매우 유용한 PWA 관련 주제들이 몇 개 있습니다. 거기서 더 많은 정보를 얻을 수 있을지도 모릅니다.
사용자가 앱을 PWA로 설치할 수 있도록 버튼을 만드는 것이 아마도 새로운 테마가 필요할 것 같다는 점은 이해합니다. 제 질문은 사람들이 이전에 그걸 시도해 본 적이 있는지 하는 것입니다. 메타에서 해당 주제에 대해 구체적으로 다루는 내용을 찾지 못했지만, 제가 놓친 것일 수도 있습니다.
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [7월 17, 2020, 5:52오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/8 "2020-07-17T17:52:56Z")
아마 @falco 님이 이에 대해 의견을 갖고 계실 수도 있지만, 제 생각에는 이 문제는 대부분 브라우저 개발자들에게 달려 있다고 봅니다.
우리는 Discourse에서 좋은 PWA 시민이 되기 위해 모든 요구사항을 충족하려고 매우 노력하고 있으며, PWA 개념을 깊이 믿고 있기 때문에 최신 PWA 표준을 항상 주시하고 있습니다.
---
### Author:  [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [7월 17, 2020, 7:07오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/9 "2020-07-17T19:07:08Z")
> [@JQ331](#):
>
> 설정이 이미 지정된 후에도 Chrome에서 Discourse의 설치 설정을 변경할 수 있는 방법이 있나요?
“설치 설정”(install setting)이란 무엇인가요?
> [@JQ331](#):
>
> Discourse 포럼에 버튼을 추가하여 사용자가 PWA로 설치할 수 있도록(데스크톱과 모바일 모두) 할 수 있는 방법이 있나요? 이렇게 하면 사용자가 대부분 이해하지 못하는 수동 설치 과정을 거칠 필요가 없습니다.
Discourse는 기본적으로 이 기능을 제공합니다. 사용자가 Chrome의 두 가지 기준을 충족하고 TL1 이상인 경우 작동합니다.
[ ](https://global.discourse-cdn.com/meta/original/3X/1/c/1cf913d9e9e6351dcf2b35d05d0c642b0dd7c1d2.png)
이것은 데스크톱에서는 다소 번거로울 수 있으므로 모바일에서만 작동하도록 조정되어 있습니다. 적어도 Chrome이 데스크톱용 PWA 탭 모드를 출시할 때까지는 그렇습니다.
---
### Author:  [@JQ331](https://meta.discourse.org/u/JQ331)
#### Post date: [7월 17, 2020, 9:53오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/10 "2020-07-17T21:53:02Z")
> [@Falco](#):
>
> 이것은 데스크톱에서는 약간 번거로울 수 있으므로 모바일에서만 작동하도록 조정되었습니다. 적어도 Chrome이 데스크톱용 PWA 탭 모드를 출시하기 전까지는 그렇습니다.
아, 여러분이 이미 이 부분에 대해 마법을 부린 줄 알았어요 🙂
이 설정이 "iOS 기기의 일반 사용자(신뢰 수준 1 이상)에게 DiscourseHub 앱 배너를 표시합니다"라고 적혀 있는 설정인가요?
그리고 (데스크톱에서 기본적으로 작동하도록 설정하지 않은 이유는 이해합니다만)–이것이 데스크톱에서도 나타나도록 할 방법이 있을까요? 아마 플러그인에 필요한 코드가 있을 수도 있겠네요.
> [@Falco](#):
>
> "설치 설정"이란 무엇인가요?
저는 그냥 설치할 수 있고, 나중에 다시 제거할 수 있기를 원한다는 뜻이었어요. 토론 초반에서 명확히 드러난 것을 제가 놓쳤는데, 이 기능이 옵션으로 존재하지만 PWA 모드로 앱을 열었을 때만 볼 수 있다는 것이었습니다.
---
### Author:  [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [7월 17, 2020, 9:56오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/11 "2020-07-17T21:56:11Z")
> [@JQ331](#):
>
> 이 설정이 "iOS 기기에 일반 사용자(신뢰 수준 1 이상)에게 DiscourseHub 앱 배너 표시"라고 적혀 있는 설정인가요?
아니요. DiscourseHub는 Google Play와 Apple App Store에 등록된 우리 앱입니다.
> [@JQ331](#):
>
> 저는 단순히 설치하고 나중에 제거할 수 있기를 원했던 것입니다. 토론 초반에 명확히 드러났던 것을 제가 놓쳤는데, 이 기능을 위한 옵션은 있지만 PWA 모드로 앱을 열어야만 볼 수 있다는 점이었습니다.
그것은 완전히 브라우저의 제어 하에 있으므로, 제거가 어떻게 작동하는지에 대해서는 우리가 할 수 있는 것이 없습니다.
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [7월 17, 2020, 11:03오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/12 "2020-07-17T23:03:50Z")
최소한 내 Chromebook에서는 PWA가 아주 잘 작동하는 걸 확인했습니다! Meta와 내부 Discourse 모두 PWA로 설정해 두었습니다. 💪
---
### Author:  [@ClawdiaWolf](https://meta.discourse.org/u/ClawdiaWolf)
#### Post date: [7월 18, 2020, 3:38오전 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/13 "2020-07-18T03:38:31Z")
> [@JQ331](#):
>
> PWA를 어떻게 삭제하나요? 제 경우를 말씀드리자면, 메타(Meta)의 경우 Mac에서 Chrome 주소 표시줄에 “열기” 아이콘은 보이지만, 실제 메타 아이콘은 어디에도 찾을 수 없어 삭제할 방법을 찾지 못하고 있습니다.
PWA를 런치패드(Launchpad)에서 실행하거나 `~/Applications/Chrome Apps` 폴더의 아이콘을 더블클릭하여 실행해야 메뉴에 삭제 옵션이 표시됩니다.
PWA가 아닌 일반 Chrome 창으로 실행된다면, Chrome Apps 폴더의 아이콘을 삭제하면 됩니다. 이 두 방법의 유일한 차이는 전자(런치패드/아이콘 더블클릭)는 Chrome에서 사이트 데이터를 정리할지 묻지만, 후자(폴더에서 아이콘 삭제)는 묻지 않는다는 점입니다. 🙂
---
### Author:  [@JQ331](https://meta.discourse.org/u/JQ331)
#### Post date: [7월 18, 2020, 2:23오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/14 "2020-07-18T14:23:27Z")
> [@ClawdiaWolf](#):
>
> `~/Applications/Chrome Apps`의 아이콘을 더블클릭하면 메뉴에 삭제 옵션이 표시됩니다.
알겠습니다. 그 세부 사항을 알려주셔서 감사합니다.
> [@Falco](#):
>
> 아니요. DiscourseHub는 Google Play와 Apple App Store에 등록된 우리의 앱입니다.
그렇다면 대시보드에서 이를 제어하는 설정이 있는 건가요? 찾지 못하고 있습니다.
모바일처럼 데스크톱용 discourse에서도 “설치” 프롬프트가 나타나도록 할 방법이 있을까요?
* * *
참고로, Discourse가 PWA를 지원하는 것은 정말 멋진 일입니다. PWA는 개발자에게 큰 도움이 되고, 오픈 웹을 발전시키며, 그 외에도 수많은 장점이 있습니다.
---
### Author:  [@John\_Lehmann](https://meta.discourse.org/u/John_Lehmann)
#### Post date: [2월 23, 2021, 7:46오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/16 "2021-02-23T19:46:44Z")
PWA를 다시 설치하는 방법도 모르겠고, 메뉴나 설정에서 이 프롬프트와 동일한 기능을 수행할 수 있는 옵션이 있으면 좋겠습니다:
다시 그 화면에 어떻게 도달할 수 있나요? 현재 안드로이드/크롬에서는 앱을 설치할 방법을 찾을 수 없습니다. 크롬을 통해 홈 화면에 추가하는 것만이 가능한데, 이것이 같은 것인가요?
내 사이트 아이콘 위에 크롬 아이콘이 겹쳐 보여서 같은 것 같지는 않습니다. 하지만 알림은 받는 것 같습니다.
---
### Author:  [@riking](https://meta.discourse.org/u/riking)
#### Post date: [2월 23, 2021, 8:00오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/17 "2021-02-23T20:00:10Z")
현재 Chrome Beta Android에서 Meta에 접속하면 다음과 같은 화면이 표시됩니다: (“앱 설치”)
현재 Chrome Stable Desktop에서 Meta에 접속하면 다음과 같은 화면이 표시됩니다:
---
### Author:  [@John\_Lehmann](https://meta.discourse.org/u/John_Lehmann)
#### Post date: [2월 23, 2021, 9:03오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/18 "2021-02-23T21:03:48Z")
@riking 감사합니다. 하지만 제 경우 크롬에서는 ‘홈 화면에 설치’ 옵션만 있습니다. 그 대화상자/프롬프트를 다시 보고 싶지만 방법을 모르겠습니다.
업데이트: 말씀하신 대로 맞습니다. 메타를 제거한 후에도 크롬 메뉴에 “앱 설치” 옵션이 있습니다.
제 디스코urs 사이트인 community.morphmarket.com에서는 왜 그렇지 않을까요? SSO를 사용하지만, 그 외 특별한 점은 생각나지 않습니다. 아니면 제 Pixel 3 기기가 이제 어떤 특별한 "상태"에 있는 걸까요?
말씀드린 것처럼, 앱이 설치된 것처럼 보입니다. 전체 화면으로 표시되니까요. 하지만 "앱 설치"가 아니라 "홈 화면에 추가"를 통해 그렇게 된 것입니다.
---
### Author:  [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [2월 23, 2021, 9:33오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/19 "2021-02-23T21:33:52Z")
> [@John\_Lehmann](#):
>
> 제 디스코urs 사이트인 [community.morphmarket.com](http://community.morphmarket.com)에서는 왜 그런 경우가 아닌가요?
사이트 로고에 JPG 파일을 사용하고 있기 때문입니다. 사이트 설정으로 이동하여 `manifest icon`에 PNG 파일을 업로드하세요.
---
### Author:  [@John\_Lehmann](https://meta.discourse.org/u/John_Lehmann)
#### Post date: [2월 23, 2021, 10:18오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/20 "2021-02-23T22:18:49Z")
@Falco, 와, 그건 정말 예상하지 못했어요. 이미지를 PNG로 변환하고 해당 아이콘 하나만 업데이트했는데, PWA와 관련하여 아직 효과가 보이지 않아요. 사이트나 휴대폰에서 지워야 하는 캐시가 있을까요?
---
### Author:  [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [2월 23, 2021, 10:33오후 UTC](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034/21 "2021-02-23T22:33:40Z")
로고를 PNG로 변환해서 최신 버전이 실행 중인 내 테스트 사이트에 업로드했는데, 문제없이 잘 동작합니다. 하지만 귀사 사이트에서는 여전히 웹 매니페스트에 JPG가 표시되고 있습니다.
`png to jpg quality` 사이트 설정의 기본값을 조정하셨나요?
[다음 페이지](https://meta.discourse.org/t/making-it-easier-to-install-discourse-as-a-pwa/158034.md?page=2)