HTML 기반 API 문서를 입력하면 명세 분석부터 테스트 코드 생성·실행, 챗봇 Q&A까지 한 번에 처리하는 풀스택 서비스입니다.
FastAPI 백엔드와 Vite+React 프런트엔드로 구성되어 있으며, OpenAI 모델을 활용해 API 파라미터 추출과 코드 생성을 자동화합니다.
이 프로젝트는 외주 프로젝트로 소스코드 공개가 어려워 공개 리드미만 존재함을 알립니다.
HTML 파일을 넣으면 전처리, 텍스트 추출 후 시각화
- 문서 → 명세: HTML 업로드 시 CSS/JS 제거 → 텍스트 추출 → GPT로 요청/응답 헤더·바디 파라미터를 JSON 형태로 도출.
- 명세 → 코드: 세션 단위로 분석 결과를 저장하고 언어별(API 테스트) 코드 스텁을 생성.
- 코드 실행: Python/JavaScript/Java/Go 코드를 세션 디렉터리에 저장 후 실행/컴파일, stdout·stderr 결과 반환.
- 대화형 워크플로우: 세션별 챗봇 히스토리를 보존해 후속 질의 시 컨텍스트를 전달하고, 최신 생성 코드를 별도 조회 가능.
- 프런트엔드 UX: API 명세 테이블 뷰, 생성 코드 확인, 다국어 코드 실행, 챗봇 인터랙션을 단일 UI에서 제공.
- Backend: FastAPI, Uvicorn, Pydantic(v2), Python 3.11+, OpenAI SDK, BeautifulSoup4
- Frontend: Vite, React 18, React Router, React Syntax Highlighter
- 플로우
/html/analyze업로드 →html_processor에서 텍스트 정제 →gpt_service가 프롬프트(prompts/API_parameter.txt)로 분석 → 세션 ID 생성/저장./code/generate-api-test에서 세션별 분석 결과와 원문을 프롬프트(API_code_generate.txt)에 주입해 언어별 테스트 코드 생성./code/run·/code/load가 세션 디렉터리(temp/{session})에서 코드 파일을 관리·실행./chatbot이 세션 대화 기록을session_manager에 보존하며, 이전 생성 코드나 히스토리를 GPT 입력에 포함.- 백그라운드 스레드(
run.py)가 24시간 지난 세션 파일을 주기적으로 정리.
- 동시성:
SessionThreadManager가 세션별 ThreadPoolExecutor를 유지해 GPT 호출·코드 실행을 격리, 유휴 세션은 1분 후 자동 정리. - 데이터 저장소: 영속 DB 없이 세션 단위 temp 디렉터리에 JSON/코드 파일 저장(경량·휘발성).
sequenceDiagram
participant User
participant FE as Frontend
participant API
participant GPT
participant Temp as Temp Storage
User->>FE: HTML 업로드
FE->>API: POST /html/analyze
API->>GPT: 프롬프트 기반 명세 추출(JSON 모드)
GPT-->>API: request/response 파라미터 JSON
API->>Temp: 분석 결과 저장 (session_id)
API-->>FE: {session_id, analysis}
sequenceDiagram
participant User
participant FE as Frontend
participant API
participant GPT
participant Temp as Temp Storage
User->>FE: 코드 생성 요청(언어 선택)
FE->>API: POST /code/generate-api-test
API->>GPT: 명세+원문 텍스트로 코드 생성
GPT-->>API: generated_code
API->>Temp: 코드/대화 저장
API-->>FE: PlainText 코드 반환
User->>FE: 코드 실행 요청
FE->>API: POST /code/run
API->>Temp: 세션 디렉터리에 코드 저장 후 실행
API-->>FE: stdout/stderr 결과
User->>FE: 챗봇 질문
FE->>API: POST /chatbot
API->>GPT: 히스토리+생성 코드 컨텍스트로 응답 생성
GPT-->>API: 답변
API->>Temp: 대화 저장
API-->>FE: 답변 전달
- app/main.py: FastAPI 앱/공통 CORS 및 전역 예외 처리, 라우터 등록.
- Routers
html_processing: HTML 텍스트 추출, 분석 및 세션 생성.code_generation: 세션 기반 API 테스트 코드 생성 후 대화 로그에 저장.chatbot: 세션 챗봇 질의/응답, 히스토리·최신 코드 조회.analysis: 세션별 분석 결과 조회.code_execution: 다언어 코드 실행 및 로드.
- Services
gpt_service: OpenAI Chat Completions(JSON 모드)로 API 파라미터 구조 도출.code_generator: 분석 결과+원문을 템플릿에 삽입해 언어별 테스트 코드 생성.code_executor: Python/JS/Java/Go 실행·컴파일 커맨드 매핑 및 결과 반환.session_manager: 세션 ID 생성, 분석/원문/대화/코드 메타 저장, 만료 정리.thread_manager: 세션별 스레드풀 관리, 유휴/초과 세션 클린업.chatbot_service: 대화형 프롬프트 구성, 생성 코드 컨텍스트 포함 응답.
- API 명세 뷰(
/api-spec): 세션 ID 기반으로/analysis/{id}결과를 요청/응답 탭으로 표시, 테이블 기반 필드/타입/필수 여부/설명 노출. 코드 생성 및 언어 선택 영역 포함. - AI Chat(
/ai-chat): 세션별 히스토리 로딩, 생성 코드 프리뷰, 명세(Request/Response) 탭, 코드 실행 탭(언어/입력/결과). 로컬스토리지 세션 ID 동기화. - API Hub / Home / Contact: 네비게이션/랜딩 컴포넌트(
Component766/767등)로 전체 플로우 연결. - 빌드 체인: Vite + React Router, Monaco Editor 기반 코드 편집, Syntax Highlighter 기반 코드 뷰.
- 세션 단위 멀티스레드 실행으로 GPT 호출·코드 실행을 격리하고, 임시 저장소 기반의 가벼운 상태 관리.
- GPT JSON 모드와 템플릿 프롬프트로 일관된 명세 추출 및 언어 선택형 테스트 코드 생성.
- 코드 실행 엔드포인트가 다언어를 지원해 생성 코드 바로 검증 가능하며, 프런트엔드에서 히스토리/코드/명세를 통합 UX로 제공.