Talk 2 Icons : Create and Chat with Custom AI Personalities

Talk2Icons is an innovative project that empowers users to design their very own AI companions based on iconic personalities or characters. Whether you want to chat with your favorite historical figure, a fictional character, or even your own custom creation, Talk2Icons makes it possible.

Explore the realm of personalized artificial intelligence companionship with Talk2Icons!

Description

• Create custom AI companions with unique personalities.
• Give your AI companions names and distinctive traits.
• Engage in dynamic and meaningful conversations with your virtual friends.
• Explore a wide range of pre-built iconic personalities or create your own.

Features

• Tailwind design
• Tailwind animations and effects
• Full responsiveness
• Clerk Authentication (Email, Google, 9+ Social Logins)
• Client form validation and handling using react-hook-form
• Server error handling using react-toast
• Image Generation Tool (Open AI)
• Video Generation Tool (Replicate AI)
• Conversation Generation Tool (Open AI)
• Music Generation Tool (Replicate AI)
• Page loading state
• Stripe monthly subscription
• Free tier with API limiting
• How to write POST, DELETE, and GET routes in route handlers (app/api)
• How to fetch data in server react components by directly accessing database (WITHOUT API! like Magic!)
• How to handle relations between Server and Child components!
• How to reuse layouts
• Folder structure in Next 13 App Router

Languages and Tools:

Installation

To get started with Talk2Icons, follow these simple steps:

Clone this repository:

 git clone https://github.com/Adii-5442/Talk-2-Icons.git

Install packages

npm i

Setup .env file

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=

NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/dashboard
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/dashboard

OPENAI_API_KEY=
REPLICATE_API_TOKEN=

PINECONE_API_KEY=
PINECONE_ENVIRONMENT=
PINECONE_INDEX=

UPSTASH_REDIS_REST_URL=
UPSTASH_REDIS_REST_TOKEN=

NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=

DATABASE_URL=

STRIPE_API_KEY=
STRIPE_WEBHOOK_SECRET=

NEXT_PUBLIC_APP_URL="http://localhost:3000"

Setup Prisma

Add MySQL Database (I used PlanetScale)

npx prisma db push

Seed categories:

node scripts/seed.ts

Start the app

npm run dev

Available commands

Running commands with npm npm run [command]

command	description
dev	Starts a development instance of the app