살린 · AI Talker · 2025.01 ~ 2025.08
고객사별 정보는 서버가 메타데이터로 내보낸다
React CSR 서비스의 Next.js 15 SSR 전환
고객사별 챗봇 사용자 서비스를 Next.js 15 SSR로 전환했습니다.
- 문제
- CSR 구조에서는 검색 엔진과 링크 미리보기에 고객사별 정보를 안정적으로 전달하기 어렵고, 신규 고객사마다 코드를 고쳐야 했습니다.
- 결정
- 고객사 코드로 조회한 설정을 서버에서 메타데이터·Open Graph에 반영하고, 사이트맵도 고객사 코드 목록 API 기준으로 생성했습니다.
- 결과
- 프론트엔드 배포 없이 검색 노출 정보를 바꾸고 신규 고객사를 추가할 수 있는 구조로 전환했습니다.
결과 근거: 이력서 기재 내용. 검색 노출 수치는 이력서에 적혀 있지 않습니다.
구조
- 검색 엔진·링크 미리보기 · 임시·화면 계산
- 고객사별 챗봇 화면 · 확정
전환. 사용자 서비스를 Next.js 15 App Router로 전환합니다.
범례
- 임시·화면 계산
- 확정
- 문제 발생
- 대기
- 복구
판단
고객사별 정보를 검색 엔진에 어떻게 전달할 것인가
Next.js 15 App Router로 서버에서 메타데이터·Open Graph 생성
고객사 코드로 조회한 설정을 서버에서 반영해, 검색 엔진과 링크 미리보기가 고객사별 정보를 받습니다.
선택하지 않음 · CSR 유지 + 코드에 직접 반영 — 신규 고객사가 추가될 때마다 메타데이터와 검색 노출 경로를 코드에 직접 반영해야 해 확장에 불리합니다.
사이트맵은 무엇을 기준으로 만들 것인가
고객사 코드 목록 API를 기준으로 생성
새 고객사가 추가되면 검색 경로가 자동으로 포함됩니다.
문제와 해결
문제
CSR 구조에서는 검색 엔진과 링크 미리보기에 고객사별 정보를 안정적으로 전달하기 어려웠습니다.
해결
서버에서 조회한 고객사 설정으로 제목·설명·다국어 Open Graph와 사이트맵을 만들었습니다.
이력서 원문
고객사별 설정을 서버에서 메타데이터·Open Graph와 사이트맵에 반영해, 프론트엔드 배포 없이 검색 노출 정보를 바꾸고 신규 고객사를 추가할 수 있게 했습니다.
문제
고객사마다 브랜드와 언어가 다른 챗봇을 제공했지만, 기존 React CSR 구조에서는 검색 엔진과 링크 미리보기에 고객사별 정보를 안정적으로 전달하기 어려웠습니다. 신규 고객사가 추가될 때마다 메타데이터와 검색 노출 경로를 코드에 직접 반영하는 방식도 확장에 불리했습니다.
기여
사용자 서비스를 Next.js 15 App Router로 전환하고, 고객사 코드로 조회한 설정을 서버에서 메타데이터·Open Graph에 반영했습니다. 사이트맵도 고객사 코드 목록 API를 기준으로 생성해 새 고객사의 검색 경로가 자동으로 포함되게 했습니다.
결과
고객사별 제목·설명·다국어 Open Graph와 사이트맵을 운영 데이터로 관리하게 해, 프론트엔드 배포 없이 검색 노출 정보를 변경하거나 신규 고객사를 추가할 수 있는 구조로 전환했습니다.