← 포트폴리오 목록

오름 챌린지 커뮤니티·랭킹 플랫폼

MVP 관리자 콘솔을 넘어, 챌린지 참가 코드 검증·완주 인증서 발급·랭킹 집계·큐레이션 관리까지 아우르는 확장 관리자 플랫폼을 구현합니다.

챌린지 코드 상태 머신 구현발급-검증-사용 3단계 상태 머신과 동시 요청 방지 락을 적용한 코드 검증 로직 구현
완주 인증서 PDF 자동 생성 구현jsPDF 기반 고유번호 포함 인증서 템플릿 생성, 발급 상태별 목록·일괄 승인 로직 설계
랭킹 집계 Materialized View 설계오름별·기간별 인증 랭킹을 Materialized View로 집계, Redis 캐싱으로 반복 조회 구조 최적화
서비스 타입Web
업종모니터링
기술 스택
ReactTypeScriptTailwind CSSNode.jsExpressPostgreSQLPrismaRedisChart.js
주요 기능
  • 인증 활동 피드 모니터링
  • 챌린지 참가 코드 관리
  • 완주 인증서 발급 관리
  • 큐레이션·배너 관리
Overview

프로젝트 개요

범위: 개발, 디자인, 기획

MVP 관리자 콘솔을 넘어, 챌린지 참가 코드 검증·완주 인증서 발급·랭킹 집계·큐레이션 관리까지 아우르는 확장 관리자 플랫폼을 구현합니다. 인증 활동 실시간 피드와 Redis 캐싱 기반 랭킹 대시보드로 대규모 사용자 확장을 대비하는 인프라 확장 구현한 프로젝트입니다.

작업 범위

  • 인증 활동 피드 모니터링: 전체 사용자의 등반 인증 활동을 시간순 피드로 모니터링하고, 우측 패널에서 오름별·기간별 랭킹 통계를 함께 확인하는 관리자 화면
  • 챌린지 참가 코드 관리: 네이버 스토어에서 판매된 챌린지 참가 코드를 등록·검증하고 사용 이력을 조회하는 화면
  • 완주 인증서 발급 관리: 30곳·100곳 완주 조건을 충족한 사용자의 인증서 발급 요청을 검토하고 PDF 인증서를 승인·발급하는 화면
  • 큐레이션·배너 관리: 관리자가 홈 화면에 노출할 추천 오름 큐레이션과 이벤트 배너를 등록·순서 관리하는 화면

주요 업무

  • 인증 활동 피드 모니터링 화면: 인증 승인 이벤트를 스트림으로 구독해 최신순 피드에 반영하고, 사이드 패널에 실시간 랭킹 집계를 표시하는 구조로 구현할 예정
  • 챌린지 참가 코드 관리 화면: 코드 발급-검증-사용 상태를 관리하는 상태 머신을 구현하고, 중복 사용을 방지하는 유니크 제약을 설계할 예정
  • 완주 인증서 발급 관리 화면: 완주 조건 충족 여부를 자동 판정하고, 관리자 수동 승인 후 PDF 인증서를 생성하는 흐름으로 구현할 예정
  • 큐레이션·배너 관리 화면: 노출 기간과 우선순위를 가진 배너·큐레이션 항목을 드래그 정렬로 관리하는 구조로 구현할 예정
오름 챌린지 커뮤니티·랭킹 플랫폼
요구사항 정의

프로젝트 핵심 과제

프로젝트 진행 시 해결한 핵심 기술 과제입니다.

챌린지 참가 코드가 대량 판매될 경우 동시 검증 요청이 몰릴 수

락 경합을 최소화하는 검증 구조 설계 필요

완주 인증서 고유번호가 중복되지 않

발급 시점 동시성을 제어하는 채번 전략 필요

랭킹 집계 쿼리가 사용자·오름 수 증가에 따라 느려질 수

Materialized View 갱신 주기와 캐싱 전략 설계 필요

큐레이션·배너 노출 기간이 겹칠 때 우선순위 충돌을 해소하는 정렬 규칙

구현 내용

핵심 기능 상세

핵심 기능 1

인증 활동 피드 모니터링

전체 사용자의 등반 인증 활동을 시간순 피드로 모니터링하고, 우측 패널에서 오름별·기간별 랭킹 통계를 함께 확인하는 관리자 화면.

  • 폴링 기반으로 신규 인증 승인 이벤트를 피드에 최신순 반영하는 구조 설계
  • 오름별·기간별 인증 수를 집계하는 랭킹 쿼리를 Materialized View로 설계
  • 피드 카드에 사진 썸네일, 배지 아이콘, 오름 태그를 조합한 컴팩트 카드 컴포넌트 구현

실시간 피드와 랭킹 집계를 하나의 화면에 결합해 관리자가 커뮤니티 활동을 한눈에 모니터링할 수 있는 구조를 구현합니다.

인증 활동 피드 모니터링
인증 활동 피드 모니터링 실제 화면
핵심 기능 2

챌린지 참가 코드 관리

네이버 스토어에서 판매된 챌린지 참가 코드를 등록·검증하고 사용 이력을 조회하는 화면. 코드 발급-검증-사용 상태를 관리하는 상태 머신을 구현하고, 중복 사용을 방지하는 유니크 제약을 설계할 예정.

  • 참가 코드 발급 배치 업로드 및 유효기간·상태(미사용/사용/만료) 관리 로직 구현
  • 코드 검증 API에 유니크 제약과 동시 요청 방지 락 적용
  • 코드별 사용 이력과 연결된 사용자 정보를 조회하는 관리 화면 구현

코드 상태 머신과 동시성 제어를 결합해 중복 사용 없는 참가 코드 검증 구조를 구현합니다.

챌린지 참가 코드 관리
챌린지 참가 코드 관리 실제 화면
핵심 기능 3

완주 인증서 발급 관리

30곳·100곳 완주 조건을 충족한 사용자의 인증서 발급 요청을 검토하고 PDF 인증서를 승인·발급하는 화면.

  • 완주 마일스톤(30곳/100곳) 충족 여부를 자동 판정하는 조건 검증 로직 구현
  • jsPDF 기반 인증서 템플릿에 사용자명·완주일·고유번호를 삽입해 PDF 생성
  • 발급 대기·승인·발급완료 상태별 목록과 일괄 승인 기능 구현

완주 조건 자동 판정과 jsPDF 인증서 생성 파이프라인을 결합해 관리자 수동 승인만 거치는 발급 구조를 구현합니다.

완주 인증서 발급 관리
완주 인증서 발급 관리 실제 화면
핵심 기능 4

큐레이션·배너 관리

관리자가 홈 화면에 노출할 추천 오름 큐레이션과 이벤트 배너를 등록·순서 관리하는 화면. 노출 기간과 우선순위를 가진 배너·큐레이션 항목을 드래그 정렬로 관리하는 구조로 구현할 예정.

  • 노출 기간·우선순위 필드를 가진 배너·큐레이션 스키마 설계
  • 드래그 앤 드롭 순서 변경 UI와 순서값 일괄 갱신 API 구현
  • 노출 기간이 지난 배너를 자동으로 비활성 처리하는 스케줄 로직 설계

우선순위 기반 큐레이션 스키마와 드래그 정렬 UI를 결합해 유연한 홈 노출 관리 구조를 구현합니다.

큐레이션·배너 관리
큐레이션·배너 관리 실제 화면
구현 과정

프로젝트 진행 단계

STEP 1

확장 스키마 설계 및 참가코드·인증서 모델링 · 2026.09

챌린지 코드, 인증서, 큐레이션 테이블 설계, 완주 조건 판정 로직 초안 작성

STEP 2

참가코드 검증 및 인증서 발급 API 개발 · 2026.09

코드 검증 락 처리, jsPDF 인증서 생성 API 구현, 발급 상태 머신 구축

STEP 3

실시간 피드·랭킹 집계 구현 · 2026.09

인증 활동 피드 스트림 구조, Materialized View 기반 랭킹 집계 쿼리 구현

STEP 4

큐레이션 관리 UI 및 통합 배포 · 2026.09

드래그 정렬 큐레이션 UI 구현, Redis 캐싱 적용, 전 화면 통합 QA

프로젝트 성과

주요 성과

챌린지 코드 상태 머신 구현발급-검증-사용 3단계 상태 머신과 동시 요청 방지 락을 적용한 코드 검증 로직 구현
완주 인증서 PDF 자동 생성 구현jsPDF 기반 고유번호 포함 인증서 템플릿 생성, 발급 상태별 목록·일괄 승인 로직 설계
랭킹 집계 Materialized View 설계오름별·기간별 인증 랭킹을 Materialized View로 집계, Redis 캐싱으로 반복 조회 구조 최적화
실시간 인증 피드 스트림 구조 구현인증 승인 이벤트를 구독해 최신순으로 반영하는 피드 스트림과 필터링 로직 구현
Highlights

기술적 주안점

  • 실시간 피드와 랭킹 집계를 하나의 화면에 결합해 관리자가 커뮤니티 활동을 한눈에 모니터링할 수 있는 구조를 구현합니다
  • 코드 상태 머신과 동시성 제어를 결합해 중복 사용 없는 참가 코드 검증 구조를 구현합니다
  • 완주 조건 자동 판정과 jsPDF 인증서 생성 파이프라인을 결합해 관리자 수동 승인만 거치는 발급 구조를 구현합니다

유사한 프로젝트를 기획하고 계신가요?

FIRSTPIP이 개발 범위와 로드맵을 함께 정리해드립니다

무료 상담 시작하기