목차
대부분의 i18n 도구에서 번역과 함께 미디어를 관리하는 것은 항상 후순위였습니다. 텍스트를 번역한 다음, 별도의 시스템에서 이미지를 수동으로 처리합니다 — 다운로드, 재업로드, 링크 연결. Better i18n은 다른 접근 방식을 취합니다: 미디어는 콘텐츠 워크플로우의 일급 시민입니다.
이 가이드에서는 Better i18n의 미디어 관리가 어떻게 작동하는지 살펴봅니다 — 기본 업로드부터 내장된 Unsplash 통합, 그리고 이 모든 것을 지원하는 R2 엣지 스토리지까지.
모든 사용 사례를 위한 네 가지 업로드 유형
모든 이미지가 동일한 목적을 수행하지 않으므로, Better i18n은 각 컨텍스트에 맞는 전용 업로드 흐름을 제공합니다:
프로필 아바타
모든 팀 구성원은 계정 설정에서 프로필 사진을 업로드할 수 있습니다. 이미지는 자동으로 처리, 크기 조정 및 저장됩니다. 아바타는 대시보드, 활동 피드, 콘텐츠 귀속 전반에 걸쳐 나타나므로, 팀은 항상 누가 어떤 변경을 했는지 알 수 있습니다.
조직 로고
조직의 브랜드 로고는 한 번 업로드되고 대시보드, 이메일 알림, 공개 페이지 전반에서 사용됩니다. 브랜딩이 변경되면 한 곳에서 업데이트하면 모든 곳에 전파됩니다.
AI 채팅 이미지
Better i18n의 AI 번역 에이전트와 함께 작업하고 계신가요? 시각적 컨텍스트를 위해 채팅에 직접 이미지를 업로드할 수 있습니다. 에이전트가 번역 중인 문자열의 공간적 컨텍스트를 이해할 수 있도록 UI의 스크린샷을 보여줘야 할 때 특히 유용합니다.
콘텐츠 미디어
이것은 가장 다재다능한 업로드 유형입니다. CMS 항목 — 블로그 게시물, 변경 로그 항목, 마케팅 페이지 — 을 편집할 때 항목에 직접 이미지를 첨부할 수 있습니다. 콘텐츠 미디어 파일은 상위 항목에 연결되어 있어 어떤 이미지가 어디에 속하는지 쉽게 추적할 수 있습니다.
Unsplash 통합: 검색, 선택, 완료
가장 일반적인 콘텐츠 작업 중 하나는 좋은 이미지를 찾는 것입니다. Better i18n은 Unsplash를 콘텐츠 편집기에 직접 통합하므로, 워크플로우를 떠날 필요가 없습니다.
작동 방식은 다음과 같습니다:
- 미디어 선택기를 엽니다 — 모든 콘텐츠 항목의 미디어 필드 또는 특성 이미지에서.
- 키워드로 Unsplash를 검색합니다. 결과가 즉시 나타납니다 — Unsplash의 300만 개 이상의 이미지 라이브러리에서 고품질의 무료 사진.
- 이미지를 선택합니다. 한 번의 클릭으로 자동 다운로드가 시작됩니다.
- 자동 R2 스토리지. 선택한 이미지가 Unsplash에서 다운로드되고 프로젝트의 R2 버킷에 업로드됩니다. URL이 콘텐츠 항목에 저장됩니다.
핵심 이점: 이미지가 Unsplash의 CDN이 아닌 자체 인프라에서 제공됩니다. 이는 타사 가동 시간에 대한 의존성 없음, 일관된 성능, 자산에 대한 완전한 제어를 의미합니다.
R2 스토리지: 빠르고, 글로벌하며, 송신 요금 없음
Better i18n에 업로드된 모든 이미지 — 기기에서, 팀 구성원의 아바타에서, 또는 Unsplash 검색에서 — 는 Cloudflare R2에 저장됩니다.
왜 R2인가요? 세 가지 이유가 있습니다:
- 엣지 전송. R2는 Cloudflare의 글로벌 데이터 센터 네트워크에서 파일을 제공합니다. 사용자가 어디에 있든 이미지가 빠르게 로드됩니다.
- 송신 요금 없음. 기존 클라우드 스토리지 제공자는 누군가가 파일을 다운로드할 때마다 요금을 부과합니다. R2는 그렇지 않습니다. 이는 글로벌 대상을 보유한 콘텐츠 집약적 사이트에 매우 중요합니다.
- 신뢰할 수 있는 URL. 업로드된 모든 파일에는 영구적이고 안정적인 URL이 있습니다. 템플릿, API 응답, 또는 정적 사이트 생성기에서 사용하십시오 — 계속 작동할 것입니다.
CMS 미디어 필드 유형
Better i18n의 헤드리스 CMS에서 콘텐츠 모델을 구축하고 있다면, Media 필드 유형이 이미지를 항목에 연결하는 방법입니다.
콘텐츠 모델에 Media 필드를 추가하면 항목 편집기는 다음을 할 수 있습니다:
- 기기에서 이미지 업로드
- Unsplash에서 검색하고 선택
- 첨부된 이미지의 인라인 미리보기 보기
- 선택적으로 로케일별로 다른 이미지 설정 (스크린샷이 현지화된 UI를 보여줄 때 유용)
이 필드 유형은 다른 모든 업로드와 동일한 R2 스토리지 파이프라인과 통합됩니다. 관리할 별도의 미디어 라이브러리 없음 — 모든 것이 하나의 시스템을 통해 흐릅니다.
실용적인 예시: 블로그 게시물에 커버 이미지 추가
실제 시나리오를 살펴보겠습니다. 제품의 새 대시보드 재설계에 대한 블로그 게시물을 작성하고 있습니다.
- Better i18n의 CMS에서 새 블로그 게시물 항목을 생성합니다.
- 제목, 본문 내용, 발췌문을 작성합니다.
- 특성 이미지 필드를 클릭합니다.
- Unsplash에서 "dashboard design"을 검색하거나 자체 스크린샷을 업로드합니다.
- 이미지를 선택합니다. R2에 자동으로 저장되고 게시물에 연결됩니다.
- 게시물을 다른 언어로 번역합니다. 특성 이미지가 이어지거나, 로케일별 스크린샷으로 교체할 수 있습니다.
- 게시합니다. 이미지가 R2의 엣지 네트워크에서 전 세계적으로 제공됩니다.
별도의 미디어 업로드 단계 없음. 깨진 이미지 링크 없음. 타사 CDN 의존성 없음.
워크플로우에 의미하는 바
Better i18n의 미디어 관리는 단계를 추가하는 것이 아니라 콘텐츠 워크플로우에 자연스럽게 녹아들도록 설계되었습니다. 업로드 유형은 컨텍스트에 맞게 구축되었고, Unsplash는 필요한 곳에 통합되었으며, R2는 구성 없이 스토리지와 전송을 처리합니다.
다국어 블로그, 문서 사이트, 또는 제품 마케팅 페이지를 관리하든, 이미지는 번역과 동일한 방식으로 처리됩니다 — 한 곳에서, 하나의 워크플로우로.
미디어 관리는 모든 Better i18n 요금제에서 사용 가능합니다. 이미 CMS를 사용하고 있다면, 업로드를 시작할 준비가 된 것입니다.