이제 Google 검색을 통한 그라운딩 기능을 사용할 수 있습니다. 자세히 알아보기

이 페이지는 Cloud Translation API를 통해 번역되었습니다.

Pipet Code Agent로 AI 코드 어시스턴트 빌드

코드 작성은 보람도 있으면서도 만족스러울 수 있지만, 동료를 위해 발표할 수 있도록 일하는 일은 종종 힘든 일입니다. 인공 인텔리전스 생성 모델은 코드 주석을 추가하고 다른 여러 작업을 수행하여 코딩 워크플로가 더 쉬워집니다.

이 가이드에서는 Pipet 코드 에이전트, Google Cloud의 AI 개발자 관계팀이 개발한 AI 기반 코드 지원 도구인 Google 이 오픈소스 프로젝트는 Microsoft Visual Studio의 확장 프로그램입니다. Code (VS Code)는 코멘트 달기와 같이 중요하지만 덜 재미 있는 코딩 작업을 처리할 수도 있습니다. 실수를 찾고 개선사항을 제안할 수 있습니다. 확장 프로그램은 Gemini API에 코딩 지원 요청을 보내고 응답을 코드를 편집할 수 있습니다.

피펫을 수정할 수 있습니다. 기존 함수를 더 잘 작동하도록 하거나 개발 워크플로를 더 효과적으로 지원할 수 있습니다

통계를 포함한 프로젝트 개요 및 확장 방법에 대한 동영상 보기 개발자들이 직접 확인해 보고 AI Code Assistant - Build with Google AI를 참고하세요. 아니면 안내에 따라 프로젝트 확장을 시작할 수 있습니다. 참조하세요.

프로젝트 설정

이 안내에서는 Pipet Code Agent 프로젝트를 설정하는 과정을 안내합니다. 사용할 수 있습니다 일반적인 단계는 몇 가지 기본 요건 설치입니다. 몇 가지 환경 변수 설정, 코드에서 프로젝트 클론 구성 설치 실행을 지원합니다

기본 요건 설치

Pipet Code Agent 프로젝트는 Microsoft Visual Studio의 확장 프로그램으로 실행됩니다. 살펴보고 Node.js 및 관리할 npm 도구 애플리케이션을 실행할 수 있습니다 다음 설치 지침은 리눅스 호스트 머신입니다.

필수 소프트웨어를 설치하려면 다음 단계를 따르세요.

Visual Studio Code 설치 할 수 있습니다.
설치에 따라 node 및 npm를 설치합니다. 안내를 따르세요.

프로젝트 클론 및 구성

프로젝트 코드를 다운로드하고 npm 설치 명령어를 사용하여 다운로드합니다. 필요한 종속 항목을 삭제하고 프로젝트를 구성할 수 있습니다 요구사항 git 소스 제어 소프트웨어에서 프로젝트 소스 코드

프로젝트 코드를 다운로드하고 구성하려면 다음 안내를 따르세요.

다음 명령어를 사용하여 git 저장소를 클론합니다.
```
git clone https://github.com/google/generative-ai-docs
```
원하는 경우 스파스 체크아웃을 사용하도록 로컬 git 저장소를 구성합니다. 이렇게 하면 Docs 에이전트 프로젝트의 파일만 있게 됩니다.
```
cd generative-ai-docs/
git sparse-checkout init --cone
git sparse-checkout set examples/gemini/node/pipet-code-agent/
```
Pipet Code Agent 프로젝트 루트 디렉터리로 이동합니다.
```
cd generative-ai-docs/examples/gemini/node/pipet-code-agent/
```
설치 명령어를 실행하여 종속 항목을 다운로드하고 프로젝트를 구성합니다.
```
npm install
```

확장 프로그램 구성 및 테스트

이제 개발 확장 프로그램이 있어야 합니다. 테스트는 별도의 VS를 엽니다. 새 확장 프로그램을 사용할 수 있는 코드 Extension Development Host 창 이 새 창에서 확장 프로그램이 Google Gemini API를 사용해 보세요

확장 프로그램 개발 호스트 창에서 실행되는 Pipet 코드 에이전트 그림 1. Pipet이 표시된 VS Code Extension Development Host 창 확장 명령어와 함께 사용할 수 있습니다.

설정을 구성하고 테스트하려면 다음 단계를 따르세요.

VS Code 애플리케이션을 시작합니다.
VS Code에서 File > 새 창을 클릭합니다.
파일 > 폴더 열기, pipet-code-agent/ 폴더를 선택합니다.
pipet-code-agent/package.json 파일을 엽니다.
실행 > 디버깅 시작을 클릭합니다. 이 단계를 따르면 별도의 VS Code Extension Development Host 창이 열립니다.
Code > 설정 > 설정을 탭합니다.
Google Gemini API 키를 가져옵니다. 사이트로 이동하여 키 문자열을 복사하세요.
API 키를 구성 설정으로 설정합니다. 검색 설정에서 입력란에 pipet을 입력하고 사용자 탭을 선택한 다음 Google > Gemini: API 키 설정에서 settings.json에서 수정 링크를 클릭하고 Gemini API 키:
```
"google.gemini.apiKey": "your-api-key-here"
```
settings.json 파일의 변경사항을 저장하고 설정 탭을 닫습니다.

확장 프로그램 명령어를 테스트하려면 다음 안내를 따르세요.

VS Code Extension Development Host 창에서 코드를 선택합니다. 를 클릭합니다.
보기 > 명령어 팔레트
명령어 팔레트에서 Pipet를 입력하고 다음 명령어를 사용하여 명령어 중 하나를 선택합니다. 입력합니다.

기존 명령어 수정

Pipet Code Agent에서 제공되는 명령을 수정하는 것이 확장 프로그램의 동작과 기능을 변경합니다. 댓글과 검토 명령을 사용하여 퓨샷 프롬프팅은 예시와 그 코드에 대한 주석뿐 아니라 AI 생성 모델에 대한 일반적인 지시사항입니다. 이 프롬프트 맥락 정보는 Gemini 생성 모델이 대답을 형성하는 과정을 안내합니다. 작성자: 댓글이나 예시 또는 둘 다를 변경하여 명령어를 검토하고 각 기존 명령어가 작동하는 방식을 변경할 수 있습니다.

이 안내에서는 다음과 같이 review.ts 명령어를 수정하는 방법을 설명합니다. 변경할 수 있습니다

review.ts 명령어 수정을 준비하려면 다음 안내를 따르세요.

VS Code 애플리케이션을 시작합니다.
VS Code에서 File > 새 창을 클릭합니다.
파일 > 폴더 열기, pipet-code-agent/ 폴더를 선택합니다.
pipet-code-agent/src/review.ts 파일을 엽니다.

review.ts 명령어의 동작을 수정하는 방법은 다음과 같습니다.

review.ts 파일에서 PROMPT의 시작 부분을 변경합니다. 다른 명령에 상응합니다.

const PROMPT = '
Write review comments for following code, identifying bugs and ways to improve code quality. Examples of bugs are syntax errors or typos, out of memory errors, and boundary value errors. Examples of improving code quality are reducing complexity of code, eliminating duplicate code, and ensuring other developers
are able to understand the code.
${CODE_LABEL}
...

필요한 경우 review.ts 파일에서 코드 및 코드 검토 예시의 목록입니다.

...
${REVIEW_LABEL}
There are duplicate lines of code in this control structure.
${CODE_LABEL}
const fixed_value = 128;
${REVIEW_LABEL}
Make sure constant names are in all capitals (FIXED_VALUE) for clarity.
';

변경사항을 review.ts 파일에 저장합니다.

수정된 명령어를 테스트하려면 다음 안내를 따르세요.

VS Code Pipet 확장 프로그램 프로젝트 창에서 다음 명령어를 사용하여 디버거를 다시 시작합니다. 실행 > 디버깅 다시 시작을 참고하세요.
VS Code Extension Development Host 창에서 코드를 선택합니다. 를 클릭합니다.
보기 > 명령어 팔레트
명령어 팔레트에서 Pipet을 입력하고 Pipet: Review the 선택한 코드 명령어를 사용합니다.

새 명령어 만들기

완전히 새로운 작업을 수행하는 새 명령을 만들어 Pipet을 확장할 수 있습니다. Gemini API를 사용해 보세요 각 명령어 파일 (comment.ts 및 review.ts)은 대부분 독립적이며 활성 편집기에서 텍스트를 수집하는 코드를 포함합니다. 프롬프트 작성, Gemini API에 연결, 프롬프트 전송, 확인할 수 있습니다.

선택 함수가 표시된 이름이 있는 Pipet 코드 에이전트 그림 2. VS Code 확장 프로그램의 새로운 함수 이름 추천 명령어 Development Host 창

이 안내 시리즈에서는 다음 코드를 사용하여 새 명령어를 작성하는 방법을 설명합니다. 기존 명령어 comment.ts를 템플릿으로 빌드합니다.

함수 이름을 추천하는 명령어를 만들려면 다음 안내를 따르세요.

pipet-code-agent/src/comment.ts 파일의 사본 만들기 src/ 디렉터리에 name.ts라는 이름의 디렉터리가 있습니다.
VS Code에서 src/name.ts 파일을 엽니다.

name.ts 파일의 프롬프트 명령을 다음과 같이 변경합니다. PROMPT 값 수정

// Provide instructions for the AI generative model
const PROMPT = `Recommend a name for this function. Explain your
reasoning in 3 sentences or less:`;

명령어 함수 및 정보 메시지의 이름을 변경합니다.

export async function generateName() {
  vscode.window.showInformationMessage('Generating function name...');

PROMPT만 포함하도록 프롬프트 어셈블리 코드 업데이트 값과 편집기에서 선택한 텍스트가 포함됩니다.
```
  // Build the full prompt using the template.
  const fullPrompt = `${PROMPT}
"
${selectedCode}
"
`;
```

응답 출력을 변경하여 생성하는 내용을 설명합니다.

    // update prefix to describe output
    let commentIntro = padding + commentPrefix + "Recommended name: (generated)\n";
    editBuilder.insert(selection.start, commentIntro);
    editBuilder.insert(selection.start, pyComment);

변경사항을 review.ts 파일에 저장합니다.

새 명령어 통합

새 명령어의 코드를 완성한 후에는 이를 그대로 사용할 수 있습니다. extension.ts 및 package.json 파일을 다음과 같이 업데이트합니다. 새 명령어를 확장 프로그램의 일부로 만들고 VS Code가 호출하도록 사용 설정합니다. 새 명령어를 사용해 보겠습니다

name 명령어를 확장 코드와 통합하려면 다음 안내를 따르세요.

VS Code에서 pipet-code-agent/src/extension.ts 파일을 엽니다.
새 가져오기를 추가하여 새 코드 파일을 확장 프로그램에 추가 구문
```
import { generateName } from './name';
```

다음 코드를 activate() 함수를 사용하세요.

export function activate(context: vscode.ExtensionContext) {
    ...
    vscode.commands.registerCommand('pipet-code-agent.nameFunction', generateName);
}

변경사항을 extension.ts 파일에 저장합니다.

name 명령어를 확장 프로그램 패키지와 통합하려면 다음 안내를 따르세요.

VS Code에서 pipet-code-agent/package.json 파일을 엽니다.

패키지의 commands 섹션에 새 명령어를 추가합니다. 파일에서 참조됩니다.

  "contributes": {
    "commands": [
      ...
      {
        "command": "pipet-code-agent.nameFunction",
        "title": "Pipet: Name the selected function."
      }
    ],

변경사항을 package.json 파일에 저장합니다.

새 명령어 테스트

명령어 코딩을 완료하고 명령어를 테스트할 수 있습니다. 새 명령어는 VS Code에서만 사용할 수 있습니다. Extension Development Host 창이며, VS Code 창이 열려 있는 곳이 아닌 경우 확장 프로그램의 코드를 수정했습니다.

수정된 명령어를 테스트하려면 다음 안내를 따르세요.

VS Code Pipet 확장 프로그램 프로젝트 창에서 다음 명령어를 사용하여 디버거를 다시 시작합니다. 실행 > 디버깅 다시 시작을 사용하면 Extension Development Host 창
VS Code Extension Development Host 창에서 코드를 선택합니다. 를 클릭합니다.
보기 > 명령어 팔레트
명령어 팔레트에서 Pipet를 입력하고 Pipet: Name the 선택한 함수 명령어를 사용합니다.

추가 리소스

Pipet Code Agent 프로젝트에 대한 자세한 내용은 코드 저장소에 있어야 합니다. 애플리케이션 빌드에 도움이 필요하거나 개발자를 찾고 있는 경우 자세한 내용은 Google Developers 커뮤니티 Discord 있습니다.

프로덕션 애플리케이션

대규모 잠재고객에게 Docs 에이전트를 배포하려는 경우 Google Gemini API에는 비율 제한 및 기타 비용이 적용될 수 있습니다 사용 제한에 대해 자세히 알아보세요. 다음과 같은 Gemini API로 프로덕션 애플리케이션을 빌드하려는 경우 Docs 에이전트, 확인해 보세요 Google Cloud Vertex AI Google Cloud 서비스를 통해 앱의 확장성과 안정성을 향상할 수 있습니다.