Skip to content

deployment.md

Latest commit

 

History

History
96 lines (75 loc) · 4.06 KB

deployment.md

File metadata and controls

96 lines (75 loc) · 4.06 KB

Deployment Guide

This guide covers how to deploy the Web Application to the cloud and how to package the Desktop Application as an executable file.

Part 1: Deployment Preparation (Crucial)

Before deploying, you must update the API URLs so your apps know where to send data (instead of localhost).

1. Web App (React)

The code is already set up to look for an environment variable.

  • Locally: It uses http://localhost:8000/api/ by default.
  • In Production (Render/Netlify): Add an Environment Variable named VITE_API_URL with your backend URL (e.g., https://your-app.onrender.com/api/).
  • Alternatively, modify frontend-web/src/api.js manually.

2. Desktop App (PyQt5)

  • Open frontend-desktop/main.py.
  • Locate line 12: API_BASE_URL.
  • Uncomment the Production URL and comment out the Localhost URL: 
    API_BASE_URL = "https://your-app.onrender.com/api/"
# API_BASE_URL = "http://localhost:8000/api/"
  • Then build the executable (Part 4).

Part 2: Backend Deployment (Render.com)

  1. Repo: Push your code to GitHub.

  2. Service: Create a new Web Service on Render.

  3. Settings:

    • Root Directory: backend (Important!)
    • Build Command: pip install -r requirements.txt && python manage.py migrate && python create_superuser.py
    • Start Command: gunicorn config.wsgi:application

  4. Environment Variables:

    • PYTHON_VERSION: 3.13.0
    • SECRET_KEY: (Random String)
    • DEBUG: False
    • ADMIN_USERNAME: admin
    • ADMIN_PASSWORD: yoursecurepassword

  5. Important: Update backend/config/settings.py with your Vercel URL.

    • Once you deploy the frontend (Part 3), copy the URL (e.g., https://my-app.vercel.app).
    • Add it to CORS_ALLOWED_ORIGINS in settings.py.
    • Redeploy the Backend.

Part 3: Frontend Deployment (Vercel)

  1. Repo: Push code to GitHub.
  2. Service: Import project on Vercel.
  3. Settings:
    • Root Directory: frontend-web
    • Framework Preset: Vite
    • Build Command: npm run build
    • Output Directory: dist
  4. Environment Variables:
    • VITE_API_URL: https://your-render-backend-name.onrender.com/api/ (Note: Must end with /)

Part 4: Desktop Application (Windows .exe)

We will use PyInstaller to convert the Python scripts into a standalone .exe file that can run on any Windows machine without needing Python installed.

1. Install PyInstaller

Warning: Ensure you are in your virtual environment.

pip install pyinstaller

2. Build the Executable

Run the following command from the root directory (ChemicalEquipmentVisualizer):

pyinstaller --noconfirm --onefile --windowed --name "ChemEquipVisualizer" --add-data "backend/db.sqlite3;." --hidden-import "matplotlib.backends.backend_qt5agg" frontend-desktop/main.py
  • --onefile: Packages everything into a single .exe.
  • --windowed: Hides the console window (no black box popping up).
  • --add-data: Includes the database file inside the exe (Note: Data changes inside the exe won't persist after restart. For data persistence in an exe, you usually keep the DB outside).
  • --hidden-import: Ensures hidden dependencies like Matplotlib's backend are found.

3. Run

The executable will be in the dist/ folder.

  • Locate dist/ChemEquipVisualizer.exe.
  • Double-click to run.

Part 5: Keeping the Server Active (No Sleep)

Free tier services (Render/Heroku) often "sleep" after 15 minutes of inactivity, causing a 30-50 second delay on the next request.

Strategy: Use a Cron Job Pinger I added a special "Ping" endpoint to your API: GET /api/ping/.

  1. Sign up for a free service like Cron-job.org or UptimeRobot.
  2. Create a new Monitor/Job.
  3. URL: https://your-app-name.onrender.com/api/ping/
  4. Interval: Every 14 minutes.
  5. Method: HTTP GET.

This will send a tiny request to your server 24/7, preventing it from ever going to sleep!