An open API service indexing awesome lists of open source software.

https://github.com/amruthlp12/chatgpt-chatbot-react-api

Vite React ChatGPT App integrates OpenAI's ChatGPT model into React using Vite, offering users a real-time chat interface. Ideal for developers exploring conversational AI in React, with opportunities for contributions.
https://github.com/amruthlp12/chatgpt-chatbot-react-api

api chatbot chatgpt conversational-ai natural-language-processing react real-time-communication user-interface vite web-development

Last synced: 10 months ago
JSON representation

Vite React ChatGPT App integrates OpenAI's ChatGPT model into React using Vite, offering users a real-time chat interface. Ideal for developers exploring conversational AI in React, with opportunities for contributions.

Awesome Lists containing this project

README

          

**React ChatGPT App**

This is a simple React application that utilizes the ChatGPT model from OpenAI to create a chat interface where users can converse with ChatGPT.

**Features**

**Chat Interface:** Users can send messages and receive responses from ChatGPT.
**Real-time Typing Indicator:** A typing indicator is displayed when ChatGPT is processing a response.
**Message History:** Previous messages are displayed in the chat window for reference.

**Prerequisites**

Node.js installed on your machine
OpenAI API key (required for accessing the ChatGPT model)

**Installation**

Clone the repository to your local machine:

git clone [https://github.com/AmruthGowda91200/chatgpt-chatbot-react-api.git](https://github.com/AmruthGowda91200/chatgpt-chatbot-react-api)

Navigate to the project directory:

cd react-chatgpt-app

Install dependencies:

npm install

Obtain an API key from OpenAI and replace chatGPT_API in App.js with your API key.

**Usage**

Start the development server:

npm start

Open your browser and navigate to [http://localhost:5173](http://localhost:5173)to view the application.

Type messages in the input field and press Enter to send them to ChatGPT.

ChatGPT will process your message and respond accordingly.

**Customization**

You can customize the chat interface, styling, and message processing logic according to your requirements. Feel free to modify the App.js file and associated components to add additional features or enhance the existing ones.

**Credits**

This application utilizes the following technologies and libraries:

Vite

React

Chat UI Kit React

OpenAI API

**License**

This project is licensed under the MIT License - see the LICENSE file for details.