89f3a865af
설치 가능한 PWA 자격을 갖추는 최소 셋: - web/public/manifest.webmanifest: 한국어 name/short_name, 다크 테마 컬러, standalone display, /icon.svg (any maskable, sizes any) - web/public/icon.svg: 다크 배경 + 한국 컬러 캔들(상승=#ef4444 / 하락=#3b82f6) + 우상향 추세선. maskable safe-zone (중심 80%) 보존 - web/public/sw.js: install/activate 만 처리 (fetch handler 없음). install 자격만 충족하고 네트워크는 그대로 통과 → 캐시 stale 위험 0 - web/components/PwaRegister.tsx: production 빌드에서만 SW 등록, 실패는 silently 무시 - web/app/layout.tsx: Metadata.manifest/icons/appleWebApp, viewport.themeColor/colorScheme 분리 (Next 14 권장) dev (next dev) 에서는 SW 등록을 우회 — HMR 응답 간섭 회피.
44 lines
1.3 KiB
TypeScript
44 lines
1.3 KiB
TypeScript
import "./globals.css";
|
|
import type { Metadata, Viewport } from "next";
|
|
import { AlertsToaster } from "../components/AlertsToaster";
|
|
import { PwaRegister } from "../components/PwaRegister";
|
|
import { TopNav } from "../components/TopNav";
|
|
|
|
export const metadata: Metadata = {
|
|
title: {
|
|
default: "주식 차트 · 예측",
|
|
template: "%s · 주식 차트",
|
|
},
|
|
description: "한국 주식 차트와 단기 예측을 보는 개인용 앱.",
|
|
manifest: "/manifest.webmanifest",
|
|
// SVG 아이콘 하나로 다 처리. Chrome/Safari/iOS 모두 SVG favicon + apple-touch 수용.
|
|
icons: {
|
|
icon: [{ url: "/icon.svg", type: "image/svg+xml" }],
|
|
apple: [{ url: "/icon.svg", type: "image/svg+xml" }],
|
|
},
|
|
appleWebApp: {
|
|
capable: true,
|
|
statusBarStyle: "black-translucent",
|
|
title: "주식 차트",
|
|
},
|
|
};
|
|
|
|
// Next 14: themeColor / colorScheme 는 viewport 로 분리해야 빌드 경고가 안 뜸.
|
|
export const viewport: Viewport = {
|
|
themeColor: "#09090b",
|
|
colorScheme: "dark",
|
|
};
|
|
|
|
export default function RootLayout({ children }: { children: React.ReactNode }) {
|
|
return (
|
|
<html lang="ko">
|
|
<body className="min-h-screen">
|
|
<TopNav />
|
|
{children}
|
|
<AlertsToaster />
|
|
<PwaRegister />
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|