# Hotel Reservation System

A full-stack hotel reservation management application built with React, Node.js, Express, and MySQL.

## Project Structure

```
hotel-app/
├── backend/                    # Node.js/Express API server
│   ├── routes/                # API route handlers
│   │   ├── auth.js           # Authentication routes (login, register)
│   │   ├── rooms.js          # Room CRUD operations
│   │   ├── customers.js      # Customer CRUD operations
│   │   ├── bookings.js       # Booking CRUD operations
│   │   ├── payments.js       # Payment CRUD operations
│   │   └── reports.js        # Reporting endpoints
│   ├── middleware/
│   │   └── auth.js           # JWT authentication middleware
│   ├── db.js                 # MySQL database connection
│   ├── server.js             # Express server setup
│   ├── package.json          # Backend dependencies
│   ├── .env                  # Environment variables
│   └── .env.example          # Example environment file
├── frontend/                  # React Vite application
│   ├── src/
│   │   ├── components/
│   │   │   ├── Login.jsx              # Login page
│   │   │   ├── Register.jsx           # Registration page
│   │   │   ├── RoomList.jsx           # Room list display
│   │   │   ├── RoomForm.jsx           # Room form (modal)
│   │   │   ├── CustomerList.jsx       # Customer list display
│   │   │   ├── CustomerForm.jsx       # Customer form (modal)
│   │   │   ├── BookingList.jsx        # Booking list display
│   │   │   ├── BookingForm.jsx        # Booking form (modal)
│   │   │   ├── PaymentList.jsx        # Payment list display
│   │   │   ├── PaymentForm.jsx        # Payment form (modal)
│   │   │   └── ReportList.jsx         # Reports and analytics
│   │   ├── App.jsx                    # Main app component with routing
│   │   ├── App.css                    # App styles
│   │   ├── main.jsx                   # React entry point
│   │   └── index.css                  # Global styles
│   ├── package.json          # Frontend dependencies
│   ├── vite.config.js        # Vite configuration
│   └── index.html            # HTML template
├── database.sql              # Database schema and initial data
└── README.md                 # This file
```

## Features

- **User Authentication**: Secure login/register system with JWT tokens
- **Room Management**: Add, edit, delete, and view hotel rooms
- **Customer Management**: Manage customer information and details
- **Booking System**: Create and manage room bookings with check-in/check-out dates
- **Payment Processing**: Track payments for bookings
- **Reports**: Generate occupancy, revenue, booking, and customer reports
- **Responsive UI**: Clean, modern interface using Tailwind CSS

## Technology Stack

### Backend
- **Node.js** - JavaScript runtime
- **Express.js** - Web framework
- **MySQL2** - Database driver
- **JWT** - Authentication
- **bcryptjs** - Password hashing
- **CORS** - Cross-origin requests

### Frontend
- **React** - UI library
- **React Router** - Client-side routing
- **Axios** - HTTP client
- **Vite** - Build tool
- **Tailwind CSS** - Utility-first CSS framework

## Setup Instructions

### Prerequisites
- Node.js (v16+)
- MySQL Server
- npm or yarn package manager

### Backend Setup

1. **Navigate to the backend directory**
   ```bash
   cd backend
   ```

2. **Install dependencies**
   ```bash
   npm install
   ```

3. **Configure environment variables**
   - Copy or rename `.env.example` to `.env`
   - Update database credentials:
     ```
     DB_HOST=localhost
     DB_USER=root
     DB_PASSWORD=your_password
     DB_NAME=hotel_db
     PORT=5000
     JWT_SECRET=your_secret_key
     ```

4. **Set up the database**
   ```bash
   mysql -u root -p < ../database.sql
   ```

5. **Start the server**
   ```bash
   npm start
   # or for development with auto-reload
   npm run dev
   ```

   The API server will be running at `http://localhost:5000`

### Frontend Setup

1. **Navigate to the frontend directory**
   ```bash
   cd frontend
   ```

2. **Install dependencies**
   ```bash
   npm install
   ```

3. **Install and configure Tailwind CSS** (optional if you want to customize styling)
   - The project is ready to use with basic CSS
   - If you want Tailwind, run: `npm install -D tailwindcss`

4. **Start the development server**
   ```bash
   npm run dev
   ```

   The application will be available at `http://localhost:5173`

## API Endpoints

### Authentication
- `POST /api/auth/register` - Register a new user
- `POST /api/auth/login` - Login user

### Rooms
- `GET /api/rooms` - Get all rooms
- `GET /api/rooms/:id` - Get a specific room
- `POST /api/rooms` - Create a new room (protected)
- `PUT /api/rooms/:id` - Update a room (protected)
- `DELETE /api/rooms/:id` - Delete a room (protected)

### Customers
- `GET /api/customers` - Get all customers
- `GET /api/customers/:id` - Get a specific customer
- `POST /api/customers` - Create a new customer (protected)
- `PUT /api/customers/:id` - Update a customer (protected)
- `DELETE /api/customers/:id` - Delete a customer (protected)

### Bookings
- `GET /api/bookings` - Get all bookings
- `GET /api/bookings/:id` - Get a specific booking
- `POST /api/bookings` - Create a new booking (protected)
- `PUT /api/bookings/:id` - Update a booking (protected)
- `DELETE /api/bookings/:id` - Delete a booking (protected)

### Payments
- `GET /api/payments` - Get all payments
- `GET /api/payments/:id` - Get a specific payment
- `POST /api/payments` - Create a new payment (protected)
- `PUT /api/payments/:id` - Update a payment (protected)
- `DELETE /api/payments/:id` - Delete a payment (protected)

### Reports
- `GET /api/reports/occupancy` - Room occupancy report (protected)
- `GET /api/reports/revenue` - Revenue report (protected)
- `GET /api/reports/bookings` - Booking report (protected)
- `GET /api/reports/customers` - Customer report (protected)

## Default Credentials

After setting up the database, you can login with:
- **Username**: admin
- **Password**: password

⚠️ **Important**: Change these credentials in production!

## Database Schema

The application uses the following main tables:
- `users` - User accounts for authentication
- `rooms` - Hotel room information
- `customers` - Customer information
- `bookings` - Room booking records
- `payments` - Payment records

See `database.sql` for the complete schema.

## Running Both Frontend and Backend

**Terminal 1 - Backend:**
```bash
cd backend
npm start
```

**Terminal 2 - Frontend:**
```bash
cd frontend
npm run dev
```

Access the application at `http://localhost:5173`

## Future Enhancements

- Email notifications for bookings and payments
- Advanced search and filtering
- User roles and permissions system
- Invoice generation
- Multi-language support
- Mobile app version
- Real-time notifications
- Integration with payment gateways

## Troubleshooting

### Database Connection Error
- Ensure MySQL is running
- Check credentials in `.env` file
- Verify the database exists: `mysql -u root -p -e "SHOW DATABASES;"`

### Port Already in Use
- Backend default port: 5000
- Frontend default port: 5173
- Change ports in `.env` or vite.config.js if needed

### CORS Issues
- Ensure backend is running before starting frontend
- Check CORS configuration in `backend/server.js`

## License

ISC

## Support

For issues or questions, please create an issue in the repository or contact the development team.
