opengraph (1) 썸네일형 리스트형 Next.js에서 Open Graph 이미지 생성하기 Next.js에서 Open Graph 이미지를 다이나믹하게 생성하는 방법을 공부하면서 겪었던 시행착오와 해결 과정을 정리한 글입니다. 공식 문서를 따라 구현했지만 예상치 못한 문제가 있었고, 이를 디버깅하면서 알게 된 Edge Runtime의 특성과 동작 방식에 대해 정리해 두었습니다. 목표OG 이미지용 opengraph-image.tsx 하나로 동적 이미지 생성API로부터 받아온 데이터를 이미지로 표시커스텀 폰트와 배경 이미지 사용Edge 환경 대응 (환경변수 미사용) 폴더 구조 및 기본 세팅/public └─ open-bg.png └─ IropkeBatang.woff/app/epigrams/[id]/opengraph-image.tsx ImageResponseOpen Graph 이미지를 생성하는 데.. 이전 1 다음