Trip Planner

A Flask and React-based project that generates personalized travel itineraries based on user preferences like destination, budget, and activities.

📁 Project Structure

trip-planner/
├── node_modules/                  # React dependencies (auto-generated)
├── public/                        # Static assets (React)
│   └── index.html                 # Main HTML template for React
└── src/                           # React components
│   ├── components/                # React UI components
│   │     ├── AuthForm.jsx         # User authentication form (e.g., login/signup)
│   │     ├── dashboard.jsx        # Main dashboard with travel preference form
│   │	    ├── TripPlan.jsx
│   │     └── firebaseConfig.js
│   ├── CSS                        # CSS file
│        ├── AuthForm.css
│        ├── dashboard.css
│        └── TripPlan.css
│   ├── App.js                     # Main React component
│   └── index.js                   # React entry point
├── database                       # store ur .json file here
│    └── serviceAccountKey.json
├── app.py
├── app.js                         # JS version of app.py
├── userdb.py                      # python script for local database
├── server.py                      # Main Flask app (initializes server and routes)
├── server.js                      # JS version of server.js (NODE.js)
├── app.js    
├── user.db                        # local database

🚀 Getting Started

1. Clone the Repository

git clone <your-repo-url>
cd trip-planner

2. Set Up Flask Backend

1. Create a virtual environment:

   python -m venv venv
   source venv/bin/activate  # On Windows: venv\Scripts\activate

2. Install dependencies:

   pip install -r requirements.txt

3. Run the Flask app:

   python app.py

3. Set Up React Frontend

1. Ensure you're in the project root:

   cd trip-planner

2. Install React dependencies:

   npm install

3. Start the React app:

   npm start

4. Access the Application

Visit http://localhost:3000 to use the trip-planner UI.

📌 Key Features

• AuthForm.jsx: Provides a user login/signup interface.
• Dashboard.jsx: Collects destination, travel dates, budget, activities, and group size. Sends data to /api/generate-itinerary.
• API Integration: Connects the React UI to Flask for dynamic itinerary generation.

📚 Explanation of Core Files

1. app.py: Main Flask entry point that initializes the server and registers blueprints.

2. preference.py: Handles travel preference logic and processes /api/generate-itinerary requests.

3. userdb.py: Manages user-related functions like data storage and validation.

4. React UI:

   • AuthForm.jsx: User authentication form.
   • Dashboard.jsx: Travel preferences form for itinerary generation.

5. requirements.txt: Contains all necessary Python packages for the Flask backend.

✅ Future Improvements

• Enhance itinerary with third-party APIs (e.g., Google Maps).
• Add persistent user authentication and save plans.
• Implement detailed error handling and form validation.

📄 requirements.txt Content

Flask
Flask-Cors
requests

To install all necessary packages, run:

pip install -r requirements.txt