Get answers from different GPT models.
In the web application you can compare models: gpt-3.5-turbo
and gpt-4-1106-preview
.
![image](https://private-user-images.githubusercontent.com/117654777/315269591-dc804819-8951-4652-9901-2004cc8d58a7.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQxOTIyODgsIm5iZiI6MTcyNDE5MTk4OCwicGF0aCI6Ii8xMTc2NTQ3NzcvMzE1MjY5NTkxLWRjODA0ODE5LTg5NTEtNDY1Mi05OTAxLTIwMDRjYzhkNThhNy5wbmc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQwODIwJTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MDgyMFQyMjEzMDhaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT0zODRlNTIxZGRiZjJjOTc0YmRhMTM3OGVjM2FjY2Q5NGYyMDFiN2Y1N2E1M2NmZmZkYTI1YjFkNWNjNTJiZTNlJlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCZhY3Rvcl9pZD0wJmtleV9pZD0wJnJlcG9faWQ9MCJ9.KwTHrN7kwizzUeWJ1koj_OR_euukjWGDckBY1n3szl4)
React
React Markdown
OpenAI API
SASS
Users input data that is asynchronously sent to the selected GPT model via the OpenAI API, using a streaming to output the generated text - the model's response, and ReactMarkdown to display the output, providing a full-fledged representation of the message.
To interact with the GPT models, an API key from OpenAI is required. This key enables your application to authenticate requests to OpenAI's services, ensuring that usage is secure and measured.
Acquiring an API Key
- Create an account at OpenAI.
- Navigate to the API section and generate a new API key.
- Once you have your key, you will use it in your environment file to authenticate API requests from your application.
Setting Up Your API Key
In the root of your project:
- Create a
.env
file. - Add the following line:
REACT_APP_OPENAI_API_KEY='your-api-key-here'
. - This will allow your application to authenticate its requests to OpenAI.
- Add a personal account (username, password, API key);
- Save user info, sessions in DataBase (MongoDB or Postgres);
- Add the ability to select models for comparison (drop-down list);
- Adapt the web application for mobile devices;
- The web application is not adapted for phones and tablets.
To run the project in your local environment, follow these steps:
- Clone the repository to your local machine.
- Run
npm install
oryarn
in the project directory to install the required dependencies. - Create
.env
file, inside writeREACT_APP_OPENAI_API_KEY='your-api-key-here'
- Run
npm run start
oryarn start
to get the project started. - Open http://localhost:3000 (or the address shown in your console) in your web browser to view the app.