페이지 1: 핵심 구성 요소: Web App Manifest

1. 핵심 구성 요소: Web App Manifest

Web App Manifest는 브라우저와 사용자에게 웹 앱이 장치에 설치되었을 때 어떻게 보이고 작동해야 하는지를 알려주는 JSON 파일입니다. PWA의 필수 구성 요소입니다.

1.1. Manifest 파일 연결

HTML 문서의 <head> 섹션에 Manifest 파일을 연결합니다.

<link rel="manifest" href="/manifest.json">

1.2. 필수 필드 구성 (manifest.json)

다음 필드들은 설치 가능한 PWA를 위해 반드시 포함되어야 합니다.

{
  "name": "나의 PWA 앱",
  "short_name": "PWA",
  "start_url": "/index.html",
  "display": "standalone",
  "background_color": "#ffffff",
  "theme_color": "#007bff",
  "icons": [
    {
      "src": "/images/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    }
  ]
}

주요 설정: "display": "standalone"은 앱이 브라우저 UI 없이 독립 실행형 앱처럼 보이게 합니다.