> 처음 개발 시작했을 때 Jekyll(Ruby)로 블로그를 만들어서 GitHub Pages로 호스팅했었는데, 만들기만 하고 한참 방치해뒀던 기억이 납니다. > Next.js로 다시 만들어 보려고 해요. 3년 만에 새로 만드는 블로그 제작기... 이번엔 꾸준히 운영할 수 있을까요? # 블로그 템플릿 살펴보기 아래 `Next.js` 템플릿들을 참고했습니다. - Portfolio Starter Kit - Blog Starter Kit 블로그 템블릿에 적용된 기능 중, 이전에는 신경쓰지 못했던 부분들이 많더라구요. ## OpenGraph 이미지 OG 이미지는 소셜 미디어나 메신저에서 웹사이트 링크를 공유할 때, 미리보기에 활용되는 이미지입니다. 아래는 OG 이미지를 동적으로 생성하는 라우트 핸들러입니다. ```tsx import { ImageResponse } from "next/og"; import type { NextRequest } from "next/server"; export async function GET( _req: NextRequest, ctx: RouteContext<"/og/posts/[slug]">, ) { const { slug } = await ctx.params; return new ImageResponse(

...

, { width: 1200, height: 630, }, ); } ``` 이런 식으로 포스팅마다 동적으로 생성됩니다.

## JSON-LD 웹페이지의 데이터를 JSON 기반으로 구조화하여, 검색 엔진이 웹페이지의 콘텐츠를 더 잘 이해하도록 돕는 마크업 언어라고 합니다. JSON 기반이라 읽기 쉽고, 기존 메타 태그 방식보다 유지 보수가 쉬운 장점이 있습니다. 아래처럼 script 태그를 만들어서 넣으면 됩니다. 위치는 꼭 head 태그 안이 아니어도 상관없다고 하네요. ```tsx