AI 코드 문서화 데모

프롬프트 하나로 생성된 코드를 Doklo가 분석하여구조화된 문서와 7종 산출물을 자동으로 만듭니다.

Doklo Pipeline
프롬프트
자연어 요청
AI 코딩
코드 생성
Doklo 분석
AST 파싱
대시보드
Dok 구조
문서 생성
7종 Spoke
Live Sync Demo

코드가 바뀌면, 문서도 바뀝니다

코드 변경을 감지하고 Dok 문서를 자동으로 업데이트합니다

시나리오: 우선순위를 3단계에서 5단계로 확장
page.tsx
type Priority = 'high' | 'medium' | 'low';
 
const PRIORITY_CONFIG = {
high: { label: '높음', color: 'red' },
medium: { label: '보통', color: 'yellow' },
low: { label: '낮음', color: 'green' },
};
📄Dok 문서
BR-TODO-007-01
우선순위는 낮음 → 보통 → 높음 순서로 순환한다
BR-TODO-007-02
높음은 빨간색, 보통은 노란색, 낮음은 초록색으로 표시한다
인수조건
우선순위 라벨 클릭 시 다음 단계로 변경된다
프롬프트
“Next.js + Tailwind로 할 일 관리 앱을 만들어줘”
✅

Todo App

할 일 관리앱 보기
8 Doks|25 규칙|33 인수조건|7 Spokes
Dok을 선택하세요
왼쪽 트리에서 Dok을 클릭하면 상세 정보가 표시됩니다
프롬프트
“Next.js + Tailwind로 날씨 대시보드를 만들어줘”
🌤️

Weather Dashboard

날씨 대시보드앱 보기
10 Doks|36 규칙|44 인수조건|7 Spokes
Dok을 선택하세요
왼쪽 트리에서 Dok을 클릭하면 상세 정보가 표시됩니다
프롬프트
“Next.js + Tailwind로 미니 블로그를 만들어줘”
📝

Mini Blog

미니 블로그앱 보기
10 Doks|31 규칙|40 인수조건|7 Spokes
Dok을 선택하세요
왼쪽 트리에서 Dok을 클릭하면 상세 정보가 표시됩니다

코드만 있으면, 나머지는 Doklo가 합니다.

Doklo 더 알아보기