목동코딩학원, react에서 chatGPT 사용하는 방법

ChatGPT와 같은 대화형 인공지능 API를 React에서 사용하려면 다음과 같은 단계를 수행해야 합니다.

1. ChatGPT API를 사용하기 위해 API 키를 발급받습니다. API 키는 OpenAI 사이트에서 발급받을 수 있습니다.
2. React 프로젝트에서 Axios나 Fetch API와 같은 HTTP 클라이언트를 사용하여 ChatGPT API를 호출합니다.

const axios = require('axios');

const prompt = "Hello, how are you?";

axios.post('https://api.openai.com/v1/engines/davinci-codex/completions', {
    "prompt": prompt,
    "temperature": 0.5,
    "max_tokens": 60,
    "top_p": 1,
    "frequency_penalty": 0,
    "presence_penalty": 0
}, {
    headers: {
        'Content-Type': 'application/json',
        'Authorization': 'Bearer YOUR_API_KEY'
    }
})
.then((response) => {
    console.log(response.data.choices[0].text);
})
.catch((error) => {
    console.log(error);
});

1. 위 코드는 Axios를 사용하여 ChatGPT API를 호출하는 예시입니다. API 호출 시 https://api.openai.com/v1/engines/davinci-codex/completions URL을 사용하며, prompt 속성을 통해 인공지능 모델에 전달할 문장을 지정합니다. 그리고 다양한 옵션들을 설정하고, headers를 통해 API 키를 인증합니다.
2. API 호출 결과는 response.data 속성을 통해 접근할 수 있습니다. 위 코드에서는 response.data.choices[0].text를 통해 반환된 답변을 출력하고 있습니다.
3. 이제 ChatGPT API를 사용하여 React 애플리케이션에서 인공지능 대화 시스템을 구현할 수 있습니다.

목동코딩학원 : 온라인코딩교육, 유니티게임개발교육, 로블록스게임개발교육, 한국서비스산업진흥원, 플랫폼프로젝트수업