A modern real-time chat application powered by React, Tailwind CSS, WebSockets, and Google Gemini API.
Supports Markdown rendering, model selection, and a sleek black-themed UI inspired by modern chat apps.

✨ Features

• Real-time communication using WebSockets
• Modern black-themed chat UI built with Tailwind CSS
• Markdown rendering with React Markdown + remark-gfm
• Switch between multiple Gemini models (2.0 Flash, 2.5 Flash, 1.5 Flash)

🛠 Tech Stack

Frontend

• React
• Tailwind CSS
• React Markdown + remark-gfm

Backend

• Express.js
• ws (WebSockets)
• Axios
• dotenv

API

• Gemini API

📂 Project Structure

.
├── backend/               # Node.js + Express + WebSocket server
│   ├── server.js          
│   ├── .env               # API key (ignored in Git)
│   └── package.json
├── frontend/              # React + Tailwind frontend
│   ├── src/
│   │   ├── App.jsx        
│   │   ├── index.css     
│   └── package.json
└── README.md

🚀 Getting Started

1. Clone the repository

git clone https://github.com/Aparnamol-KS/Gemini-chat.git
cd Gemini-chat

2. Setup Backend

cd backend
npm install

• Create a .env file inside backend/

  API_KEY=your_api_key_here
  

• Start the backend

  node server.js
  

  Runs at: ws://localhost:3000

3. Setup Frontend

cd frontend
npm install
npm run dev

Runs at: http://localhost:5173

📖 Documents

Here are some useful references and documentation that were helpful while building this project:

• Google Gemini API Documentation
• WebSockets in Node.js
• React Official Docs
• Tailwind CSS Documentation
• React Markdown Guide

📜 License

This project is licensed under the MIT License