Skip to content
Dimitri Robiere PerrietD. R. PerrietCaen, FR — --:--:--EN · FR

Video game character chatbot with the OpenAI API

○ Archived
Client
MyDigitalSchool
Role
Full-stack developer
Duration
6 months
Year
2023
Stack
Node.js · Express · MySQL · React · Tailwind CSS · API OpenAI · JWT · Mocha
Video game character chatbot with the OpenAI API — illustration
Fig. 01 — Video game character chatbot with the OpenAI API, illustration
(00) — In short

A React and Node.js web app where you register video game characters and chat with them: the OpenAI API replies in the voice of the chosen character.

(01)

Context

This video game character chatbot started in early 2023, just as the OpenAI API was opening up, as part of a design course (UML and databases). The idea: a user picks a video game, then a character, and opens a conversation with them.

It began as an Express app with server-rendered views, before being rebuilt as a Node.js API consumed by a React front end.

(02)

Challenge

For the character to stay believable, the model has to know their universe and remember what was already said. But the API keeps no state between calls.

The database also had to be clean and match the course’s conceptual model, linking users, games, characters, conversations and messages, all behind authentication.

(03)

Approach

When a character is created, the app asks OpenAI for a detailed description, which then serves as the system prompt. With each new message, the whole conversation history is sent back to the model, which answers in character.

I designed the MySQL database from the logical data model (with an SQL view for some queries), wrote the CRUD for users, games, characters, conversations and messages, and secured the API with JWT and bcrypt-hashed passwords. The React front end offers a debounced game search, a cover gallery built with Swiper and the chat page. Mocha tests cover part of the routes.

(04) — Results

Key figures
105
commits
6
months of development
5
entities: users, games, characters, conversations, messages
2
architecture: Node.js API and React front end
← Previous project27 · MyCampusQuest, a Next.js treasure hunt PWANext project29Custom WordPress themes and plugins for an agency