OpenAI API: Program AI-based chats, sales assistants & text adventures Language: German

OpenAI API: Program AI-based chats, sales assistants & text adventures

AI & Trends, Web design, CMS & development 36 Videos · 3.5 h Video training · English Stephan Haewß by Stephan Haewß

Would you like to develop AI-based chats that talk to your users - similar to ChatGPT? In this course, developer Stephan Haewß will show you how to use the OpenAPI API for your purposes. Using three examples (a chat, a sales assistant for online stores and a text adventure), you will learn how to make your websites and apps speak in such a way that they provide suitable answers to your users' questions.

  • How to let OpenAI's LLM speak in your websites, online stores and games
  • The power behind ChatGPT - how to connect the OpenAI API to your developments
  • Example chat: Program AI-based chat apps that interact with your users
  • Example text adventure: Develop a game in which the NPCs give AI-generated answers
  • Example sales assistant: How your online store talks to your users about products
  • Programming chats based on AI - a three-hour tutorial by Stephan Haewß

Text generated by artificial intelligence - learn now how to incorporate it into your applications in a targeted and specific way.

content

36 Videos, 209 minutes

Introduction to the course

1 Videos · 3 minutes
01 Open free of charge

OpenAI API: 1 | What can you expect in the course?

This is what you can expect in this OpenAI API course.

01

OpenAI API: 1 | What can you expect in the course?

3 min Open

Introduction

3 Videos · 16 minutes
02 Open free of charge

OpenAI API: 2.1 | Tools we will use

This video explains the tools used and the knowledge required.

03 Open free of charge

OpenAI API: 2.2 | The OpenAI platform

This is about the OpenAI platform and how you can use it.

04 Open

OpenAI API: 2.3 | IMPORTANT: Update of the OpenAI API and AstroJS

This is about the OpenAI update. Find out what changes have been made. Everything important is summarized in the project file.

02

OpenAI API: 2.1 | Tools we will use

4 min Open
03

OpenAI API: 2.2 | The OpenAI platform

5 min Open
04

OpenAI API: 2.3 | IMPORTANT: Update of the OpenAI API and AstroJS

7 min Open

Programming a chat app

11 Videos · 68 minutes
05 Open

OpenAI API: 3.1 | Creation of the AstroJS base project

We create our first project with npm create astro and take a look at the structure of the product.

06 Open

OpenAI API: 3.2 | Adding React to our project

Since we rely on React for our UI, Astro JS must first be enabled to use React components.

07 Open

OpenAI API: 3.3 | Adding an endpoint to the server

Our endpoint for the chat service will be a get requestto the URL /api/chat. We will set up this endpoint in this video.

08 Open

OpenAI API: 3.4 | Preparing the OpenAI API call

To call the OpenAI API, we need an API key, which we can generate via our account with the OpenAI platform, as well as the openai-npm package.

09 Open

OpenAI API: 3.5 | Transmission of the user message to the OpenAI API

For testing, we used a fixed text on the server. Here we want to use the text that is sent by the browser in the URL as a query parameter for the first time.

10 Open

OpenAI API: 3.6 | Basic UI in React

Chatting only via the URL in the browser's address bar is not a permanent solution. That's why in this video we create a rudimentary React UI that allows you to enter the chat text.

11 Open

OpenAI API: 3.7 | Saving the chat history

We haven't had a real chat yet, just a question and the answer to it. In order to have a productive conversation with the LLM, we need to memorize the chat history.

12 Open

OpenAI API: 3.8 | Reset the chat

Sometimes you just want to start from the beginning and forget what was said. To avoid having to restart the server, we use a chat ID to reset the chat history on the server.

13 Open

OpenAI API: 3.9 | Improve UX

Until now, chatting was still very rudimentary. Some improvements will be implemented here that will push our chat app a little more in the direction of ChatGPT.

14 Open

OpenAI API: 3.10 | Beautify chat history

The chat history was not easy to read until now and is made a little "nicer" in this video.

15 Open

OpenAI API: 3.11 | Summary: First chat app

Our first chat app is now finished, but there is still a lot to do if you want to compete with ChatGPT ;-) If you don't want to do that, you can continue with a new project in the next section.

05

OpenAI API: 3.1 | Creation of the AstroJS base project

5 min Open
06

OpenAI API: 3.2 | Adding React to our project

5 min Open
07

OpenAI API: 3.3 | Adding an endpoint to the server

4 min Open
08

OpenAI API: 3.4 | Preparing the OpenAI API call

11 min Open
09

OpenAI API: 3.5 | Transmission of the user message to the OpenAI API

5 min Open
10

OpenAI API: 3.6 | Basic UI in React

7 min Open
11

OpenAI API: 3.7 | Saving the chat history

8 min Open
12

OpenAI API: 3.8 | Reset the chat

5 min Open
13

OpenAI API: 3.9 | Improve UX

9 min Open
14

OpenAI API: 3.10 | Beautify chat history

7 min Open
15

OpenAI API: 3.11 | Summary: First chat app

2 min Open

AI chat in a text-adventure game

13 Videos · 81 minutes
16 Open

OpenAI API: 4.1 | Creating the project

We are setting up the new project using our first chat app.

17 Open

OpenAI API: 4.2 | The story

A game needs a story. In this video, I present my idea for it and make initial preparations for navigating through the game.

18 Open

OpenAI API: 4.3 | Prepare the quests

The player must complete three quests (chats) in order to reach the (temporary) end of the game. I prepare these in this video.

19 Open

OpenAI API: 4.4 | The first AI chat

The bartender is the first chat partner in this game and is "brought to life" in this video.

20 Open

OpenAI API: 4.5 | System prompt for the bartender

Until now, the bartender was somewhat clueless about his role in the game. We are remedying this by adding the first system prompt.

21 Open

OpenAI API: 4.6 | Function calls

Our chat partner has been absorbed in his role as bartender, but we do not yet know in the program whether the quest has been fulfilled by the player. This is where function calls come in handy, which the LLM can make of its own accord if it deems it appropriate. We have to make sure that it does this.

22 Open

OpenAI API: 4.7 | Function calls: Provision of the result

Function calls can have return values and we also need to communicate these to the AI, which we do in this video.

23 Open

OpenAI API: 4.8 | Mark quest as done

The client (browser) must be notified that the quest has been completed, because then the player can also talk to Dr. Owen and get a little closer to the goal.

24 Open

OpenAI API: 4.9 | Leave the chat

Even the best conversation must come to an end, but how do we get this into the program? By calling a function, of course.

25 Open

OpenAI API: 4.10 | Talk to Dr. Owen

Finally, the player can talk to the AI expert to find out the solution to the last puzzle.

26 Open

OpenAI API: 4.11 | Start new chat on the server

Bartender and Dr. Owen are two different characters and are therefore not allowed to share a chat history. Therefore, we should create a new chat history for Dr. Owen.

27 Open

OpenAI API: 4.12 | Provide new quest function for Dr. Owen

Dr. Owen needs a function so that we know that the player has asked for the solution to his little security robot problem and has received an answer. He gets it in this video.

28 Open

OpenAI API: 4.13 | Chat with the security robot

Our final opponent in this game is the security robot that didn't want to let us past the whole time. But now the player has the power, or rather the knowledge, to outwit him after all.

16

OpenAI API: 4.1 | Creating the project

5 min Open
17

OpenAI API: 4.2 | The story

6 min Open
18

OpenAI API: 4.3 | Prepare the quests

5 min Open
19

OpenAI API: 4.4 | The first AI chat

4 min Open
20

OpenAI API: 4.5 | System prompt for the bartender

9 min Open
21

OpenAI API: 4.6 | Function calls

6 min Open
22

OpenAI API: 4.7 | Function calls: Provision of the result

6 min Open
23

OpenAI API: 4.8 | Mark quest as done

4 min Open
24

OpenAI API: 4.9 | Leave the chat

9 min Open
25

OpenAI API: 4.10 | Talk to Dr. Owen

4 min Open
26

OpenAI API: 4.11 | Start new chat on the server

8 min Open
27

OpenAI API: 4.12 | Provide new quest function for Dr. Owen

6 min Open
28

OpenAI API: 4.13 | Chat with the security robot

9 min Open

Virtual sales assistant for an online shop

7 Videos · 37 minutes
29 Open

OpenAI API: 5.1 | Creating the new project

Our new project takes us into the world of guitar stores, of course with the friendly support of the OpenAI API, which allows us to realize a virtual sales assistant.

30 Open

OpenAI API: 5.2 | Better product search

So far, the sales assistant has not been particularly good at providing advice. This is now to be improved with a simulated "database" using maps.

31 Open

OpenAI API: 5.3 | More products

Previously we only had 2 products, which we increase to 4 in this video. The important thing here is that we now have several products per type and can therefore ask the sales assistant, for example, which electric basses are in the range.

32 Open

OpenAI API: 5.4 | Multiple parameters in function calls

Price is not everything when buying a guitar, but a customer who does not want to take out a new mortgage on their own home should be able to ask the seller for electric guitars in the lower or middle price range. We achieve this with a second parameter priceRange in the corresponding function, which the LLM should then call.

33 Open

OpenAI API: 5.5 | Fix for undefined price range

We broke it with the last video. But don't worry, the error is quickly fixed if you know where to look.

34 Open

OpenAI API: 5.6 | Add product to shopping cart

What would an online store be without a shopping cart? Although we won't be implementing a real shopping cart (that's not what this course is about), in this video we will lay the foundations so that you can connect a shopping cart to the virtual sales assistant. Here again ... the function call helps!

35 Open

OpenAI API: 5.7 | Fuzzy product search

In most cases, customers will only know the approximate names of the products. The LLM can only make the function call with the names that appear in the customer's query. But with a little trick, the AI can be used quite easily for a "fuzzy" search in the product names for these cases.

29

OpenAI API: 5.1 | Creating the new project

8 min Open
30

OpenAI API: 5.2 | Better product search

7 min Open
31

OpenAI API: 5.3 | More products

3 min Open
32

OpenAI API: 5.4 | Multiple parameters in function calls

5 min Open
33

OpenAI API: 5.5 | Fix for undefined price range

3 min Open
34

OpenAI API: 5.6 | Add product to shopping cart

5 min Open
35

OpenAI API: 5.7 | Fuzzy product search

6 min Open

Conclusion

1 Videos · 6 minutes
36 Open

OpenAI API: 6 | What has been learned, what else is there?

A short summary of what we have achieved in this course, what you can do with it and what exciting APIs are still available in OpenAI.

36

OpenAI API: 6 | What has been learned, what else is there?

6 min Open
Comments (0)

Comment now „OpenAI API: Program AI-based chats, sales assistants & text adventures“