next.js metatag viewport, themeColor 속성
React
2025. 11. 26. 23:08
next.js에서 모바일 반응형을 위해 viewport를 지정하고, 페이지의 theme color 값을 meta tag에 지정해야 했다.expo를 사용하여 웹앱으로 wrap 하려고 할 때, viewport를 지정해서, 기기 별 화면 최적화되 너비 설정과 확대/축소 비율 1로 지정하고, 모바일 UI의 컬러를 페이지의 브랜드 컬러와 일치시키고자 했다. 이를 위해 Viewport 타입을 사용하여 설정 값을 export 했다. export const viewport: Viewport = { width: "device-width", initialScale: 1, maximumScale: 1, themeColor: "#E0AF81",};
