Supercycl Community Viewer

Supercycl × YouthMeta 커뮤니티 관리자 대시보드의 조회 전용 데스크톱 웹 목업입니다.

목업 열기 · GitHub 저장소

독립 프로젝트로 작업하기

기본 작업 폴더는 supercycl-product-community-viewer/이며, 기획 프로젝트 supercycl-product-planning/과 같은 상위 폴더에 둡니다. Claude Code나 편집기에서 이 폴더를 프로젝트로 열면 됩니다. 기획 프로젝트와 별도 Git 저장소이며, 빌드 도구나 환경 변수 설치 없이 실행됩니다.

supercycl-product-community-viewer/
├── index.html                 # 화면·스타일·동작·가상 데이터·로고
├── README.md                  # 실행·검증·배포 안내
├── AGENTS.md                  # 공통 에이전트 작업 지침
├── CLAUDE.md                  # Claude용 작업 지침 진입점
├── docs/
│   └── PROJECT_CONTEXT.md     # 목적·구현 범위·결정 사항·정책 참조
├── .gitignore
└── .nojekyll                  # GitHub Pages 정적 게시 설정

index.html이 수정 원본이며 GitHub Pages 배포본과 함께 관리합니다. 정책 참고 위치와 이전 작업의 맥락은 프로젝트 컨텍스트에 정리되어 있습니다.

사용 방법

로그인 화면에서 이메일로 계속하기 또는 Google로 계속하기를 누르면 바로 시연할 수 있습니다. 실제 Web3Auth 창은 열리지 않으며 별도 계정이나 설치가 필요하지 않습니다. 내려받은 index.html을 브라우저에서 직접 열어도 동작합니다.

프로젝트 폴더에서 로컬 서버로 확인하려면 다음 명령을 실행하고 http://localhost:4173을 엽니다. Python 3만 필요하며 종료는 Ctrl+C입니다.

python3 -m http.server 4173 --bind 127.0.0.1

현재 기능

• 운영 대시보드 상단에서 미실현 손익과 기간별 실현 성과를 먼저 확인
• 커뮤니티 신고·제재, 멤버 상태, 확인이 필요한 항목, 거래소 연동 현황을 소제목으로 구분
• 요약 숫자를 눌러 해당 조건이 적용된 상세 목록으로 이동
• 상단 채널 선택: 최근 본 채널 카드 3개와 전체 채널 목록(검색, 채널별 대기 신고·포지션 주의·연동 미완료 표시)으로 12개 가상 채널 전환
• 채널마다 다른 상황을 담아 대형 채널, 빈 채널, 큰 손실, 신고·제재 다수, 긴 이름, 큰 금액 등을 채널 전환만으로 확인
• 미실현 손익, 기간별 실현 성과, 멤버 연동 현황 조회
• 멤버 및 포지션 현황: 멤버마다 OKX·BingX·Binance 연동 여부를 표시(연동된 거래소만 색으로 강조)하고, 각 멤버 아래 보유 포지션(종목·레버리지 포함)을 바로 표시하며 검색·건수가 보이는 연동 상태·거래소 필터·정렬·페이지 이동 지원
• 대시보드 거래소 연동 현황에서 거래소별 연동 인원을 누르면 해당 거래소 필터가 적용된 멤버 목록으로 이동
• 대시보드의 주의 멤버를 누르면 포지션 주의 목록의 해당 멤버로 이동
• 포지션 주의 멤버와 채널 정보 확인
• 채널별 신고 사유·처리 상태·조치 결과 및 제재 적용·해제 이력 조회
• 신고·제재 기록 검색, 건수가 보이는 상태 필터, 사유·종류 필터, 우선순위·시간순 정렬과 관련 기록 간 이동

목업 범위

로그인은 모바일 앱과 같은 Web3Auth(이메일 인증 코드·Google)를 사용하는 것으로 정했습니다. 별도 뷰어 계정·비밀번호는 두지 않습니다. 목업의 로그인 화면은 시연용이라 실제 인증을 수행하지 않으며 모든 인물·계정·수치는 가상 데이터입니다. 서버 연결, 정보 수정, 거래 기능은 없습니다. 실제 계정이나 개인정보를 입력할 필요가 없습니다.

HTML·CSS·JavaScript와 로고가 index.html 하나에 포함되어 있습니다. 외부 라이브러리나 외부 데이터 요청은 사용하지 않습니다.

신고·제재 조회의 검토 범위

신고 사유는 모바일 커뮤니티의 네 가지 분류(스팸 또는 사기, 괴롭힘 또는 욕설, 오해를 부르는 투자 주장, 기타)를 따릅니다. 채널 강퇴는 해당 채널의 재참여 차단을 포함하며, 차단을 해제해도 자동 복귀하지 않습니다.

신고자 정보와 신고 메모·메시지 원문·첨부는 이 목업에 포함하지 않습니다. 개인 차단과 포지션 경고는 제재 통계에서 제외합니다. 신고만으로 메시지를 자동 숨김·삭제하지 않으며, 신고자 결과 알림과 실제 제재 실행 기능도 없습니다.

신고 현황을 뷰어에게 공개하는 범위, 처리 단계·이력 필드, 운영 제재의 세부 적용 범위·해제 기준은 유스메타 협의를 위한 제안입니다. Supercycl 운영이 신고를 심사한다는 가정 역시 합의가 필요합니다. 화면의 접수·검토 중·조치 완료·조치 없음 및 적용 중·해제됨은 확정된 운영 절차를 의미하지 않습니다.

신고는 1건씩, 제재는 조치 1건씩 표시합니다. 적용 중 대상 인원은 선택 채널 관련 기록에서 중복 대상을 한 번만 세며, 커뮤니티 전체 제한 등은 각 기록에 적용 범위를 별도로 표기합니다. 현재 채널의 멤버 명단과 과거 운영 기록의 대상은 다를 수 있습니다.

수정 후 확인

git diff --check로 공백 오류를 확인합니다. 화면이나 스크립트를 변경했다면 브라우저에서 시연 로그인(이메일·Google), 채널 전환과 전체 채널 목록, 변경한 메뉴와 상세 화면, 로그아웃을 확인합니다. 신고·제재 화면을 바꿀 때는 검색·필터와 관련 기록 이동도 확인합니다.

현재 별도 빌드·패키지 설치·테스트 러너는 없습니다. 기획 프로젝트(supercycl-product-planning)의 생성기나 검증 명령을 이 저장소에서 실행하지 않습니다.

Git과 게시

GitHub Pages가 main 브랜치의 루트(/)를 게시합니다. index.html 변경을 커밋하고 푸시하면 새 내용이 반영됩니다. .nojekyll은 정적 HTML을 그대로 게시하기 위한 파일입니다.

git status --short
git fetch origin main
git log --oneline origin/main..HEAD
git push origin main
gh run list --repo woosik-bit/supercycl-community-viewer --limit 3

작업 전에 원격 변경을 확인하고, 검증한 파일을 커밋한 뒤 푸시합니다. 위 명령의 origin은 https://github.com/woosik-bit/supercycl-community-viewer.git이어야 합니다. 이 저장소는 main에 게시하며 기획 프로젝트의 dev·릴리스 흐름과 별도로 운영합니다.

저장소 소유 계정은 woosik-bit이며, 이 저장소의 로컬 Git 사용자도 woosik-bit <[email protected]>으로 설정합니다. gh auth status로 woosik-bit이 활성 계정인지 확인합니다. 다른 계정의 인증이 필요하면 해당 게시 명령에만 적용하고 인증 값을 파일·로그·Git에 저장하지 않습니다.

배포 후 GitHub Actions의 Pages 작업 성공과 실제 사이트 반영을 확인합니다.

인수인계 이력

2026.11에 이전 저장소 5kyo/supercycl-community-viewer에서 커밋 이력을 그대로 가져와 이 저장소로 옮겼습니다. 이전 저장소는 더 이상 갱신하지 않으며, 로컬에는 참고용으로 team 원격으로만 남아 있습니다. team에는 푸시하지 않습니다.