요구사항 - swkim0128/PARA GitHub Wiki

다음은 지금까지 제공된 설명과 개요를 바탕으로 법안 Git Graph 프로젝트의 최종 요구사항 정리입니다. A4 기준 약 3장 분량이며, 기능적/비기능적 요구사항뿐 아니라 UX, 시각화 요소까지 체계적으로 정리했습니다.

1. 📌 프로젝트 개요

목표:

법안의 생성(초기 내용)부터 발의, 병합까지의 과정을 Git의 버전 그래프처럼 시각화하고, 각 버전의 내용 및 발의자 정보를 비교·열람할 수 있는 웹 애플리케이션을 구축한다.

주요 기능 요약:

  • 법안의 버전별 변경 이력 시각화 (Git Graph 방식)
  • 발의된 법안 클릭 시 상세 정보 제공
  • 이전 법안과의 변경 내용 비교(Diff)
  • 병합 과정을 그래프 구조로 표현

2. ✅ 기능 요구사항 (Functional Requirements)

2.1 법안 정보 수집 및 저장

  • 초기 법안 기준선(base law) 확보
  • 각 발의안은 해당 기준선을 기반으로 버전 분기(branch) 처리
  • 메타데이터 수집: 법안명, 발의일, 발의자, 정당, 상태(발의/병합/폐기 등)
  • 본문 텍스트 수집 및 저장 (조항별 구성 포함)

2.2 버전 관리

  • 법안 내용은 Git 버전 관리 방식으로 관리
  • 각 발의안은 고유한 커밋처럼 저장
  • 병합 시, 관련 발의안을 하나의 노드로 합침
  • 커밋에는 발의자, 날짜, 설명(변경 요약)이 포함됨

2.3 시각화 (Git Graph)

  • 각 노드는 법안의 하나의 버전
  • 브랜치 구조로 발의안 표현
  • 병합 노드는 이전 발의안과 연결됨
  • 노드 간 선은 상속 관계 또는 병합 흐름 표현

2.4 그래프 인터랙션

  • 노드 클릭 시 팝업 또는 패널로 상세 정보 제공:
    • 법안 전체 내용
    • 발의자 정보 (이름, 정당, 지역구)
    • 발의일, 상태, 관련 법률
  • Hover 시 요약 정보 툴팁 제공

2.5 법안 내용 비교

  • 기준 법안 vs 발의안 / 발의안 A vs 발의안 B 비교 가능

  • 변경 사항은 다음과 같이 시각화:

    • 삽입: 강조색으로 표시
    • 삭제: 취소선 또는 배경색
    • 수정: 기존/수정 텍스트 나란히 표시
  • 비교 방식: 양쪽 열 배치(left-right) 또는 inline diff 선택 가능

2.6 검색 및 필터 기능

  • 키워드 검색: 법안명, 발의자명, 키워드
  • 필터: 발의자, 정당, 위원회, 상태(폐기/상정/통과 등)
  • 정렬: 최신순, 발의자순, 관련도순

2.7 데이터 API 제공 (선택적 기능)

  • JSON API 형태로 그래프 노드/법안 정보 제공
  • 외부 활용을 위한 문서화 제공 (Swagger 등)

3. 🚦 비기능 요구사항 (Non-Functional Requirements)

3.1 성능

  • 수천 건의 법안 및 버전에도 빠른 검색 및 렌더링 지원
  • 시각화는 클라이언트 렌더링 성능 고려한 라이브러리 사용

3.2 확장성

  • 다국가 법안 비교/지원 구조로 설계 (국회 외 다른 기관 연계 고려)
  • 커스터마이징 용이한 구조 (플러그인 기반 구조 추천)

3.3 보안 및 권한

  • 비로그인 사용자는 열람만 가능
  • 관리자만 법안 등록, 수집 갱신 가능
  • 위변조 방지: 버전 체크섬 또는 변경 로그 기록

3.4 접근성

  • 비전문가도 쉽게 그래프를 이해할 수 있는 UI
  • 모바일/태블릿 대응 고려

4. 🧩 UX/시각화 요구사항

4.1 Git Graph 시각화 요소

  • 노드(Node): 법안 버전, 상태별 색상 구분
    • 발의: 파랑 / 병합: 초록 / 폐기: 회색
  • 엣지(Edge): 분기/병합/상속 관계 연결
  • 브랜치: 같은 법안에서 파생된 다수 발의안의 흐름 표현

4.2 상호작용

  • 마우스 Hover → 법안 정보 툴팁
  • 클릭 → 우측 패널 또는 모달로 상세 보기
  • 선택한 두 노드 비교 버튼 → 변경점 비교 모드 전환

4.3 필터와 탐색

  • 필터된 조건에 맞는 노드만 하이라이팅
  • 미니맵 또는 트리맵을 통한 전체 구조 보기
  • Drag & Zoom 가능

5. 🧱 기술 요구사항

5.1 프론트엔드

  • React 기반 SPA
  • D3.js 또는 Cytoscape.js를 통한 그래프 렌더링
  • Tailwind 또는 MUI 등으로 반응형 UI 구성

5.2 백엔드

  • Node.js(Express) 또는 Spring Boot 기반 REST API
  • Git 유사 구조로 법안 데이터 저장 (텍스트 기반 diff 구조)
  • DB: PostgreSQL + JSONB or MongoDB

5.3 DevOps

  • Docker 기반 컨테이너화
  • GitHub Actions, GitLab CI 등으로 자동 배포 구성
  • AWS, Vercel, 또는 GCP로 배포

💡 기발한 아이디어

“입법자 활동 추적 오버레이”

  • 하나의 의원이 여러 법안을 발의한 경우, 그래프 위에 의원별 선을 덧씌워 활동 흐름을 시각화합니다.
  • 예: 같은 의원의 발의안들이 그래프에서 연결되어 타임라인처럼 보이도록.
  • 입법 영향력, 정치적 흐름, 정당 간 패턴 분석에도 활용 가능.
⚠️ **GitHub.com Fallback** ⚠️