이번 주에는 로컬 LLM(Ollama)을 활용한 KRDS 에이전트 앱의 미리보기 기능을 중심으로 디버깅과 구조 개선 작업을 진행했다. 코드 생성 자체는 정상적으로 이루어지고 있었으나, iframe 기반 미리보기 영역에서 화면이 표시되지 않는 문제가 반복적으로 발생해 원인 분석에 집중했다. 문제의 핵심은 KRDS CSS 용량과 렌더링 방식에 있었으며, 이를 해결하기 위한 구조 조정과 함께 LLM 출력 품질 개선 작업도 병행했다. 해당 프로그램 제작 프로젝트는 이번 주 작업을 기준으로 하나의 실험 단위로 정리 및 마무리했다.

대용량 KRDS CSS를 iframe srcDoc에 그대로 주입할 경우 렌더링이 실패한다는 점을 확인했고, CSS 용량을 제한한 뒤 필수 컴포넌트 스타일을 별도로 명시하는 방식으로 미리보기 화면을 안정화했다. 이 과정에서 인풋 및 버튼 스타일 누락 문제도 함께 해결되었다. 또한 로그인 폼, 카드 그리드, 챗봇 화면 등 주요 UI 패턴을 few-shot 예시로 추가해 LLM이 KRDS 구조를 보다 일관되게 따르도록 개선했다. 설치 파일 생성과 관련해서는 용량, 라이선스, 운영 복잡성 이슈를 종합적으로 검토한 결과 현 단계에서는 보류하는 것으로 정리했다.

iframe 환경에서는 CSS 용량과 주입 방식이 렌더링 안정성에 직접적인 영향을 미친다는 점을 명확히 체감했다. 디자인 시스템을 LLM 출력에 반영할 때는 추상적인 지시보다 실제 화면 단위의 구체적인 예시가 결과 품질에 훨씬 큰 영향을 준다는 점도 확인할 수 있었다. 또한 로컬 LLM 기반 애플리케이션은 개발과 실험 단계에서는 유용하지만, 배포 단계로 넘어갈 경우 기술 외적인 고려 요소가 급격히 늘어난다는 한계도 분명해졌다. 이번 프로젝트는 완성도를 일정 수준까지 끌어올린 실험 단위로서 의미 있게 마무리되었다고 판단한다.

로컬 환경에서는 Ollama를 기반으로 deepseek-coder 모델을 사용했으며, Electron과 React를 활용해 데스크톱 앱 형태로 구성했다. 미리보기 영역은 iframe srcDoc 방식을 사용했고, UI 가이드는 KRDS 디자인 시스템을 기준으로 삼았다. LLM 출력 품질 개선을 위해 few-shot prompting 방식을 적용했으며, 개발 과정 전반에서 Electron DevTools를 활용해 렌더링 및 스타일 문제를 점검했다.

다음 주에는 기존 프로그램 제작 프로젝트와는 별도로, Claude Code를 활용한 신규 실험을 진행할 예정이다. 최근 공개된 Claude Teams의 Agent Teams 기능을 중심으로, 에이전트 단위 협업 구조와 역할 분리 방식이 실제 개발 워크플로에 어떤 변화를 줄 수 있는지 살펴볼 계획이다. 이번 실험은 결과물 제작보다는 도구 자체의 가능성과 사고 방식 차이를 검증하는 데 목적을 두고 진행할 예정이다.