This repository contains the source code for a web-based ChatGPT client developed using Wing and NextJs. This project demonstrates how to integrate OpenAI's language model (ChatGPT) with a modern NextJs frontend, utilizing Wing as the backend framework for efficient server-client communication.
- ChatGPT Integration: Leverage the power of OpenAI's ChatGPT for generating human-like text responses.
- NextJs Frontend: A clean and responsive UI built with NextJs.
- Wing Backend: Efficient handling of API requests and responses using Wing.
- Real-time Interaction: Smooth and real-time chatting experience.
Before you begin, ensure you have the following installed:
- Node.js
- npm or Yarn
- Python 3.x
Clone the repository:
git clone https://github.com/yourusername/chatgpt-client-wing-react.git
cd chatgpt-client-wing-nextjs
To get this project up and running on your local machine, follow these steps:
### Backend Setup
1. Navigate to the Backend Directory:
cd backend
Run the Wing server:
wing it
### Frontend Setup
1. Navigate to the Frontend Directory:
cd front_end
Start the NextJs app:
### Configuration
- OpenAI API Key: You will need to add your OpenAI API key to the backend configuration. Place it inside the `secrets.json` file in your backend directory and inside the `.env` file in your frontend directory.
### Requirements
- Wing: Ensure that Wing is installed on your machine. Visit [Wing Installation Guide](https://example.com/wing-installation) for detailed installation instructions.
After completing these steps, your ChatGPT client should be fully functional and ready to use.
Usage
To use the ChatGPT client:
Open your browser and go to http://localhost:3000.
Type your query into the input box.
Press enter or click the send button to receive a response from ChatGPT.