Google AI Studio로 AI 코드 분석기 구축 (그리고 Cursor에서 마무리)
Source: Dev.to
번역을 진행하려면 번역하고자 하는 전체 텍스트를 제공해 주세요. 텍스트를 주시면 요청하신 대로 한국어로 번역해 드리겠습니다.
내가 만든 것
Archlyze는 Google Gemini를 사용해 소스 코드를 분석하는 브라우저 전용 SPA입니다(Rust, Python, JS/TS, Go 등). 컴포넌트와 의존성을 추출하고, 심각도와 함께 이슈를 표시하며, 수정 방안과 단위 테스트를 제안하고, Gemini를 통해 흐름도/UML/데이터 흐름 다이어그램을 생성합니다. 우리는 AI Studio에서 상세 프롬프트로 시작하고(Perplexity와 Gemini으로 다듬음), 이후 Cursor에서 폴더 가져오기, .gitignore 파싱, 세션 히스토리, 모델 선택, Markdown 내보내기 등을 추가하며 앱을 완성하고 확장했습니다.
데모
실시간 데모:
My Experience
Starting in AI Studio
우리는 먼저 다양한 모델(Perplexity와 Gemini)로 개념과 프롬프트를 초안하고, 이를 Google AI Studio에 가져가 첫 번째 버전을 구축했습니다. 초기 단계에서 반복적으로 발생한 문제는 React와 툴링 버전이었으며, 생성된 앱이 실행이나 빌드에 계속 실패해 작업이 여러 차례(10회 이상) 반복된 끝에야 정상적인 설정을 얻을 수 있었습니다.
The Prompt
Build 'RustFlow Analyzer'—a web app for comprehensive Rust file analysis. Users upload a .rs file (max 500 lines) or paste code.
Gemini 1.5 Pro performs deep analysis: extract all functions, structs, traits, impls; map dependencies and call relationships; identify ownership patterns, error handling, and common anti-patterns (unnecessary clones, unwrap() abuse, missing lifetimes).
Display results in three panels:
Code View: Original code with syntax highlighting (Monaco editor), clickable line numbers to jump to explanations
Analysis Panel: Collapsible sections for each major code block (functions/structs) with plain-English explanations, detected issues marked with warning/error badges, and best-practice suggestions
Visual Panel: Use Imagen to generate architecture diagrams—function call graphs (boxes + arrows showing invocation flow), struct relationship diagrams (ownership/borrowing visualized with solid/dashed lines), and module dependency trees. Include toggle buttons for diagram types (flowchart, UML, data flow). Style: professional developer docs aesthetic, Rust brand colors (orange #CE422B, dark gray), clean minimalist lines.
Features: file upload (.rs), smart truncation warning if >500 lines, 'Regenerate Diagram' button for each section, export full report as HTML with embedded images, dark/light theme, example files (basic HTTP server, CLI parser, async tokio app). Add 'Share Analysis' to generate unique URL with results cached. Loading states with progress indicators, error handling for invalid Rust syntax or oversized files. Deploy-ready SPA with responsive mobile layoutEvolving the Idea
기본 구조를 안정화한 뒤, 우리는 Rust 전용에서 다중 언어 지원으로 확장하고 폴더 가져오기, .gitignore 인식 필터링, 세션 히스토리, 의존성 탐지, 이슈 심각도, 자동 수정, 단위 테스트 생성, 다양한 다이어그램 유형 등 기능을 추가했습니다. Cursor는 같은 코드베이스를 리팩터링하고 확장하는 데 큰 도움이 되었으며, AI Studio는 초기 구조와 Gemini 통합을 제공했고, Cursor는 복잡성이 증가함에 따라 코드 일관성을 유지하도록 도와주었습니다.
Structured Output and “Thinking” Models
가장 큰 기술적 교훈은 엄격한 JSON 스키마에 의존한 분석이었습니다. responseSchema에 명시적인 required 필드와 명확한 설명이 없으면 Gemini 2.5가 최소한이거나 일관성 없는 JSON을 반환하곤 했습니다. 스키마를 제대로 정의하면 UI(컴포넌트, 이슈, 의존성)를 구동할 만큼 분석 결과를 신뢰할 수 있게 되었습니다. 또한 Gemini 2.5의 “thinking” 단계가 응답 시간을 늘린다는 점을 깨달아 스케일된 타임아웃(예: 작은 파일은 60 s, 큰 파일은 180 s)과 로딩 상태를 추가해 모델이 추론 중일 때 끊어진 느낌을 최소화했습니다.
Surprises
- 앱이 전적으로 백엔드 없이 동작한다는 점—API 키가 브라우저에 저장되고 직접 Gemini에 호출되며, LocalStorage가 설정과 테마를 관리해 아키텍처가 매우 단순합니다.
- 이미지 생성(
gemini-2.5-flash)이 매끄럽게 통합돼, 실시간으로 다이어그램을 생성할 수 있습니다.
전체적으로 이 트랙은 “아이디어 + 프롬프트” 단계에서 실제 SPA까지 이어지는 견고한 경로를 제공했습니다: AI Studio를 활용한 빠른 프로토타이핑.
및 Gemini 통합, 그 다음 Cursor를 사용하여 이를 견고하게 만들고 확장하여 사용 가능한 제품으로 만든다.