728x90
반응형
SMALL

IT/Next.js 2

[Next.js] 카카오톡 썸네일 공유 기능 추가 - OG 메타 태그 설정방법

제미나이로 OG 이미지부터 만드는중...[Next.js] [Next.js] 카카오톡 썸네일 공유 기능 추가 - OG 메타 태그 설정방법웹사이트를 카카오톡/페이스북에 공유할 때 썸네일이 안 뜨는 문제를 OG 메타 태그로 5분 안에 해결합니다.📌 문제: 카카오톡 공유 시 썸네일 미표시Next.js 프로젝트를 배포했는데, 링크를 카카오톡에 붙여 넣어도 썸네일 이미지가 나오지 않습니다.❌ 예상: 썸네일 이미지 + 제목 + 설명✅ 현실: 텍스트만 표시됨원인: Open Graph(OG) 메타 태그 미설정🔧 해결방법1️⃣ 썸네일 이미지 준비크기: 1200x630px (카카오톡, 페이스북 표준)frontend/└── public/ └── og-image.png2️⃣ Next.js Metadata 설정파일: a..

IT/Next.js 2026.02.09

[Next.js] 별도 FE 서버 없이 기존 백엔드에 웹 붙이기

FE 서버 없이 Spring Boot 하나로 PC·모바일 웹까지 배포하기웹 서비스를 개발하면서 다음과 같은 요구사항이 있었다.PC 웹과 모바일 웹을 모두 지원하고 싶다FE용 서버를 별도로 운영하고 싶지 않다기존 Spring Boot 프로젝트 안에서 FE 수정까지 함께 배포하고 싶다배포 단위를 하나로 유지하고 싶다이 글에서는 Spring Boot 프로젝트 하나만 배포해도FE와 BE가 함께 반영되는 구조를 어떻게 만들었는지 정리한다.1. 전체 구조 요약이번 구조의 핵심은 단순하다.FE는 빌드 결과물만 사용하고실제 서비스는 Spring Boot가 담당한다구조는 다음과 같다.FE: Next.js (Static Export)BE: Spring Boot배포 단위: 하나의 Spring Boot 애플리케이션즉, 별도의..

IT/Next.js 2026.01.21
728x90
반응형
LIST