SNN 뉴스 플랫폼 관리자 CMS

운영자가 개발자의 도움 없이 기사 콘텐츠와 서비스 주요 노출 영역을 관리할 수 있어야 했습니다. 기획서를 바탕으로 데이터 관계를 정의하고 관리자 화면과 API를 함께 구현했습니다.

Frontend Developer / API Developer

2024.11 ~ 2025.03

뉴스 플랫폼의 관리자 CMS와 관련 DB·API를 담당했습니다. 공개 뉴스 사용자 화면 전체를 개발한 것으로 표현하지 않습니다.

1. 01

   콘텐츠 관계 데이터 정합성

   기사 저장 시 본문뿐 아니라 복수 기자, 관련 기사, 태그와 첨부파일 정보가 함께 변경되어 부분 실패 위험이 있었습니다.

2. 02

   원본 품질과 렌더링 성능의 균형

   기사 이미지의 용도와 중요도가 다른데 동일한 최적화 규칙을 적용하면 품질 저하 또는 불필요한 용량이 발생했습니다.

기사, 기자, 카테고리, 배너, 검색 키워드와 관리자 권한을 한곳에서 관리할 수 있는 뉴스 플랫폼 CMS를 개발했습니다.

• 기사, 카테고리, 기자, 첨부파일, 권한 중심의 PostgreSQL 관계 구조 설계·개선
• Prisma 기반 기사 CRUD, relation 조회, soft delete와 관리자 API 개발
• CKEditor 기사 작성, 기자·관련 기사·태그·썸네일·예약 발행 기능 구현
• 메인 뉴스 노출, 배너, 검색 키워드 정렬, 관리자 권한 관리 개발
• sharp WebP 변환과 AWS S3 이미지 업로드 흐름 구성

1. 콘텐츠 관계 데이터 정합성

   Prisma Transaction으로 기사와 관계 데이터를 하나의 저장 단위로 묶고 수정·삭제 흐름을 정리했습니다.

   복합 콘텐츠 저장 과정의 데이터 불일치 가능성을 줄이고 API 처리 기준을 명확히 했습니다.

2. 원본 품질과 렌더링 성능의 균형

   sharp 기반 WebP 변환과 별도 썸네일 등록 구조를 적용하고 이미지 중요도에 따라 처리 방식을 구분했습니다.

   콘텐츠 품질을 유지하면서 사용자 페이지에서 활용하기 적합한 이미지 제공 흐름을 구성했습니다.

1. 기사 작성CMS
2. 저장 처리API
3. 관계 데이터DB
4. 이미지 제공S3

담당 기능을 중심으로 정리한 개념 흐름입니다.

관리자 편집

Next.js · React · CKEditor

API·데이터

Prisma Transaction · PostgreSQL

이미지 처리

sharp WebP 변환 · AWS S3

운영 기능

예약 발행 · 메인 노출 설정 · 관리자 권한

• ✓복합 관계 데이터 저장을 Prisma Transaction으로 처리
• ✓기사 수정·soft delete와 관계 조회 기준 정리
• ✓이미지 용도와 중요도에 따른 원본·썸네일 처리 구분

초기 데이터 구조는 화면 단위 요구사항만으로 판단하기보다 검색, 노출, 운영 수정까지 포함한 전체 사용 흐름을 먼저 검토해야 한다는 점을 배웠습니다.

• Next.js
• React
• TypeScript
• PostgreSQL
• Prisma
• CKEditor
• AWS S3
• sharp
• Vercel