An AI-powered web application that helps users plan personalized trips by suggesting destinations, hotels, and itineraries based on their preferences.
Built using React.js, Tailwind CSS,Google OAuth. Firebase, Radix UI, and the Google Gemini API.
🔗 Visit the App
💻 View Source Code
- 🧠 AI-Powered Suggestions: Generates travel itineraries, destinations, and hotel options using the Google Gemini API.
- 🔐 Google OAuth Authentication: Seamless and secure login via Firebase.
- 🗺️ Smart Planner: Recommends places and activities based on user preferences.
- 🎨 Modern UI/UX: Responsive, minimal design built with Tailwind CSS and Radix UI.
- ☁️ Cloud Data: Stores user preferences and plans securely using Firebase.
| Layer | Tools / Libraries |
|---|---|
| Frontend | React.js, Tailwind CSS, Radix UI |
| Backend | Firebase (Database) |
| AI | Google Gemini API |
| State Management | React Context API |
| Deployment | Vercel |
git clone https://github.com/mahesh-09-12/ai_trip_planner-web
cd ai-trip-planner
2️⃣ Install dependencies
npm install
3️⃣ Configure Environment Variables
Create a .env file in the project root and add:
env
VITE_FIREBASE_API_KEY=your_firebase_api_key
VITE_FIREBASE_AUTH_DOMAIN=your_auth_domain
VITE_FIREBASE_PROJECT_ID=your_project_id
VITE_GEMINI_API_KEY=your_gemini_api_key
4️⃣ Run the app
npm run dev
Visit http://localhost:5173 in your browser.
🧩 Folder Structure
src/
├── components/
├── pages/
├── context/
├── assets/
├── hooks/
└── App.jsx
💡 Future Improvements
Add interactive maps using Google Maps API.
Allow users to save and export travel itineraries.
Integrate flight booking and cost estimation.
🤝 Contributing
Contributions are welcome! Feel free to open an issue or submit a pull request.
📄 License
MIT License © 2025 Mahesh Gali