# Complete Deployment Guide - Backend + Frontend

This guide covers deploying both Laravel backend and Quasar frontend to a shared hosting server.

## Deployment Structure

Your hosting should have this structure:
```
public_html/              ← Frontend files go here
├── index.html
├── css/
├── js/
└── ...

backend/                  ← Backend files go here (outside public_html)
├── app/
├── config/
├── database/
├── public/              ← This is Laravel's public folder
└── ...
```

---

## Part 1: Deploy Backend (Laravel)

### Step 1: Build Locally

1. Navigate to backend:
   ```bash
   cd backend
   ```

2. Install dependencies:
   ```bash
   composer install --optimize-autoloader --no-dev
   ```

3. Create production `.env` file (copy from `.env.example` and update):
   ```
   APP_ENV=production
   APP_DEBUG=false
   APP_URL=https://yourdomain.com
   FRONTEND_URL=https://yourdomain.com
   
   DB_CONNECTION=mysql
   DB_HOST=localhost
   DB_PORT=3306
   DB_DATABASE=your_database_name
   DB_USERNAME=your_database_user
   DB_PASSWORD=your_database_password
   
   SESSION_DOMAIN=yourdomain.com
   SANCTUM_STATEFUL_DOMAINS=yourdomain.com
   ```

4. Generate application key:
   ```bash
   php artisan key:generate
   ```

5. Optimize Laravel:
   ```bash
   php artisan config:cache
   php artisan route:cache
   php artisan view:cache
   ```

### Step 2: Upload Backend Files

**Option A: Upload entire backend folder**
1. Zip the entire `backend` folder
2. Upload to your server (e.g., `/home/username/backend/`)
3. Extract it **outside** `public_html`

**Option B: Use FTP**
1. Connect via FTP
2. Create a `backend` folder outside `public_html`
3. Upload all backend files there

### Step 3: Configure Backend on Server

1. **Move Laravel's public folder contents:**
   - Copy files from `backend/public/` to a subfolder like `public_html/api/`
   - Update `public_html/api/index.php`:
   ```php
   require __DIR__.'/../../backend/bootstrap/app.php';
   ```

2. **Update .env file on server:**
   ```bash
   nano /home/username/backend/.env
   ```
   Update database credentials and URLs

3. **Run migrations:**
   ```bash
   cd /home/username/backend
   php artisan migrate --force
   ```

4. **Set permissions:**
   ```bash
   chmod -R 755 storage bootstrap/cache
   ```

---

## Part 2: Deploy Frontend (Quasar/Vue)

### Step 1: Update API URL in Frontend

Before building, update your frontend API configuration:

1. Find your API configuration file (usually in `src/boot/axios.js` or similar)
2. Update the base URL to your backend:
   ```javascript
   axios.defaults.baseURL = 'https://yourdomain.com/api'
   ```

### Step 2: Build Frontend Locally

1. Navigate to frontend:
   ```bash
   cd frontend
   ```

2. Install dependencies (if needed):
   ```bash
   npm install
   ```

3. Build for production:
   ```bash
   npm run build
   ```

4. Files will be in `frontend/dist/spa/`

### Step 3: Upload Frontend to public_html

⚠️ **CRITICAL**: Upload the **CONTENTS** of `dist/spa/`, NOT the folders!

**Method 1: ZIP and Extract (RECOMMENDED)**
1. Go **inside** `frontend/dist/spa/` on your computer
2. **Select ALL files inside** (index.html, css/, js/, fonts/, icons/, etc.)
3. Create a ZIP file: `frontend-build.zip`
4. Upload to `public_html` via cPanel
5. Extract in cPanel File Manager
6. Delete the zip file
7. Verify `index.html` is directly in `public_html`

**Method 2: FTP Upload**
1. Connect to your server
2. Navigate to `public_html`
3. On your computer, open `frontend/dist/spa/`
4. Select all files inside
5. Drag and drop to `public_html`

### Step 4: Configure .htaccess

Create/update `public_html/.htaccess`:

```apache
<IfModule mod_rewrite.c>
    RewriteEngine On
    
    # Redirect API requests to backend
    RewriteCond %{REQUEST_URI} ^/api/
    RewriteRule ^api/(.*)$ /api/index.php [L]
    
    # Handle frontend routing
    RewriteRule ^index\.html$ - [L]
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule . /index.html [L]
</IfModule>
```

---

## Final Structure on Server

```
/home/username/
├── public_html/           ← Your domain points here
│   ├── index.html        ← Frontend (Quasar/Vue)
│   ├── css/
│   ├── js/
│   ├── fonts/
│   ├── icons/
│   ├── api/              ← Laravel's public folder
│   │   ├── index.php
│   │   └── .htaccess
│   └── .htaccess         ← Handles routing
│
└── backend/              ← Laravel backend (hidden from web)
    ├── app/
    ├── config/
    ├── database/
    ├── .env             ← Production credentials
    └── ...
```

---

## Verification Checklist

### Backend:
- [ ] `.env` file has production settings
- [ ] Database credentials are correct
- [ ] `storage` and `bootstrap/cache` are writable
- [ ] Visit `https://yourdomain.com/api/` - should see Laravel response
- [ ] API routes work: `https://yourdomain.com/api/users` etc.

### Frontend:
- [ ] `index.html` is directly in `public_html`
- [ ] Visit `https://yourdomain.com` - frontend loads
- [ ] Check browser console (F12) - no 404 errors
- [ ] API calls work from frontend
- [ ] Login/authentication works

---

## Troubleshooting

### Frontend shows folder listing
- Ensure `index.html` is in `public_html`, not in subfolders
- Check if you uploaded `dist/spa` folders instead of their contents

### Backend 500 errors
- Check `.env` configuration
- Verify database credentials
- Ensure `storage` folders are writable: `chmod -R 755 storage`

### API not connecting
- Update frontend API URL in axios configuration
- Check CORS settings in `backend/config/cors.php`
- Verify `.htaccess` is redirecting `/api/` correctly

### CORS errors
Update `backend/config/cors.php`:
```php
'paths' => ['api/*', 'sanctum/csrf-cookie'],
'allowed_origins' => ['https://yourdomain.com'],
```

### Session/Auth issues
Update `backend/.env`:
```
SESSION_DOMAIN=yourdomain.com
SANCTUM_STATEFUL_DOMAINS=yourdomain.com
```

---

## Quick Commands Reference

### On Server (SSH):
```bash
# Navigate to backend
cd /home/username/backend

# Run migrations
php artisan migrate --force

# Clear cache
php artisan cache:clear
php artisan config:clear
php artisan route:clear
php artisan view:clear

# Recreate cache
php artisan config:cache
php artisan route:cache
php artisan view:cache

# Fix permissions
chmod -R 755 storage bootstrap/cache
```

### Rebuild Frontend:
```bash
cd frontend
npm run build
# Then upload dist/spa/* contents to public_html
```
