File size: 2,249 Bytes
7298018 eef269a 7298018 eef269a 7298018 eef269a 7298018 343b64b |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 |
---
title: Llm Pricing
emoji: 📊
colorFrom: green
colorTo: green
sdk: docker
pinned: true
license: apache-2.0
---
# LLM Comparison React App
## Overview
This React application, developed in collaboration with Anthropic Claude 3.5, is designed to compare hosted Large Language Models (LLMs) using Shadcn UI. The comparison data is based on a sheet that we have created. You can access the sheet [here]([pseudo-link](https://docs.google.com/spreadsheets/d/1NX8ZW9Jnfpy88PC2d6Bwla87JRiv3GTeqwXoB4mKU_s/edit?gid=0#gid=0)).
## Features
- **Compare LLM Providers**: Easily compare different LLM providers and their pricing.
- **User-friendly Interface**: Built using Shadcn UI for a seamless and intuitive user experience.
- **Dynamic Data**: Data is dynamically fetched and displayed, making it easy to update and compare new models and providers.
## Getting Started
1. **Clone the repository**:
```bash
git clone https://huggingface.co/spaces/philschmid/llm-pricing
cd llm-comparison-react-app
```
2. **Install dependencies**:
```bash
npm install
```
3. **Run the app**:
```bash
npm start
```
4. **Open your browser**: Navigate to `http://localhost:5173` to see the app in action.
## Contributing
We welcome contributions! If you want to add a new provider, please follow these steps:
1. **Navigate to the data file**: Open the file where `mockData` array is located.
2. **Add your provider**: Add a new object to the `mockData` array with the provider details.
Here is an example of how to add a new provider:
```javascript
export const mockData: Provider[] = [
{
provider: 'OpenAI',
uri: 'https://openai.com/api/pricing/',
models: [
{ name: 'GPT-4', inputPrice: 5.0, outputPrice: 15.0 },
{ name: 'GPT-4 (8K)', inputPrice: 30.0, outputPrice: 60.0 },
{ name: 'GPT-4 Turbo', inputPrice: 10.0, outputPrice: 30.0 },
{ name: 'GPT-3.5-turbo', inputPrice: 0.5, outputPrice: 1.5 },
],
},
{
provider: 'NewProvider',
uri: 'https://newprovider.com/api/pricing/',
models: [
{ name: 'Model-A', inputPrice: 4.0, outputPrice: 12.0 },
{ name: 'Model-B', inputPrice: 25.0, outputPrice: 50.0 },
],
},
// Add more providers here
];
```
|