Demo Application

In this lesson, we’ll present an example React application to integrate the chat completions endpoint of the OpenAI API.

Workflow

Let’s first look at the workflow of the application:

1. When we run the application, the home page appears. The home page has two sections with buttons to navigate the other pages– “Chat completions” and “Specific Tasks.”

2. The “Chat completions” button takes us to the page to design our own prompt and get results from the OpenAI API. We need to enter the prompt and select other parameters. We can then click the “Get result” to fetch the response from the completions API. ...