Exploring OpenAI GPT-3 With Next.js

OpenAI has a breakthrough in large language models for the Turing test

We attended AI Hardware Summit and Edge AI Summit 2022, as well as NVIDIA GTC (GPU Technology Conference). Both conferences showed that AI continues to make exponential advances with new algorithms and new frameworks to develop them. A recent breakthrough is the introduction of language processing technologies that enable us to build more intelligent systems with a richer understanding of language than ever before.

The Turing test, originally called the imitation game by Alan Turing in 1950, is a test of a machine’s ability to exhibit intelligent behavior indistinguishable from that of a human. Turing proposed that a human evaluator would judge text-only natural language conversations between a human and a machine, and try to distinguish whether one of the two partners in conversation is a machine. If the evaluator could not reliably tell the machine from the human, the machine would be said to have passed the test.

OpenAI’s GPT-3 (Generative Pre-trained Transformer 3) is a machine learning platform that enables developers to train and deploy AI models. It is also said to be scalable and efficient with the ability to handle large amounts of data. This autoregressive language model produces human-like text. Input a short prompt, and the system generates an entire essay. It has the following capabilities:

• Content generation
• Summarization
• Classification
• Sentiment analysis
• Data extraction
• Translation
• Mathematics
• Programming
• Conversation

In this article, we are going to set up GPT-3 for text-only natural language conversations. You can be an evaluator to decide what kind of intelligence level GPT-3 currently has.

Set Up OpenAI Account

OpenAI is a non-profit artificial intelligence research company. Its goal is to advance digital intelligence in a way that is most likely to benefit humanity as a whole, unconstrained by a need to generate financial returns.

In order to explore GPT-3, we must sign up for an account at OpenAI. The process requires a valid email and a mobile number for verification.

After the registration, an API key is generated.

The key will be used for API calls, keep it handy and safe. It is recommended to set it to an environment variable.

export OPENAI_API_KEY="<your-openai-key>"

It is a free account with $18 credit that can be used during the first 3 months. Afterward, it needs to be continued with a paid model.

Set Up Next.js As Your Working Environment

The OpenAI manual emphasizes not to share API key with others, or expose it in the browser or other client-side code. APIs are meant for server-side usage only. Therefore, we choose Next.js, a React Framework that has a built-in client and server, where APIs are invoked at the server side.

Use the following command to set up a Next.js project, named next-gpt-3.

% yarn create next-app next-gpt-3 --typescript
% cd next-gpt-3

Execute the command, yarn dev, and we see the default Next.js UI at http://localhost:3000. It is Next.js’ welcome page.

Build GPT-3 in Project

We build GPT–3 inside the Next.js project, and it takes five steps to do it:

1. Install openai in the project.
2. Modify the welcome page, pages/index.tsx.
3. Update the page styles, styles/Home.module.css.
4. Configure call handler in api/hello.ts.
5. Interpret GPT-3 response.

1. Install openai in the Next.js project

Run the following command to install the openai package:

% yarn add openai

openai becomes part of dependencies in package.json:

2. Modify the welcome page, pages/index.tsx

Files in the pages folder are React components. When a file is added to the pages folder, it is automatically available as a route. index.tsx is the home route. It is invoked when a user access /. The default content is the welcome page, and we modify it to be a page with prompt and completion.

The UI has an input field to type a new prompt. After the user presses the enter key, the input text is cleared. The prompt and completion are displayed on the page. In GPT-3, a response is called completion, because response makes the original prompt complete by finishing the sentence or answering the question.

Here is the modified code in pages/index.tsx:

There are three React states created in the code:

• value (line 6): It is the value in the input field, which is applied at line 36. value is updated by handleInput (lines 10–13).
• prompt (line 7): It is the user input for GPT-3, which is displayed by line 37. prompt is set by handleKeyDown (lines 15–31) when the input field has a keydown event with the key, 'Enter' (line 18).
• completion (line 8): It is the completion of the prompt, which is displayed at line 38. completion is set to 'Loading...' after pressing 'Enter' (line 19), and it may take a few seconds to get a response. The API route call is handled at lines 20–26, where the endpoint is '/api/hello' (line 20), and the request body is set to value (line 25).

3. Update the page styles, styles/Home.module.css

In order to layout pages/index.tsx nicely, we update styles/Home.module.css:

• At lines 1–3, it is the container styling with padding.
• At lines 5–10, the main class is styled as a flex layout by the column direction.
• At lines 12–14, .main div is styled with some padding.
• At lines 16–18, .main input is set to 80% of the width.

4. Configure call handler in api/hello.ts

API routes provide a solution to build APIs. Files inside the pages/api folder are mapped to /api/*, and each of them is treated as an API endpoint. Since it is a server-side bundle, it is secure to invoke calls with OPENAI_API_KEY.

Here is the modified api/hello.ts:

• At lines 4–6, configuration is created with apiKey that is set to the environment variable, OPENAI_API_KEY.
• At line 7, openai is instantiated with configuration.
• At lines 9–23, the API handler is defined, which takes a request object and builds a response object. The response object is in json format with the status code, 200 (line 22).
• The response data comes from completion (line 13), which is the response from openai.createCompletion that creates a completion for the provided prompt and parameters.

In the openai.createCompletion API, there are a number of parameters. These parameters are defined as follows:

• model (line 14): It is model ID. There are a number of models in GPT-3. text-davinci-002 is the most capable GPT-3 model, which can perform tasks other models can do, often with less context. Other models are text-curie-001, text-babbage-001, and text-ada-001. Other models can perform certain tasks extremely well with significant speed or cost advantages. For example, text-curie-001 is very capable, faster, and lower cost than text-davinci-002. For a new user, it is recommended to start with text-davinci-002.
• prompt (line 15): It is the prompt(s) to generate completion(s) for a string, array of strings, array of tokens, or array of token arrays.
• temperature (line 16): It is sampling temperature. A higher value means the model will take more risks. 0 is for a well-defined answer, and 0.7 is for a more creative answer. The default value is 1.
• top_p (line 17): It is an alternative to sampling with temperature, called nucleus sampling, where the model considers the results of the tokens with top_p probability mass. 0.1 means only the tokens comprising the top 10% probability mass are considered. The default value is 1, and it is recommended to alter this or temperature but not both.
• frequency_penalty (line 18): It is a number between -2.0 and 2.0. Positive values penalize new tokens based on their existing frequency in the text so far, decreasing the model’s likelihood to repeat the same line verbatim. The default value is 0.
• presence_penalty (line 19): It is a number between -2.0 and 2.0. Positive values penalize new tokens based on whether they appear in the text so far, increasing the model’s likelihood to talk about new topics. The default value is 0.
• max_tokens (line 20): It is the maximum number of tokens to generate in the completion. text-davinci-002 has a limit of 4,096 tokens, and other models have a limit of 2048 tokens. For the following sentence, the token count is 9.

Execute yarn dev, and the GPT-3 is ready for exploring.

5. Interpret GPT-3 response

Type the text 'I am', and press 'Enter'. The hello call responses with the following JSON object:

The completion value is an array of choices (lines 7–14). Since we input one prompt, the response has one answer.

The text (line 9) completes the original incomplete sentence and repeats 'I am a student'.

As we have mentioned, the higher temperature it is, the more risky an answer is. With the same prompt, we get a higher chance of a different answer with a higher temperature.

Repeat 'I am', and this time, it is a longer answer:

Try an incorrect sentence, 'We is happy'. And it understands the broken English:

Do you feel the intelligence of the machine?

Execute GPT-3 Examples

GPT-3 can be applied to virtually any task that involves understanding or generating natural language or code. The completions endpoint provides a simple interface to large language models that is extremely flexible and powerful.

Input some text as a prompt, and the model will generate a text completion that attempts to match whatever context or pattern. Designing a prompt is essentially programming the model. This is different from most other NLP services which are designed for a single task, such as sentiment classification or named entity recognition.

Instead, the completions endpoint can be used for virtually any task. Let’s look at some examples in the context of content generation, summarization, classification, sentiment analysis, data extraction, translation, mathematics, programming, and conversation.

Content generation

Content generation is the contribution of information to any media in specific contexts. GPT-3 is great for content generation.

• Suggest some boy names.

• Tell me how to cook lobster in the oven.

• Write me over a 1,000-word paragraph about the environment.

Is it truly over 1,000 words?

• Write me a fantasy story.

Summarization

Summarization is the act of expressing the most important facts or ideas about an article.

• Summarize this paragraph in one sentence: A.I. Artificial Intelligence (also known as A.I.) is a 2001 American science fiction film directed by Steven Spielberg. The screenplay by Spielberg and screen story by Ian Watson were based on the 1969 short story, “Supertoys Last All Summer Long,” by Brian Aldiss. The film was produced by Kathleen Kennedy, Spielberg, and Bonnie Curtis. It stars Haley Joel Osment, Jude Law, Frances O’Connor, Brendan Gleeson, and William Hurt. Set in a futuristic post-climate change society, A.I. tells the story of David (Osment), a childlike android uniquely programmed with the ability to love.
• Answer: A.I. tells the story of David (Osment), a childlike android uniquely programmed with the ability to love.

Classification

Classification is the act or process of dividing things into groups according to their type.

• Is 8 a number or letter?

• Is orange a color?

Sentiment analysis

Sentiment analysis is the use of natural language processing, text analysis, computational linguistics, and biometrics to systematically identify, extract, quantify, and study affective states and subjective information.

• Should I be happy to eat vegetable?

• Which website has the highest number of positive responses?

Data extraction

Data extraction is the act or process of retrieving data out of data sources for further data processing or data storage.

• How many girl names among Mary, John, Joe, and Lily?

• Mary plays with John, Joe, and Lily. How many boys are there?

Translation

Translation is the process of translating words or text from one language into another.

• What is AI definition in Chinese?

Mathematics

Mathematics is the abstract science of number, quantity, and space.

• Can you sum up 1 to 100?

Programming

Programming is writing code with a programming language. GPT-3 can code too.

• Can you write a sorting algorithm in JavaScript?

• Can you write a short sorting algorithm in JavaScript?

• Show me a leet code question and answer.

Conversation

Conversation is about talking. Can GPT-3 provide companionship?

• Do you love me?

• Who do you like more, mommy or daddy?

Conclusion

GPT-3 is a machine learning platform that enables developers to train and deploy AI models. Input some text as a prompt, and the model will generate a text completion that attempts to match whatever context or pattern.

With all the examples we have provided, what do you think about GPT-3? You are an evaluator. What score would you give GPT-3?

Are we closer to the day that a machine can pass the Turing test?

Thanks for reading.

Want to Connect?

If you are interested, check out my directory of web development articles.