Skip to content

Ali-Haggag7/Gemini-AI-Clone

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

7 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

โœจ Gemini AI Clone

A pixel-perfect clone of Google Gemini built with React.js. Integrated with the official Google Generative AI SDK to provide real-time, intelligent conversations.


Project Preview

๐Ÿ”ฅ Key Features

๐Ÿค– AI Intelligence

  • Powered by Gemini Pro: Direct integration with Google's latest LLM via gemini.js config.
  • Smart Context: Maintains conversation context for fluid interactions.
  • Real-time Responses: Instant streaming of AI answers.

๐ŸŽจ UI/UX Design

  • Modern Interface: Replicates the clean, minimalist look of the original Gemini.
  • Sidebar Navigation: Manage chat history and sessions (Sidebar.jsx).
  • Responsive Layout: Optimized for both desktop and mobile views (Main.jsx).

๐Ÿ› ๏ธ Engineering Concepts

  • State Management: Utilizes React Context API (Context.jsx) to handle global state (prompts, results, loading status) without prop drilling.
  • Component Architecture: Modular structure separating Logic, UI, and Configuration.

๐Ÿ› ๏ธ Tech Stack

Component Technology
Frontend Framework React.js (Hooks & Functional Components)
AI Integration Google Generative AI SDK (@google/generative-ai)
State Management React Context API
Styling Modern CSS3 & Flexbox
Assets SVG Icons & Dynamic Assets

๐Ÿš€ Getting Started

Follow these steps to run your own AI assistant locally:

1. Clone & Install

# Clone the repository
git clone [https://github.com/Ali-Haggag7/Gemini-AI-Clone.git](https://github.com/Ali-Haggag7/Gemini-AI-Clone.git)
cd Gemini-AI-Clone

# Install dependencies
npm install

2. Get Your API Key

Go to Google AI Studio.

Create a new API Key.

3. Setup Configuration

Note: Ideally, use environment variables (.env). If you are using config/gemini.js, paste your key there (but never push it to GitHub).

4. Run the App

npm start

Open http://localhost:3000 to view it in the browser.

๐Ÿ“ธ Interface Previews

Chat Interface Mobile Preview


Made with โค๏ธ by Ali Haggag

About

๐Ÿค– A fully functional Google Gemini Clone built with React.js and the Google Generative AI SDK. Features real-time chat, history management, and Context API integration.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors