A stunning ChatGPT-style AI chatbot powered by Google Gemini 2.0 Flash. Features real-time streaming responses, markdown rendering, syntax highlighting, and conversation history. ⚡
GeminiChat is a fast and responsive AI chatbot clone built to interact with Google's latest Gemini 2.0 Flash model. It demonstrates how to handle readable streams in the browser to create a typewriter-style response effect, identical to ChatGPT.
- Real-time Streaming: See the AI's response type out in real-time.
- Rich Text Support: Full markdown rendering for bold text, lists, and tables.
- Code Highlighting: Syntax highlighting for code blocks generated by the AI.
- Conversation History: Maintains context of the chat session.
- Blazing Fast: Built with Vite and React for optimal performance.
Follow these steps to set up the project locally on your machine.
- Node.js (v18 or higher)
- npm or yarn
- Google Gemini API Key
-
Clone the repository
git clone https://github.com/buildbyabhi/gemini-chat.git cd gemini-chat -
Install dependencies
npm install # or yarn install -
Set up Environment Variables Create a
.envfile in the root directory and add your API key:VITE_GEMINI_API_KEY=your_api_key_here
-
Run the App
npm run dev
- Frontend: React, Vite
- AI Model: Google Gemini 2.0 Flash via
@google/generative-aiSDK - Styling: CSS/TailwindCSS
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.
Don't forget to give the project a star! Thanks again! ⭐
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature) - Commit your Changes (
git commit -m 'Add some AmazingFeature') - Push to the Branch (
git push origin feature/AmazingFeature) - Open a Pull Request
Abhishek Kumar
- GitHub: @buildbyabhi
- Email: buildbyabhi.dev@gmail.com
- Portfolio: buildbyabhi.github.io