AI 기반 자동 프로그래밍 시스템 – 전체 설계도 (3)

1. 큰 그림

"개발자 노트"를 작성 → "AI가 코드를 생성/수정" → "Git에 버전 관리" → "승인(PR)" 하는 흐름

 

[개발자 노트 UI] → [백엔드 서버] → [AI 코드 엔진] → [Git 저장소] ↓ [PR & 버전 관리]

 

---

2. 구성 요소와 역할

(1) 개발자 노트 UI (웹 브라우저 화면)

• 역할:
  • "필수 기능", "제외 기능", "승인 필요한 변경사항"을 쉽게 입력하는 화면
  • 예:
  •  
    프로젝트: Ai-programimng-UITOOL 필수 기능: 로그인, 수조 온도 모니터링 제외 기능: 외부 데이터 전송 승인 필요: DB 스키마 변경
  • [저장하기], [AI에게 코드 요청] 버튼 제공
• 사용 기술:
  • React(Next.js): 화면 개발
  • TailwindCSS: UI 스타일링

---

(2) 백엔드 서버

• 역할:
  • 개발자 노트를 저장 (로컬 JSON 또는 SQLite DB)
  • AI에게 전달할 명령어 구성
  • GitHub API와 통신 (Commit/Push/PR 생성)
• 사용 기술:
  • Python (FastAPI) 또는 Node.js (Express)
  • SQLite(가벼운 DB) 또는 단순 JSON 파일 저장

---

(3) AI 코드 엔진

• 역할:
  • 개발자 노트를 읽어, 해당 규칙에 맞는 코드를 생성/수정
  • 기존 코드와 비교(diff) 생성
  • Git 브랜치에 커밋
  • "승인 필요한 변경사항"이면 PR 생성 요청
• 사용 기술:
  • OpenAI GPT-4/5 API
  • LangChain (프롬프트 체계화)
  • PyGithub(node-github-api) (Git 연동)

---

(4) Git 저장소

• 역할:
  • AI가 수정한 코드를 저장
  • 승인(PR) 프로세스를 지원
  • 버전 태그(v1.1, v1.2) 자동 관리
• 사용 기술:
  • GitHub (개인 Repo)
  • Git CLI (로컬 테스트용)

---

3. 데이터 흐름 (단계별 동작)

 

[1] 사용자가 웹 UI에서 개발자 노트 작성

 

      ↓

 

[2] 백엔드가 노트를 저장하고 AI에 요청 준비

 

      ↓

 

[3] AI 코드 엔진이 노트를 기반으로 코드 생성/수정

 

      ↓

 

[4] 변경사항 GitHub dev-ai 브랜치에 커밋

 

      ↓

 

[5] 변경 내용이 "승인 필요" → 자동 PR 생성

 

      ↓

 

[6] 사용자가 GitHub에서 PR 확인 후 Merge

 

      ↓

 

[7] Merge 시 태그(v1.x) 생성, 변경 로그 자동 기록

---

4. 파일 구조 예시 (초기 버전)

 

---

5. 이 구조의 장점

• 초보자도 이해 가능: 프론트/백/AI 역할이 명확하게 분리
• 확장성: 나중에 팀 단위로 확장 가능
• 자동화: AI가 코드 수정 + Git 관리까지 수행
• 안전성: 승인(PR) 절차로 잘못된 코드 방지

---

6. 다음 단계

1. UI부터 시작: 개발자 노트를 작성할 수 있는 웹페이지(React) 제작
2. 백엔드 연결: 입력된 노트를 저장하고 API 호출
3. AI 연동: 노트 기반으로 코드 자동 생성
4. Git 연동: Commit → PR 자동화