fix(homepage): white screen fix + login message + vibe coding manual
- useMemberAuth: return null to loading spinner - MemberOnly: add login/register message - manual/40: vibe coding guide (closed/open network) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
DESKTOP-TKLFCPR\ython
parent
4aafbaee41
commit
57d521e9bf
180
manual/40_바이브코딩_운영가이드.md
Normal file
180
manual/40_바이브코딩_운영가이드.md
Normal file
@ -0,0 +1,180 @@
|
||||
# GUARDiA 바이브 코딩(Vibe Coding) 운영 가이드
|
||||
|
||||
> 최종 업데이트: 2026-05-31
|
||||
|
||||
---
|
||||
|
||||
## 1. 개요
|
||||
|
||||
**바이브 코딩(VibeSession)**은 GUARDiA ITSM의 AI 보조 개발 세션 기능입니다.
|
||||
메신저 명령 한 줄로 SR(서비스 요청)에 연결된 코딩 세션을 시작하고, 빌드·배포까지 자동화합니다.
|
||||
|
||||
---
|
||||
|
||||
## 2. 폐쇄망 환경에서의 바이브 코딩
|
||||
|
||||
### 2-1. 폐쇄망 환경 정의
|
||||
|
||||
| 항목 | 설명 |
|
||||
|------|------|
|
||||
| 정의 | 인터넷 차단, 내부망 전용 운영 환경 |
|
||||
| 해당 고객 | 공공기관, 금융, 국방 등 보안 규정 적용 기관 |
|
||||
| LLM | Ollama 로컬 모델 (llama3:8b, codellama:7b) |
|
||||
| 소스 저장소 | 내부 Gitea (Git 호환 오픈소스) |
|
||||
| CI/CD | 내부 Jenkins |
|
||||
|
||||
### 2-2. 폐쇄망 바이브 코딩 흐름
|
||||
|
||||
```
|
||||
[메신저 채널]
|
||||
↓ !vibe SR-20260531-XXXX
|
||||
[GUARDiA ITSM - 내부망]
|
||||
↓ SR 조회 → VibeSession 생성
|
||||
↓ 워크스페이스 생성: /opt/guardia/workspaces/{session_id}/
|
||||
↓ 내부 Gitea에서 소스 클론 (git clone http://gitea.내부망/...)
|
||||
[AI 코딩 보조 - Ollama 로컬]
|
||||
↓ codellama:7b 코드 분석 (외부 API 불필요)
|
||||
↓ 변경 파일 목록 생성
|
||||
↓ !build {session_id}
|
||||
[Jenkins CI - 내부망]
|
||||
↓ 빌드 실행 (Maven/Gradle/npm)
|
||||
↓ 테스트 실행
|
||||
↓ !deploy {session_id}
|
||||
[SSH 배포 - paramiko]
|
||||
↓ 대상 서버에 SSH 접속 (에이전트리스)
|
||||
↓ 백업 → 배포 → 헬스체크 → 롤백(실패 시)
|
||||
[메신저 채널]
|
||||
← 배포 성공/실패 알림
|
||||
```
|
||||
|
||||
### 2-3. 폐쇄망 전제 조건
|
||||
|
||||
| 항목 | 설치 위치 | 확인 명령 |
|
||||
|------|----------|---------|
|
||||
| Ollama | GUARDiA 서버 로컬 | `curl http://localhost:11434/api/tags` |
|
||||
| codellama:7b | Ollama 모델 | `ollama list` |
|
||||
| Gitea | 내부 서버 (3000번 포트) | `curl http://내부IP:3000` |
|
||||
| Jenkins | 내부 서버 (8080번 포트) | `curl http://내부IP:8080` |
|
||||
| SSH opsagent | 각 대상 서버 계정 | `ssh opsagent@대상IP` |
|
||||
|
||||
### 2-4. 폐쇄망 설정 (ITSM .env)
|
||||
|
||||
```bash
|
||||
# 폐쇄망 환경 필수 설정
|
||||
OLLAMA_BASE_URL=http://127.0.0.1:11434 # 로컬 Ollama
|
||||
GITEA_URL=http://내부Gitea서버:3000 # 내부 Git 서버
|
||||
JENKINS_URL=http://내부Jenkins서버:8080 # 내부 CI/CD
|
||||
JENKINS_USER=admin
|
||||
JENKINS_TOKEN=<Jenkins API Token>
|
||||
EXTERNAL_API_ALLOWED=false # 외부 API 차단
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 3. 개방망 환경에서의 바이브 코딩
|
||||
|
||||
### 3-1. 개방망 환경 정의
|
||||
|
||||
| 항목 | 설명 |
|
||||
|------|------|
|
||||
| 정의 | 인터넷 접근 가능, 클라우드 연동 허용 환경 |
|
||||
| 해당 고객 | 민간 기업, SaaS 서비스, 개발 환경 |
|
||||
| LLM | Ollama 로컬 (온프레미스 원칙) 또는 대체 모델 |
|
||||
| 소스 저장소 | GitHub, GitLab, 내부 Gitea 선택 |
|
||||
| CI/CD | Jenkins, GitHub Actions, GitLab CI 선택 |
|
||||
|
||||
### 3-2. 개방망 바이브 코딩 흐름
|
||||
|
||||
```
|
||||
[메신저 채널]
|
||||
↓ !vibe SR-20260531-XXXX
|
||||
[GUARDiA ITSM - 개방망 포트]
|
||||
↓ SR 조회 → VibeSession 생성
|
||||
↓ 워크스페이스 생성
|
||||
↓ GitHub/GitLab에서 소스 클론 (HTTPS)
|
||||
[AI 코딩 보조 - Ollama 로컬 (원칙)]
|
||||
↓ 코드 분석 + 수정 제안
|
||||
[CI/CD - GitHub Actions / Jenkins]
|
||||
↓ 빌드 → 테스트 → 배포
|
||||
[외부 알림]
|
||||
← Slack/카카오워크/Teams로 결과 전송
|
||||
```
|
||||
|
||||
### 3-3. 개방망 설정 (ITSM .env)
|
||||
|
||||
```bash
|
||||
# 개방망 환경 설정 (GUARDiA OpenNet 사용)
|
||||
GUARDIA_OPENNET=true
|
||||
OPENNET_API_KEY=goa-xxxx # API 키 (헤더 X-API-Key)
|
||||
OPENNET_BASE_URL=https://zioinfo.co.kr # GUARDiA 개방망 주소
|
||||
GITEA_URL=https://github.com # 또는 내부 Gitea
|
||||
EXTERNAL_API_ALLOWED=false # 외부 LLM API는 여전히 차단
|
||||
```
|
||||
|
||||
### 3-4. 개방망 vs 폐쇄망 차이점
|
||||
|
||||
| 항목 | 폐쇄망 | 개방망 |
|
||||
|------|--------|--------|
|
||||
| LLM | localhost:11434 (Ollama 필수) | localhost:11434 (Ollama 권장) |
|
||||
| Git 서버 | 내부 Gitea 전용 | GitHub/GitLab/Gitea 모두 가능 |
|
||||
| CI/CD | 내부 Jenkins 전용 | Jenkins, GitHub Actions 가능 |
|
||||
| 메신저 | 내부 메신저 또는 GUARDiA Messenger | 카카오워크, Slack, Teams 연동 가능 |
|
||||
| 배포 대상 | 내부 서버만 | 내부 + 클라우드(AWS/NCloud) 가능 |
|
||||
| 외부 API | 완전 차단 | 내부 LLM만 허용 (외부 LLM 불가) |
|
||||
|
||||
---
|
||||
|
||||
## 4. 바이브 코딩 메신저 명령어
|
||||
|
||||
```
|
||||
!vibe <SR-ID> [project_id] → 바이브 세션 시작
|
||||
!build <session_id> → 빌드 실행
|
||||
!deploy <session_id> → 배포 실행
|
||||
!status <SR-ID> → 세션 상태 조회
|
||||
!cancel <session_id> → 세션 취소
|
||||
/rollback <session_id> → 긴급 롤백
|
||||
```
|
||||
|
||||
### 4-1. 세션 상태 흐름
|
||||
|
||||
```
|
||||
CREATED → CODING → BUILT → DEPLOYED
|
||||
↘ FAILED (빌드 실패 → 자동 롤백 없음)
|
||||
↘ FAILED_ROLLBACK (배포 실패 → 자동 롤백)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 5. 워크스페이스 구조
|
||||
|
||||
```
|
||||
/opt/guardia/workspaces/{session_id}/
|
||||
├── source/ # Git 클론된 소스
|
||||
├── build/ # 빌드 결과물
|
||||
├── backup/ # 배포 전 백업 (롤백용)
|
||||
└── logs/ # 세션 로그
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 6. 보안 원칙
|
||||
|
||||
| 원칙 | 설명 |
|
||||
|------|------|
|
||||
| 에이전트리스 | 대상 서버에 어떤 소프트웨어도 설치 안 함 |
|
||||
| 최소 권한 | opsagent 계정 사용, root SSH 금지 |
|
||||
| 자격증명 암호화 | AES-256-GCM, API 응답에 노출 절대 금지 |
|
||||
| 외부 API 차단 | 폐쇄망/개방망 모두 외부 LLM API 사용 금지 |
|
||||
| 감사 추적 | 모든 명령·배포는 tb_audit_log에 기록 |
|
||||
|
||||
---
|
||||
|
||||
## 7. 자주 발생하는 오류와 해결 방법
|
||||
|
||||
| 오류 | 원인 | 해결 |
|
||||
|------|------|------|
|
||||
| `Ollama 연결 실패` | Ollama 미설치 또는 중단 | `systemctl restart ollama` |
|
||||
| `Git 클론 실패 (폐쇄망)` | Gitea URL 설정 오류 | `.env`의 `GITEA_URL` 확인 |
|
||||
| `SSH 접속 거부` | opsagent 계정 미생성 또는 키 문제 | 대상 서버에서 `useradd opsagent` |
|
||||
| `빌드 실패` | 의존성 문제 | 빌드 로그 확인: `!status <session_id>` |
|
||||
| `배포 후 헬스체크 실패` | 서비스 기동 지연 | 자동 롤백 → 수동 확인 필요 |
|
||||
@ -58,21 +58,41 @@ export function MemberOnly({ children, feature = '이 기능' }) {
|
||||
const { isLoggedIn, loaded } = useMemberAuth();
|
||||
const navigate = useNavigate();
|
||||
|
||||
if (!loaded) return null;
|
||||
if (!loaded) {
|
||||
return (
|
||||
<div style={{ minHeight: 200, display: 'flex', alignItems: 'center', justifyContent: 'center', color: '#94a3b8' }}>
|
||||
<span>로딩 중...</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (!isLoggedIn) {
|
||||
return (
|
||||
<div className="member-guard" style={{ position:'relative', minHeight:120 }}>
|
||||
{children}
|
||||
<div className="member-guard-overlay">
|
||||
<div className="member-guard-icon">🔒</div>
|
||||
<div className="member-guard-text">{feature}은 회원 전용입니다</div>
|
||||
<div className="member-guard-sub">로그인 후 이용하실 수 있습니다</div>
|
||||
<div style={{
|
||||
minHeight: 260, display: 'flex', flexDirection: 'column',
|
||||
alignItems: 'center', justifyContent: 'center', padding: '40px 24px',
|
||||
background: '#f8fafc', borderRadius: 12, border: '1px solid #e2e8f0',
|
||||
margin: '20px 0', textAlign: 'center', gap: 12,
|
||||
}}>
|
||||
<div style={{ fontSize: 40 }}>🔒</div>
|
||||
<div style={{ fontSize: 16, fontWeight: 700, color: '#1e293b' }}>
|
||||
로그인 또는 회원가입을 하셔야 사용할 수 있는 기능입니다.
|
||||
</div>
|
||||
<div style={{ fontSize: 14, color: '#64748b' }}>
|
||||
{feature} 서비스는 회원 전용입니다.
|
||||
</div>
|
||||
<div style={{ display: 'flex', gap: 10, marginTop: 8 }}>
|
||||
<button
|
||||
onClick={() => navigate('/login')}
|
||||
style={{ marginTop:8, padding:'8px 24px', background:'#1a5fd8', color:'#fff',
|
||||
border:'none', borderRadius:8, cursor:'pointer', fontWeight:600, fontSize:14 }}>
|
||||
로그인 / 회원가입
|
||||
style={{ padding: '10px 28px', background: '#1a5fd8', color: '#fff',
|
||||
border: 'none', borderRadius: 8, cursor: 'pointer', fontWeight: 700, fontSize: 14 }}>
|
||||
로그인
|
||||
</button>
|
||||
<button
|
||||
onClick={() => navigate('/login?tab=register')}
|
||||
style={{ padding: '10px 28px', background: '#fff', color: '#1a5fd8',
|
||||
border: '2px solid #1a5fd8', borderRadius: 8, cursor: 'pointer', fontWeight: 700, fontSize: 14 }}>
|
||||
회원가입
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user