코드 수정 전 전체 구조를 파악해주는 AI 도구 (Understand-Anything)

한국어العربيةDeutschEnglishEspañolFrançaisहिन्दीBahasa Indonesia日本語Русский中文
BBetter Stack
Computing/SoftwareSmall Business/StartupsInternet Technology

Transcript

00:00:00새로운 팀에 합류해 저장소를 복제하고 코드 베이스를 엽니다.
00:00:04그러면 눈앞에 20만 줄짜리 코드 베이스가 펼쳐지고, 마치 길 잃은 사슴처럼 멍해지죠.
00:00:09그래서 모든 개발자가 하는 행동을 똑같이 합니다.
00:00:11grep을 쓰고, 파일을 넘나들고, 아마 Claude에게 이 저장소에 대해 설명해달라고 하겠죠.
00:00:17만약 코드 베이스를 가르쳐주는 실제 대화형 지도가 있다면 어떨까요?
00:00:22흐름, 아키텍처 계층, 변경 사항, 영향도까지, 바로 'Understand Anything'입니다.
00:00:27이미 몇 주 만에 GitHub에서 14,000개 이상의 별을 받았고 많은 개발자가 이야기하고 있죠.
00:00:32있죠.
00:00:33다음 1분 동안 이게 어떻게 작동하는지, 그리고 여러분의 코드 베이스 이해도를
00:00:36얼마나 빠르게 높여줄지 보여드리겠습니다.
00:00:44'Understand Anything'은 오픈 소스 Claude 코드 플러그인입니다.
00:00:47또한 Cursor, Copilot, Gemini CLI 같은 도구들의 워크플로우에도 적용할 수 있습니다.
00:00:53저장소나 지식 베이스를 지정하면, 그 프로젝트를 쿼리 가능한
00:00:58대화형 지식 그래프로 바꿔줍니다.
00:01:00이는 정적 분석과 멀티 에이전트 LLM 처리를 통해 이루어집니다.
00:01:05하지만 중요한 건 기술 스택이 아닙니다.
00:01:07중요한 건 이 도구가 해결하는 본질적인 문제인데, 모든 개발자가 겪는 문제니까요.
00:01:13레거시 코드 베이스나 레거시 앱을 처음 접했을 때입니다.
00:01:16문서는 업데이트가 안 되어 있고요.
00:01:18모든 걸 알고 있던 엔지니어는 6개월 전에 떠났죠.
00:01:22AI 코딩 에이전트는 계속해서 추측만 늘어놓고요.
00:01:26바로 그때 이 도구가 정말 유용해집니다.
00:01:28자, 실행해 보죠.
00:01:29워크플로우를 가속화하는 코딩 도구가 마음에 드신다면 구독해 주세요.
00:01:33항상 새로운 영상이 올라오니까요.
00:01:35여기 중간 규모의 프로젝트가 하나 있습니다.
00:01:36정말 짜증 날 정도로 크지만, 이 도구가 얼마나 멋진지 보여드릴 수 있을 만큼
00:01:40작기도 하죠.
00:01:42Google 마이크로서비스에서 복제한 저장소인데, 억지로 꾸며낼 필요 없이
00:01:46실제로 테스트해 볼 수 있을 만큼 작습니다.
00:01:49먼저 Claude에서 플러그인을 설치하겠습니다. “plugin install, understand-anything”.
00:01:54anything.
00:01:55생성이 완료되면 당연히 플러그인을 다시 로드해야 하고, 그다음엔
00:01:58understand를 실행하면 됩니다.
00:02:00이제 저장소 전체를 스캔하기 시작합니다.
00:02:03구조, 관계, 핵심 모듈, 그리고 비즈니스 개념까지 추출해 냅니다.
00:02:09이제 대시보드 명령어를 실행해서 전체를 시작할 수 있습니다.
00:02:11자, 먼저 이게 실행되는 데 시간이 꽤 걸렸습니다. 한 30분 정도요, 토큰도 엄청나게 썼고요.
00:02:16그래서 좋은 Claude 플랜을 사용하는 게 필수입니다.
00:02:19저는 Claude Max를 사용 중인데, 벌써 한도량의 25%를 썼네요. 엄청나게 소모됩니다.
00:02:24하지만 완료되고 나면 대시보드를 열 수 있는데, 여기서 정말 와닿는 멋진 부분이 나오죠.
00:02:29나옵니다.
00:02:30축소해서 높은 수준의 아키텍처를 볼 수도 있고요.
00:02:32확대해서 내부 구성을 확인할 수도 있습니다.
00:02:35클릭해서 코드 구성과 코드들이 어떻게 연결되어 있는지 볼 수 있죠.
00:02:40심지어 클릭해서 실제 코드도 볼 수 있습니다.
00:02:43그런 다음 “payments” 같은 걸 검색해 봅니다.
00:02:46보통은 라우트, 서비스, 모델, 핸들러를 오가며 이젠 유용하지도 않은 문서들을 뒤졌겠지만,
00:02:52여기선 도구가 조각들을 하나로 모아줍니다.
00:02:56“Guided Tour”를 클릭하면 흐름을 순서대로 보여줍니다.
00:03:01진입점, 유효성 검사, 로직, 데이터베이스, 외부 API, 에러 핸들링까지요.
00:03:07이것만으로도 정말 유용하죠.
00:03:09이 가이드 투어가 모든 걸 세분화해 줍니다.
00:03:11들어가서 다른 구성 요소에 접근할 수도 있고요.
00:03:14그게 “야, 이거 정말 멋진 그래프네”라고 끝나는 것과, “실제 프로덕션 코드를
00:03:18건드리기 전에 한번 확인해 봐야겠다”는 것의 차이죠.
00:03:20하지만 여기서 드는 당연한 의문은, 이런 도구가 이미 있지 않냐는 겁니다.
00:03:25개발자로서, 우리는 더 이상 예쁜 대시보드가 필요한 게 아닙니다.
00:03:29우리는 시간 낭비를 줄이고 싶고, 이 도구는 소프트웨어 개발의 가장 큰 시간 잡아먹는 문제 하나를 해결합니다.
00:03:35컨텍스트를 파악하는 거죠, 맞죠?
00:03:37이게 다 어떻게 연결된 걸까요?
00:03:38어떻게 유용할까요?
00:03:39사람들이 대규모 프로젝트, 레거시 Java 모놀리스, 마이크로서비스 저장소, 수백 개의 파일에 테스트하고 있는데,
00:03:45반응이 제가 느낀 것과 비슷합니다.
00:03:48이 도구는 모든 것을 세분화하고, 연결하며, 어떻게 얽혀 있는지 보여주기 때문에
00:03:53입사 첫 2주를 절약해 줬을 겁니다.
00:03:56그게 첫 번째로 큰 사용 사례인 온보딩입니다.
00:03:58“이 12페이지 읽어보고 궁금한 건 물어봐”라고 말하는 대신, 이미 혼란스러운 건
00:04:03이제 “그래프를 열고 투어를 해봐, 그다음에 더 좋은 질문을 하자”고 할 수 있죠.
00:04:08있죠.
00:04:09자, 두 번째로 정말 좋은 사용 사례는 AI 에이전트입니다. 대부분의 AI 코딩 도구는
00:04:14우리가 제공하는 컨텍스트만큼만 성능을 내니까요.
00:04:17에이전트가 파일 3개만 보면 그냥 추측할 뿐입니다.
00:04:20하지만 도메인, 흐름, 종속성, 그리고 실제 설명이 포함된 구조화된 시스템 맵이 있다면,
00:04:27처음부터 올바른 변경을 할 확률이 훨씬 높아집니다.
00:04:30물론 리팩토링도 있죠.
00:04:32코드를 건드리기 전에 “이 코드는 무엇에 의존하는가?
00:04:36어떤 흐름에 속해 있는가?
00:04:38옮기면 뭐가 깨질까?”라고 물어볼 수 있습니다.
00:04:40그게 바로 한 줄짜리 수정이 대형 사고로 이어지는 걸 막는 방법입니다.
00:04:44개발자들이 이 프로젝트에 열광하는 진짜 이유가 바로 이것입니다.
00:04:48다이어그램을 좋아해서가 아닙니다. 저도 다이어그램은 좋아해요.
00:04:51멋지고 유용하고, 저는 시각적인 걸 좋아하거든요. 하지만 길을 잃는 건 싫어합니다.
00:04:55이제 여기서 주의해야 할 점이 있습니다. 개발자들은 이런 코드 시각화 도구를 전에도 본 적이 있거든요.
00:05:00IDE 그래프, Sourcegraph 스타일 탐색, NX 그래프, Tree-sitter 시각화 도구들까지, 많은 도구가
00:05:05똑같은 문제를 가지고 있었죠.
00:05:09뭘 할까요?
00:05:10구조는 보여주지만 실제 의미는 설명하지 못합니다.
00:05:13이 파일이 저 파일을 import 한다고 알려주죠. 좋긴 한데, 왜 그럴까요?
00:05:18이게 어떤 흐름의 일부일까요?
00:05:19요청은 어디서 시작될까요?
00:05:20바꾸면 무엇이 고장 날까요?
00:05:22그게 빠진 계층입니다.
00:05:24'Understand Anything'은 그 계층을 추가하려고 합니다.
00:05:27그저 타입스크립트 파일 따위로 보여주는 게 아니라, 실제 어떻게 작동하는지
00:05:31그 흐름에 더 가깝게 바꾸려고 노력하는 거죠.
00:05:35그게 여기서 중요한 포인트입니다.
00:05:37파일에서 의미로, import에서 시스템 동작으로, “여기에 조각들이 있다”에서
00:05:42“기계가 어떻게 작동하는지”로 바뀌는 겁니다.
00:05:43많은 LLM이나 RAG 코드 도구와 비교해도 훨씬 시각적이고 배우기 쉽습니다.
00:05:48많은 AI 코드 도구는 기본적으로 그냥 검색창일 뿐이니까요.
00:05:52질문하면 답변을 얻는 식이죠.
00:05:54이건 전체적인 분석을 제공해서, 모든 게 어디로 가는지, 무엇이 얽혀 있는지,
00:06:00어떻게 연결되어 있는지, 우리가 직접 코드를 볼 수 있게 해주면서 알려줍니다.
00:06:04자 이제 사람들이 실제로 무엇을 좋아하는지 이야기해 보죠.
00:06:05분명한 승자는 온보딩이었습니다.
00:06:07대규모 코드 베이스에 합류할 때, 좋은 출발점을 제공해 줍니다.
00:06:12아키텍처 계층도 마찬가지고요.
00:06:13정말 잘 만들어져 있습니다.
00:06:15시스템 수준에서 시작해서 모듈과 구현 세부 사항으로 깊게 파고들 수 있죠.
00:06:20차이점 영향 분석도 큰 장점 중 하나입니다.
00:06:21경험 많은 개발자라면 누구나, 자신이 아직 이해하지 못한 코드 베이스에서
00:06:23작은 변경을 할 때 느끼는 두려움을 알죠.
00:06:27이해하지 못하니까요.
00:06:29Claude Code 사용자에겐 이 그래프가 더 좋은 컨텍스트가 될 수 있습니다. 그래서
00:06:34무작위 파일을 프롬프트에 덤프하는 대신, 구조화된 아키텍처 지식을 에이전트에게 제공하는 거죠.
00:06:39또한 무료이고, MIT 라이선스이며, 점진적이고, 여러 개발 환경에서 작동하도록 설계되었습니다.
00:06:45자, 회의적인 측면에서, 프로젝트가 이렇게 빨리 폭발적으로 성장하면 이런 질문을 하게 됩니다.
00:06:49이게 정말 유용한가, 아니면 그냥 GitHub 알고리즘의 수혜를 입은 건가?
00:06:53물어볼 만한 좋은 질문이죠.
00:06:55또한 LLM 의존성 문제도 있는데, 즉 토큰 비용을 의미합니다.
00:06:59이건 토큰 비용이 엄청나게 발생했습니다.
00:07:02시간도 꽤 걸렸고, 토큰도 많이 들었죠.
00:07:05사용하실 거라면 좋은 플랜을 준비하는 게 좋습니다.
00:07:08여전히 좋은 판단력이 필요합니다.
00:07:09이건 그저 개요를 제공해 줄 뿐이니까요.
00:07:11코드를 직접 읽는 것을 대신해 주지는 않습니다.
00:07:13그저 모든 것이 어떻게 흘러가는지 더 잘 이해하도록 도와줄 뿐입니다.
00:07:16이런 코딩 도구와 팁이 마음에 드신다면 Better Stack 채널을 구독해 주세요.
00:07:20다음 영상에서 뵙겠습니다.

Key Takeaway

Understand Anything은 정적 분석과 LLM으로 레거시 코드의 구조와 비즈니스 흐름을 시각화하여, 개발자의 컨텍스트 파악 속도를 높이고 무분별한 코드 수정을 방지하는 대화형 지식 그래프 도구이다.

Highlights

  • Understand Anything은 코드 베이스를 쿼리 가능한 대화형 지식 그래프로 변환해 복잡한 시스템의 구조와 흐름을 시각화한다.

  • 정적 분석과 멀티 에이전트 LLM을 활용해 파일 간의 단순한 import 관계를 넘어 실제 비즈니스 로직과 데이터 흐름을 추적한다.

  • 코드 베이스를 분석하는 과정에서 상당한 양의 토큰이 소모되므로 고성능 Claude 플랜 사용이 필수적이다.

  • 온보딩 시 문서를 대체하는 가이드 투어를 제공해 새로운 코드 베이스 적응 시간을 단축한다.

  • 변경 사항의 영향도를 미리 분석해 리팩토링 시 발생할 수 있는 대형 사고를 방지한다.

Timeline

코드 베이스 분석의 본질적인 문제와 Understand Anything

  • 대규모 코드 베이스를 처음 접할 때 겪는 파악의 어려움을 해결한다.
  • 정적 분석과 멀티 에이전트 LLM 처리를 결합해 지식 그래프를 구축한다.
  • 문서가 최신화되지 않았거나 담당자가 부재한 상황에서 유용하다.

새로운 환경에서 수만 줄의 코드를 접할 때 개발자는 grep이나 단순 추측에 의존하는 경우가 많다. 이 도구는 프로젝트를 대화형 지식 그래프로 변환해 아키텍처 계층과 변경 영향도를 명확히 보여준다. 기술 스택 자체보다는 업데이트되지 않은 문서와 AI의 추측성 응답으로 인해 발생하는 실무적인 어려움을 해결하는 데 초점을 맞춘다.

도구 설치 및 시각적 대시보드 활용법

  • Claude 플러그인을 통해 설치하고 스캔 명령어로 저장소 전체를 분석한다.
  • 시각화된 대시보드를 통해 높은 수준의 아키텍처부터 구체적인 코드 연결까지 탐색한다.
  • 가이드 투어 기능으로 진입점부터 에러 핸들링까지의 로직 흐름을 순서대로 확인한다.

Claude Code 환경에서 플러그인을 설치하고 understand 명령어를 실행하면 저장소의 구조, 관계, 비즈니스 개념이 추출된다. 분석에는 상당한 시간과 토큰이 소요되므로 충분한 사용량 제한이 있는 플랜 사용이 필요하다. 완료 후 제공되는 대시보드는 코드 간의 상호작용을 클릭 한 번으로 시각화하며, 가이드 투어는 특정 기능의 동작 방식을 단계별로 보여준다.

실제 활용 사례 및 기술적 차별점

  • 신규 입사자의 온보딩 과정을 단축하고 더 깊이 있는 질문을 유도한다.
  • 구조화된 시스템 맵을 AI 에이전트에 제공해 더 정확한 코드 변경을 수행한다.
  • 단순한 파일 시각화를 넘어 시스템의 동작과 의미 계층을 설명한다.

기존 시각화 도구들이 파일 간 import 관계만 보여주는 것과 달리, 이 도구는 변경 시 무엇이 고장 날지 등 의미 있는 정보를 제공한다. 코드 수정 전 의존성을 파악해 리팩토링 안전성을 높이는 데 핵심적인 역할을 한다. 다만 코드를 직접 읽는 행위를 완전히 대체할 수는 없으며, 여전히 개발자의 판단력이 중요한 보조 도구로 사용된다.

Community Posts

No posts yet. Be the first to write about this video!

Write about this video