[Fivemonkeys_유유] 외주 프로젝트 유지보수 자동화(1)

# 유지보수 자동화: 고객 채팅 → AI 코드 수정 → 배포

## 📝 한줄 요약
고객이 채팅으로 "이거 바꿔줘" 하면 AI가 코드를 직접 수정하고, 배포까지 해서 미리보기 링크를 자동으로 답장해주는 프로젝트 자동 유지보수 관리 웹

**바쁘시면 이것만 읽어도 돼요:**
- 고객 채팅(Claude code) → AI 코드 수정 → GitHub 업로드 → 배포
- 직접 코드 열고 수정하고 배포하는 반복 작업이 사라짐
- 고객이 채팅 한 줄 보내면 미리보기 링크가 자동으로 답장으로 옴(프리뷰 화면)
- 윈도우 + claude pro 요금 환경에서 어떻게 해야 할지 고민 중....

---

## 🎯 이런 분들께 도움돼요
- AI 툴로 실제 서비스를 구축한 사례가 궁금한 분
- 고객 유지보수 업무를 자동화하고 싶은 분

---

## 😫 문제 상황 (Before)

웹사이트를 외주를 의뢰한 고객사가 있습니다. 고객은 비개발자라 코드를 직접 건드릴 수 없어요.

그러다 보니 이런 상황이 반복됩니다.

> 고객: "메인 페이지 문구 좀 바꿔주세요"
> 나: (코드 열고 → 수정하고 → 배포하고 → 링크 전달)

매번 중간에서 전달자 역할을 해야 하고, 간단한 텍스트 수정 하나에도 제 시간이 들어갑니다.

---

## 🛠️ 사용한 도구
- **도구**: Claude Code
- **모델**: Claude Sonnet 4.6
- **사용 기술 스택**: Next.js, TypeScript, Vercel, Supabase, PostgreSQL
- **특이사항**: 웹에서 claude코드와 대화 후에 자동으로 배포까지 처

---

## 🔧 작업 과정
---

### 커넥터 구축 1차

Claude Code가 30초마다 포털을 확인하고, 요청이 오면 코드를 수정해서 배포하는 스크립트를 만들었습니다. 실행했더니 처음엔 에러 메시지조차 제대로 안 뜨는 상황. 로그를 뒤져보니 내부 충돌 문제였습니다.

---

### 커넥터 구축 2차

충돌 원인을 파악하고 방식을 바꿨습니다. 이번엔 AI API를 직접 호출하는 방식으로요. 실행해보니 이번엔 다른 에러: API 크레딧이 소진된 상태였습니다.

pro 요금제를 사용중라 api 키를 이용한 방식은 당연히 안됨.... 안되는 걸 알면서 시도해봄

추후에 api key를 사용할 수 있는 상황이라면 교체할 수 있게 스크립트 저장

---

### 커넥터 구축 3차

**Claude Code 자체가 1분마다 포털을 확인하고 직접 처리하는 구조**

Claude Code가 지침서 파일(`AGENT_INSTRUCTIONS.md`)을 작성했습니다. 어떤 요청이 오면 어떤 순서로 처리할지, 코드를 어떻게 읽고 수정할지, 배포 완료 후 어떻게 답장할지 전 과정이 담긴 문서입니다. 이후 1분마다 자동으로 이 지침서를 따라 움직이는 구조를 만들었습니다.

일단 응답을 받아보는게 목표, 실제로 응답 받음
훅이나 openclaw 또는 hermes를 통해서 완전 자동화 가능할텐데 api key나 다른 요금제를 사용해야 해서 고민 중....
다른 방안 없는지 생각중입니다.

---

## ✅ 결과 (After)

### Before vs After
| 항목 | Before | After |
|------|--------|-------|
| 수정 요청 처리 | 내가 직접 코드 수정 → 배포 → 링크 전달 | 고객 채팅 → AI 자동 처리 → 미리보기 링크 자동 답장 |
| 커뮤니케이션 | 요청 받기 → 처리 → 완료 보고 (3번 왕복) | 요청 → 자동 답장 (1번) |
| 고객사 확장성 | 고객 늘수록 내 시간 선형 증가 | 처리 용량 AI가 흡수 |

### 결과물
- 바이어 포털: youyou-iota.vercel.app
- 어드민 페이지와 바이어 페이지 구분

- 처리 완료 사례: "첫 섹션 영어로 변경" 요청 → 코드 수정 commit → 배포 완료 → 미리보기 링크 자동 전송

---


## 🌍 다른 업무에 적용한다면?
- **디자인 에이전시**: 고객이 채팅으로 "배너 문구 바꿔줘" 하면 AI가 자동 수정
- **스타트업 운영팀**: 마케팅 랜딩페이지 A/B 테스트 문구를 비개발자가 직접 변경 요청
- **프리랜서 개발자**: 유지보수 고객사 늘려도 대응 시간 늘지 않는 구조 구축

---

## 🚀 앞으로의 계획
웹을 통해서 고객과 내가 사용하는 ai를 연결하려고 하는데 
현재 claude pro 요금제를 사용하고 있어서, api key를 연결해야할지 아니면 다른 방법이 있을지 고민중...
기타 채팅창 알림 및 스크롤 관련 이슈 해결해야 함
기타 맘에 안드는 디자인 수

---