/aiChatbot

An AI chatbot application using Next.js which can handle Customer support queries as well as general knowledge questions, based on selection.

Primary LanguageJavaScript

AI-Powered Customer Support Chatbot

Project Overview

This project is an AI-powered Customer Support System, developed as part of the Headstarter AI Fellowship. It features general query support, personalized customer support queries and AI-powered general knowledge query switch to make the bot answer any question you throw at it.

Dashboard Screenshot - White Dashboard Screenshot - Black

🌟 Features

  • Customer Support chatbot for Headstarter AI platform
  • AI-powered chats
  • Smart and personalizable chats for better user experience
  • Dark mode for comfortable viewing
  • Responsive design for various screen sizes

🛠️ Technologies Used

🚀 Live Demo

Check out the live demo deployed on Vercel: [Click Here!]

🏁 Getting Started

To get a local copy up and running, follow these steps:

  1. Clone the repository:
git clone https://github.com/nehalpatil7/aiChatbot.git
  1. Navigate to the project directory:
cd ai-cs
  1. Install dependencies:
npm install
  1. Set up environment variables: Create a .env.local file in the root directory of your project & add the following environment variables:
NEXT_PUBLIC_OPENROUTER_ENDPOINT=your_openrouter_endpoint
OPENROUTER_API_KEY=your_openrouter_api_key

Replace the placeholder values (your_openrouter_endpoint, your_openrouter_api_key, etc.) with your actual OpenRouter credentials.

For the OpenAI API key, sign up at the OpenRouter website to get your API key.

  1. Run the development server:
npm run dev
  1. Open http://localhost:3000 with your browser to see the result.

🐛 Troubleshooting

If you encounter any issues while setting up or running the project, try the following:

  1. Ensure all dependencies are installed:
npm install
  1. Clear Next.js cache:
rm -rf .next
  1. Rebuild the project:
npm run build

  1. For OpenAI API issues, verify that your API key is correctly set in the .env file and that you have sufficient credits in your OpenAI account.

  2. If you're encountering CORS issues with the OpenAI API, ensure that your serverless function (in pages/api/route.js) is correctly configured to handle the API request.

👤 Author

Nehal Patil

🙏 Acknowledgments

  • Headstarter AI Fellowship for the opportunity and support
  • OpenAI for providing the powerful API
  • All contributors and reviewers
  • Bill Zhang for the amazing tutorials