ChatGPT를 Visual Studio Code에서 사용하는 방법

2023-03-10

안녕하세요.

이번 시간에는 Visual Studio Code를 사용해서 코딩할 때, ChatGPT의 도움을 바로 받을 수 있는 플러그인 AICodeHelper를 소개해 드리겠습니다.

설치방법

Visual Studio Code에서 aicodehelper 플러그인을 설치합니다.

설치가 완료된 후, ChatGTP의 API KEY를 발급받아야 합니다.

ChatGPT의 API KEY를 발급받는 방법은 아래 링크에서 확인 부탁 드립니다.

ChatGPT API KEY 발급받는 방법

그리고 Visual Studio Code의 Settings에서 aicodehelper 플러그인의 GPTkey의 값에 발급받은 API KEY를 입력합니다.

이렇게 설정이 완료되었습니다.

단축키 사용방법

1. 코드 생성

만들고자 하는 프로젝트를 글로 설명하고, 그 설명을 선택하고 Ctrl + Alt + Shift + G를 누르면 코드를 생성해 줍니다.

다음과 같은 설명을 예를 들어 보겠습니다.

1부터 10까지의 숫자를 출력하는 코드를 작성해 주세요.

위 설명을 선택 후 Ctrl + Alt + Shift + G를 누르면 다음과 같이 코드가 생성됩니다.

for(let i=0;i<10;i++) {  
  console.log(i);  
} 

2. 코드 리뷰

작성한 코드를 선택 후 Ctrl + Alt + Shift + C를 누르면 코드를 리뷰해 줍니다.

다음과 같은 코드를 예를 들어 보겠습니다.

let a = 20;
if(a==30){
  console.log('d is 300')
}
if(a==10){
  console.log('d is 100')
}
if(a==20){
  console.log('d is 200')
}

위 코드를 선택 후 Ctrl + Alt + Shift + C를 누르면 다음과 같이 코드를 리뷰해 줍니다.

// Good part: 
// The code correctly checks the value of variable "a" against different conditions 
// and prints the corresponding message when the condition is true.

// Bad part:
// The code uses multiple if statements instead of else if or switch statement,
// which can result in unnecessary checks and slower performance.
// Additionally, there is no default or catch-all condition for
// when "a" does not match any of the given conditions,
// so the code will not output anything in that case.

let a = 20;
if(a==30){
console.log('d is 300')
}
if(a==10){
console.log('d is 100')
}
if(a==20){
console.log('d is 200')
}

3. 코드 주석

작성한 코드를 선택 후 Ctrl + Alt + Shift + Z를 누르면 코드에 주석을 달아 줍니다.

다음과 같은 코드를 예를 들어 보겠습니다.

for(let i=0;i<10;i++) {  
  code();  
  main();  
} 

위 코드를 선택 후 Ctrl + Alt + Shift + Z를 누르면 다음과 같이 코드에 주석이 달립니다.

for(let i=0;i<10;i++) {  
  // 코드 함수를 실행합니다.  
  code();  
  // 메인 함수를 실행합니다.  
  main();  
} 

4. 코드 리팩토링

작성한 코드를 선택 후 Ctrl + Alt + Shift + R을 누르면 코드를 리팩토링해 줍니다.

다음과 같은 코드를 예를 들어 보겠습니다.

let a = 20;

if(a==30){
console.log('d is 300')
}
if(a==10){
console.log('d is 100')
}
if(a==20){
console.log('d is 200')
}

위 코드를 선택 후 Ctrl + Alt + Shift + R을 누르면 다음과 같이 코드가 리팩토링됩니다.

const a = 20;

const conditions = {
30: 'd is 300',
10: 'd is 100',
20: 'd is 200'
};

if (conditions[a]) {
console.log(conditions[a]);
}

5. ChatGPT 사용하기

요구사항을 적고 선택 후 Ctrl + Alt + Shift + M을 누르면 답변을 출력해 줍니다.

다음과 같은 예를 들어 보겠습니다.

ChatGPT에 대해 설명해 주세요.

위의 요구사항을 선택한 후 Ctrl + Alt + Shift + M을 누르면 다음과 같이 답변을 출력해 줍니다.

ChatGPT는 인공지능 기술을 이용해 자연어 처리를 하는 챗봇 서비스입니다. 
ChatGPT는 사용자가 입력한 질문에 대해 적절한 답변을 제공하고, 
대화를 이어나가는 인공지능 챗봇입니다. ChatGPT는 GPT-3 기술을 사용하여 
매우 자연스러운 대화를 제공하며, 웹, 모바일, 메신저 등 다양한 채널에서 
사용될 수 있습니다. 예를 들어, ChatGPT는 사용자가 요리 레시피를 문의하면 
레시피를 제공하고, 여행지 추천을 문의하면 여행지를 추천해 줄 수 있습니다. 
이러한 방식으로 ChatGPT는 사용자의 다양한 질문에 신속하고 정확한 답변을 
제공하여 사용자의 만족도를 높이는 역할을 합니다.

이렇게 Visual Studio Code의 플러그인 AICodeHelper에 대해서 알아보았습니다.

감사합니다.