프로젝트 배경
태양광 발전소 통합 모니터링 플랫폼을 파일럿으로, 멀티 OEM 연동·실시간 발전량 차트·역할 기반 접근 제어·자동 테마 전환이 실제로 구현 가능한지 검증했습니다. Next.js 15 + MongoDB 스택으로 관리자·사용자 역할 분리, 발전소 14개 통합까지 단기간에 완성하고 즉시 운영 가능한 상태임을 확인하는 것이 목표였습니다.
프로젝트 성과
3개 OEM 발전소 14개 통합 대시보드
SolarEdge·Sungrow·한화에너지 OEM 어댑터 구조 적용. 발전소 14개를 단일 화면에서 통합 모니터링하며 신규 OEM은 어댑터 1개 추가로 확장 가능
실시간 출력 커브·발전량 히스토리 시각화
ECharts 5 기반 발전소별 오늘 출력 커브(kW)와 최근 30일 발전량 막대 차트 구현. 기상 프로파일(맑음/흐림/비)을 반영한 발전소별 차별화된 출력 곡선 제공
OEM·상태·텍스트 복합 필터링 UI
발전소 목록에서 제조사·운영 상태·발전소명·주소 실시간 복합 필터링 + 정렬(발전소명·상태·최근 수집). 활성 필터 칩 표시, 전체 초기화 기능 제공
관리자 라이트·사용자 다크 테마 자동 전환
CSS 커스텀 프로퍼티 기반 전체 테마 시스템 구축. 관리자 로그인 시 화이트라벨 라이트 테마, 일반 사용자 로그인 시 다크 테마 자동 적용
관리자 라이트·사용자 다크 테마 자동 전환
CSS 커스텀 프로퍼티 기반 전체 테마 시스템 구축. 관리자 로그인 시 화이트라벨 라이트 테마, 일반 사용자 로그인 시 다크 테마 자동 적용
핵심 기능
진행 단계
1단계: 아키텍처 설계 및 기반 구축
2026.04.
Next.js 15 App Router + MongoDB + JWT 인증 스택 설계. 멀티 OEM 어댑터 구조, 역할 기반 접근 제어, CSS 커스텀 프로퍼티 테마 시스템 기반 구축
프로젝트 상세
SolarEdge·Sungrow·한화에너지 3개 OEM 발전소 14개를 단일 대시보드에서 통합 관리하는 모니터링 플랫폼 파일럿입니다. ECharts 기반 실시간 출력 커브·발전량 히스토리 차트, OEM·상태·텍스트 복합 필터링 UI, 이상 징후 알림, 관리자·사용자 역할별 라이트/다크 테마 자동 전환을 구현했습니다. Next.js 15 App Router + MongoDB + JWT HttpOnly 쿠키







