Claude 코드 (튜토리얼): Anthropic의 새로운 무료 AI 코더는 미쳤다! (RIP Cursor)

AICodeKing 구독자 71,200명

요약

이 영상은 Claude의 최신 3.7 Sonnet 모델과 함께 출시된 Claude Code라는 터미널 기반 AI 코딩 도구를 소개합니다. 해당 도구는 코드 편집, 버그 수정, 테스트 실행 및 Git 관련 작업 등 다양한 개발 업무를 자연어 명령으로 지원하여 개발 환경의 워크플로우를 간소화합니다. 영상에서는 설치 방법부터 초기 설정, 코드베이스 분석과 실시간 디버깅, diff 승인 및 ESLint 문제 해결까지 실제 사례를 통해 상세히 시연됩니다. 또한 경쟁 도구들과의 차별성과 향후 개선 방향에 대해 설명하면서 개발자들에게 유용한 팁과 인사이트를 제공합니다.

주요 키워드

Claude Code 3.7 Sonnet 터미널 API 크레딧 ESLint PR 리뷰 Git 코드 리팩토링 자연어 명령

하이라이트

🔑 Claude가 최신 3.7 Sonnet 모델과 함께 강력한 기능을 갖춘 Claude Code 도구를 선보임.
🚀 Claude Code는 터미널 기반 인터페이스를 통해 자연어 명령으로 코드 편집, 파일 작업, 버그 수정 등을 지원합니다.
🌟 간단한 설치 명령어와 Anthropic 계정 로그인, 무료 API 크레딧을 통한 초기 설정 과정을 자세히 안내합니다.
📌 실시간으로 코드베이스를 분석하고 diff를 생성하여, 코드 변경사항 승인을 통해 실제 개발 프로세스를 효율화합니다.
⚡️ Git 히스토리 검색, PR 리뷰, ESLint 점검 및 그에 따른 수정 작업 등 다양한 Git 및 코드 관리 기능을 통합함을 강조합니다.
🚀 밝기 및 노출 슬라이더의 미리보기 문제와 서버 실행 이슈 등 실제 사용 시 발생할 수 있는 문제를 해결하는 과정을 시연합니다.

용어 설명

3.7 Sonnet 모델

Claude가 새롭게 선보인 모델로, 사고, 추론, 코딩 및 다양한 작업을 수행할 수 있는 AI 기반 모델입니다.

Claude Code

개발자가 터미널 내에서 자연어 명령을 통해 코드 작업, 파일 관리, 버그 수정 등을 할 수 있도록 지원하는 AI 코딩 도구입니다.

터미널 (CLI)

명령어 기반 인터페이스로, 사용자가 직접 명령어를 입력하여 프로그램이나 시스템과 상호 작용하는 환경을 의미합니다.

API 크레딧

Anthropic 플랫폼에서 제공하는 무료 사용량 크레딧으로, Claude Code 및 관련 AI 서비스를 사용하기 위한 초기 자원을 말합니다.

ESLint (린팅)

자바스크립트 코드의 문법 오류나 스타일 문제를 자동으로 검사하고 수정하는 도구입니다.

PR (Pull Request) 리뷰

GitHub 등 버전 관리 시스템에서 코드 변경 사항을 검토하고 승인 또는 수정 요청을 하는 프로세스를 의미합니다.

영상은 Claude의 최신 3.7 Sonnet 모델과 Claude Code 도구를 간략히 소개합니다. 모델의 뛰어난 추론 및 코딩 기능에 대해 설명합니다.

[00:05] Claude가 새로운 3.7 소넷 모델을 출시했으며, 이는 현재 AI 벤치마크에서 최고 성능을 보이고 있습니다.

[00:26] Claude Code가 출시되었으며, 이는 AI를 활용한 코딩 도구로 GitHub Copilot과 유사한 기능을 제공합니다.

Claude Code가 터미널 기반의 인터페이스를 통해 자연어 명령으로 파일 작업, 코드 편집, 버그 수정 등 다양한 기능을 제공함을 안내합니다. 도구의 주요 옵션과 설정 메뉴에 대해서도 설명합니다.

[00:48] 현재 연구 프리뷰 단계로, 선착순 무료 제공되며 API 크레딧이 필요합니다. 웹사이트에서 5달러 무료 크레딧을 받을 수 있습니다.

[01:09] 터미널 기반 에이전트 코딩 도구로, 코드베이스 이해와 자연어 명령을 통한 빠른 코딩을 지원합니다.

[01:41] 파일 편집, 버그 수정, 코드 분석, 테스트 실행, git 작업 등 다양한 기능을 제공합니다.

간단한 설치 명령어 실행 후, Anthropic 계정으로 로그인하고 API 크레딧을 활용하여 Claude Code를 활성화하는 과정을 보여줍니다. 초기화 시 생성되는 CLA 마크다운 파일과 문서화 기능이 소개됩니다.

[02:04] 간단한 설치 방법과 Anthropic 계정 로그인으로 바로 사용 가능합니다.

[02:33] 인터페이스 소개와 clear, compact, config, cost, doctor 등 기본 명령어들의 기능을 설명합니다.

[03:42] Claude Code의 기본 명령어들을 소개합니다. help로 도움말을 확인하고, init으로 문서화를 시작할 수 있으며, PR comments와 review 기능으로 GitHub 작업을 관리할 수 있습니다.

[04:32] T3 스택으로 만든 이미지 편집 프로젝트를 테스트합니다. 사진 업로드, 크롭, 밝기와 노출 조절 기능이 있는 앱입니다.

T3 스택 기반 프로젝트를 예시로, 이미지 크로퍼 페이지를 메인으로 전환하는 코딩 작업을 시연합니다. diff 생성, 승인, ESLint 검사 및 쉘 명령 실행 과정을 통해 코드 리팩토링 절차를 설명합니다.

[05:06] init 명령어로 프로젝트 문서화를 시작하고, 메인 페이지를 이미지 크로퍼로 변경하는 복잡한 작업을 Claude에게 요청합니다.

[06:24] ESLint 오류가 발생했지만 Claude가 이를 비활성화하여 해결하고, 서버 실행까지 성공적으로 완료했습니다.

밝기 및 노출 슬라이더의 미리보기 문제와 서버 실행에 따른 이슈 등 실제 문제 해결 과정을 보여줍니다. 마지막으로 전반적인 워크플로우를 검토하며 시청자에게 의견을 요청합니다.

[07:29] 밝기와 노출 슬라이더의 미리보기 기능을 개선하여 한 번에 성공적으로 구현했습니다.

[00:05] 안녕하세요, 새로운

[00:07] 영상에 오신 것을 환영합니다. Claude가 새로운

[00:10] 3.7 소넷 모델을 출시했는데요,

[00:14] 이 모델은 추론과 사고가 가능하며

[00:16] 정말 멋진 기능들을 갖추고 있습니다. 현재

[00:20] AI 모델 중에서

[00:21] 벤치마크 최고 성능을 보이고 있죠.

[00:24] 그리고 이와 함께 출시된 것이

[00:26] 바로 Claude Code입니다. Claude Code는 무엇일까요?

[00:30] 이것은 Anthropic이 만든 새로운 도구로

[00:33] AI를 활용해 코딩할 수 있게 해줍니다.

[00:36] 레포지토리에서 바로 시작할 수 있고

[00:38] 코딩을 시작할 수 있죠. GitHub Copilot을 사용해보셨다면

[00:42] 매우 비슷하다고 느끼실 겁니다.

[00:45] 현재는 연구 프리뷰 단계이고

[00:47] 사용이

[00:48] 제한적입니다. 이 영상을 만드는 시점에

[00:51] 선착순으로 사용 자격을

[00:54] 부여하고 있으며 무료입니다.

[00:57] 다만 API 크레딧이 필요한데

[01:00] 웹사이트에서 5달러 무료 크레딧을

[01:03] 받을 수 있습니다. 자세히 살펴보면

[01:06] 이들은 이것이

[01:09] 터미널에서 작동하는 에이전트 기반 코딩 도구로

[01:12] 코드베이스를 이해하고

[01:15] 자연어 명령을 통해 더 빠른

[01:17] 코딩을

[01:18] 도와준다고 설명합니다.

[01:20] Claude Code는 개발 환경과 직접 통합되어

[01:24] 추가 서버나

[01:26] 복잡한 설정 없이

[01:28] 워크플로우를 간소화합니다. 기본적으로

[01:31] 터미널이나 명령줄 인터페이스로

[01:34] 프롬프트를 입력하면 파일 조작과

[01:37] 다양한 작업을 수행할 수 있는데

[01:39] 정말 인상적입니다.

[01:41] 주요 기능으로는 파일 편집과

[01:44] 코드베이스 전반의 버그 수정,

[01:47] 코드 아키텍처와 로직에 대한

[01:49] 질문 답변, 테스트 실행 및 수정,

[01:53] 린팅과 기타 명령어 실행,

[01:56] git 히스토리 검색,

[01:58] 머지 충돌 해결,

[02:02] 커밋과 PR 생성이

[02:04] 있습니다. 설치는 매우 간단한데,

[02:08] 이 명령어를 실행하면

[02:10] Claude Code가 설치됩니다. 그 다음

[02:14] 작업하고 싶은 폴더로 이동해서

[02:16] claude 명령어만 실행하면 됩니다.

[02:19] 처음에는 Anthropic 계정으로 로그인해야 하고

[02:22] 그러면 바로

[02:25] 활성화됩니다.

[02:26] 이제 어떻게 사용하는지

[02:29] 사용법과 작동 방식을 보여드리겠습니다.

[02:32] 자,

[02:33] 이것이 인터페이스입니다. 매우 단순한데

[02:37] 원하는 작업에 대한 프롬프트를

[02:40] 입력하면 실행됩니다.

[02:43] 하지만 그전에 먼저

[02:46] 어떤 기능들이 있는지 살펴보겠습니다. 여기

[02:49] clear 옵션이 있는데, 이는 대화

[02:52] 기록을 지우고 컨텍스트를

[02:55] 초기화합니다. compact 옵션도 있는데

[02:59] 이는 컨텍스트를 제거하지만

[03:01] 나중을 위해 컨텍스트 요약을

[03:04] 유지하는 기능으로

[03:07] 유용합니다. 다음으로

[03:10] config 옵션이 있습니다. 열어보면

[03:14] 다음과 같은 옵션들이 있는데

[03:15] verbose 모드, 테마, 알림이

[03:19] 있습니다. 모두 이름 그대로의

[03:22] 기능이죠. ESC를 누르면

[03:24] 닫힙니다.

[03:25] 그 다음 cost 옵션이 있는데

[03:29] 세션의 총 비용을

[03:31] 확인할 수 있습니다. 이는

[03:34] Claude가

[03:36] 비싸기 때문에 유용하죠. doctor도 있는데

[03:39] Claude Code의 상태를 점검합니다.

[03:42] 설치가 제대로 되었는지

[03:44] 설치 상태를

[03:45] 확인할 수 있습니다. help 명령어로는

[03:48] Claude Code에 대한 세부 정보를 볼 수 있고

[03:51] init 명령어를 사용하면

[03:53] 코드베이스의 문서화를 위한 Claude 마크다운 파일을

[03:56] 초기화할 수 있습니다.

[03:57] 이렇게 하면

[03:59] 코드베이스의 적절한 문서화를

[04:01] 항상 유지할 수 있고 Claude가

[04:04] 어떤 작업을 하는지 알 수 있죠. PR comments로는

[04:08] PR(Pull Request)를 검토할 수 있고

[04:11] 이를 처리할 수 있는데, 이는 매우

[04:13] 유용합니다. 버그 제보도

[04:17] 여기서 가능하고, review 옵션으로는

[04:20] GitHub의 Pull Request를

[04:23] 대신 검토하여 병합 여부를

[04:25] 알려주는데, 이는 매우

[04:28] 유용합니다. 로그아웃과 로그인

[04:31] 기능도 있습니다.

[04:32] 이제 실제로 사용해 보겠습니다.

[04:34] 제가 가진 이 레포지토리는 T3 스택으로 만들어졌고

[04:39] 기본적으로 하나의 페이지로 되어 있는데

[04:42] 사진을 업로드하고 자르기가 가능하며

[04:45] 밝기와 노출도

[04:47] 조절할 수 있습니다.

[04:49] 이제 이 프로젝트가 무엇인지

[04:52] 분석해달라고 요청해보겠습니다.

[04:55] 프롬프트를 보내면

[04:57] 잘 작동하는 것을 볼 수 있고, 속도도 빠른데

[05:00] 이는 정말 좋습니다.

[05:02] 그들이 추천하는 한 가지는

[05:06] init 명령어를 실행하는 것입니다. 이는

[05:08] Claude 마크다운 파일을 생성하는데, 여기에는

[05:11] 레포지토리에 대한 상세 정보가 포함되며

[05:14] 일종의 문서가 됩니다.

[05:16] 파일을 생성할 때는 변경사항을 보여주고

[05:19] 필요에 따라 승인을 요청하거나

[05:21] 취소하고 Claude에게 다른 방식으로

[05:24] 수정을 요청할 수도 있는데, 이는

[05:27] 매우 좋은 기능입니다.

[05:29] 이제 완료되었고 잘 처리되었네요.

[05:33] 이제 코딩도 한번 시켜보겠습니다.

[05:37] 이 앱은 T3 스택 기반이고

[05:39] 기본 페이지가 있는데, 이건 필요없어서

[05:43] 기본 페이지 대신

[05:45] 이미지 크로퍼를 메인 페이지로 만들어달라고 하겠습니다.

[05:49] 이는 까다로운 작업인데

[05:52] 파일을 삭제하고, 수정하고

[05:54] 라우트를 변경해야 하기 때문입니다.

[05:57] 많은 개발자들이 이런 작업을

[05:59] 어려워합니다. 요청을 보내면

[06:02] 코드를 분석하기 시작하는데

[06:04] 코드 파일들을 읽어보는 것을 알 수 있습니다.

[06:07] 완료될 때까지 기다려보죠.

[06:11] 이제 변경사항을 보여주는데

[06:13] 올바른 것 같아 승인해보겠습니다.

[06:17] 이제 린팅을 확인하기 위해

[06:19] 쉘 명령어를 실행하려고 하네요.

[06:22] 좋은 시도지만

[06:24] 오류가 발생할 것 같습니다. 네, 발생했네요.

[06:28] 어떻게 해결하는지 보죠.

[06:30] 이제 수정을 시도하고 있습니다.

[06:33] 해결할 수 있을지 보겠습니다... 안되네요.

[06:37] 다시 시도하고 있습니다.

[06:40] 이제 저처럼 ESLint를 비활성화하려고 하네요.

[06:44] 마음에 듭니다. Claude가 저랑 비슷해요.

[06:47] ESLint를

[06:48] 비활성화하려고 하네요. 이제 서버를

[06:52] 실행하려고 하는데, 이건

[06:54] 좀 논란의 여지가 있습니다.

[06:56] 여기서 서버를 실행하면

[06:58] 프로세스가 멈출 것 같은데

[07:01] 역시나

[07:03] 그렇네요. 어쨌든

[07:07] 3000번 포트에서 실행되어야 하는데, 맞네요.

[07:11] 이건

[07:12] 잘 처리했습니다.

[07:14] 메인 페이지가 이제 크로퍼가 되었고 잘 작동하네요.

[07:19] 좋습니다. 많은 개발자들이

[07:21] node_modules를 삭제하거나

[07:24] 이상한 방식으로

[07:25] 처리하는데, 이건 합격입니다.

[07:29] 하나 문제가 있는데

[07:33] 밝기와 노출 슬라이더가

[07:34] 미리보기를 보여주지 않아서

[07:37] 아쉽네요. Claude에게 수정을 요청해보겠습니다.

[07:41] 요청하자 여러 수정사항을 제안했고

[07:43] ESLint 체크는 토큰을

[07:46] 아끼기 위해 건너뛰었습니다.

[07:48] 이제 완료되었고 한 번에

[07:51] 잘 작동하네요.

[07:53] 이미지 렌더링이 필요한

[07:56] 복잡한 작업인데도 잘 처리했습니다.

[07:59] 이렇게 사용할 수 있고, 잘 작동하며

[08:02] Git 관련 옵션들도 사용할 수 있는데

[08:05] 코드 리뷰 같은 기능들이

[08:07] 모두 훌륭합니다. 이것은 실제로

[08:10] 매우 인상적이며

[08:13] Aider나 Klein 같은 도구들과

[08:16] 경쟁력이 있습니다. 전반적으로 아주 좋네요.

[08:18] 자, 이제

[08:22] 아래에 의견을 남기고 구독해주세요.

[08:24] Super Thanks 옵션으로 후원하거나

[08:26] 채널 멤버가 되어 특별한 혜택을

[08:29] 받으실 수 있습니다. 다음 영상에서

[08:30] 만나요. 안녕히 계세요!