Vera-AI: An AI-Enhanced Chat Application for LLMs on Computational Creativity and LLMs

Hacked by Marlon Barrios Solano based on Replicate repo

LIVE ALL HERE

This is a Next.js application that integrates various AI models to facilitate dynamic and real-time conversations about generative art and AI concepts. Users can interact with the system through a chat interface, upload files for specific content analysis, and customize interaction settings according to their needs.

Features

Model Selection: Choose from a variety of pre-defined AI models with unique capabilities tailored to different interaction requirements.
Interactive Chat: Engage in real-time dialogue with the AI, receiving responses based on sophisticated machine learning algorithms.
Customizable AI Responses: Adjust AI behavior through settings such as prompt modification, temperature control, and token limitations to shape the conversation.
Responsive UI: Experience a fully responsive user interface that adjusts to different device screens for optimal usability.

Getting Started

Prerequisites

Guidelines for suggested developmet environment

You will need a Replicate key

Ensure you have the following installed:

Node.js
npm (comes with Node.js) or yarn

Setup

Clone the repository:

git clone https://github.com/marlonbarrios/vera-ai2.git
cd chat

You can also dowload as zipfile

Install dependencies:
```
npm install
# or
yarn install
```

Running the Application

To run the application in development mode, execute:

npm run dev
# or
yarn dev

Open http://localhost:3000 to view it in your browser. The app will automatically reload if you make edits.

Usage

Select an AI Model: Utilize the dropdown to select an AI model that fits the type of interaction you desire.
Engage with the AI: Enter your queries or statements in the chat form and submit them to see the AI's response.
Adjust AI Settings: Access the settings through the gear icon to modify the system's prompt, temperature, topP, and maximum tokens.

Contributing

Contributions are welcome! Feel free to fork the repository, make improvements, and submit pull requests.

Llama Chat 🦙

This is a Next.js app that demonstrates how to build a chat UI using the Llama 3 language model and Replicate's streaming API (private beta).

Here's a demo:

llama3-hq.mp4

Usage

Install dependencies:

npm install

Add your Replicate API token to .env.local:

REPLICATE_API_TOKEN=<your-token-here>

Run the development server:

npm run dev

Open http://localhost:3000 with your browser.

For detailed instructions on how to create and use this template, see replicate.com/docs/get-started/nextjs

# Deploying a Next.js Application on Vercel

This guide provides step-by-step instructions on how to deploy a Next.js application using Vercel, a platform that offers the best developer experience for deploying and hosting your Next.js projects.

## Prerequisites

Before you begin, make sure you have:
- A Vercel account (create one at [Vercel.com](https://vercel.com/signup))
- Your Next.js project ready for deployment
- Git installed on your system (if not, download it from [git-scm.com](https://git-scm.com/))

## Step 1: Prepare Your Next.js Application

Ensure your application runs correctly locally:
1. Navigate to your project directory.
2. Run `npm install` to install dependencies.
3. Test your application by running `npm run dev`. Fix any issues that arise.

## Step 2: Initialize a Git Repository

If your project is not already a Git repository, initialize it with the following commands:

bash git init git add . git commit -m "Initial commit"


## Step 3: Import Your Project to Vercel

You can deploy your Next.js application to Vercel directly from the command line or by using the Vercel Dashboard.

### Option A: Using Vercel CLI

1. Install the Vercel CLI globally:

npm i -g vercel

2. Login to your Vercel account:

vercel login

3. Navigate to your project directory and run:

vercel

Follow the prompts to deploy your application. Vercel detects that it's a Next.js app and optimizes settings automatically.

### Option B: Using Vercel Dashboard

1. Go to the [Vercel Dashboard](https://vercel.com/dashboard).
2. Click on "New Project".
3. Import your Git repository by selecting it from your connected Git accounts (GitHub, GitLab, Bitbucket).
4. Vercel will automatically detect it as a Next.js project and set up everything required. Click "Deploy".

## Step 4: Configure Environment Variables

If your application requires environment variables:
1. In the Vercel dashboard, select your project.
2. Go to Settings > Environment Variables.
3. Add the necessary environment variables as key-value pairs.

## Step 5: Deploy Your Application

After configuring, Vercel builds and deploys your Next.js application. You can monitor the deployment process in the Vercel dashboard. Once deployed, Vercel provides a URL to view your live application.

## Step 6: Continuous Deployment

Vercel offers continuous deployment:
- Each time you push changes to your production branch (commonly `main`), Vercel automatically deploys the new version.
- You can also configure preview deployments for feature branches.

## Conclusion

Deploying with Vercel not only simplifies the deployment process but also provides scalability and performance optimizations for your Next.js applications. For more detailed information and troubleshooting, visit the [Vercel documentation](https://vercel.com/docs).