Spaces:
Sleeping
Sleeping
| # π€ Deploy to Hugging Face Spaces (FREE) | |
| Complete step-by-step guide to deploy your Smart Escalation API to Hugging Face Spaces for FREE. | |
| ## Why Hugging Face Spaces? | |
| - β **FREE** - No credit card required | |
| - β **2GB RAM** - Enough for ML models (vs Render's 512MB free tier) | |
| - β **Optimized for ML** - Built for apps like yours | |
| - β **Easy deployment** - Push code via Git | |
| - β **Automatic HTTPS** - Secure by default | |
| --- | |
| ## Step 1: Create Hugging Face Account (2 minutes) | |
| 1. **Go to Hugging Face** | |
| - Visit: https://huggingface.co/join | |
| 2. **Sign Up** | |
| - Enter your email | |
| - Choose a username (e.g., `yourname`) | |
| - Create password | |
| - Verify email | |
| 3. **Get Access Token** | |
| - Go to: https://huggingface.co/settings/tokens | |
| - Click **"New token"** | |
| - Name: `escalation-api-deploy` | |
| - Role: **Write** | |
| - Click **"Generate a token"** | |
| - **Copy the token** - you'll need it soon! | |
| --- | |
| ## Step 2: Create a New Space (3 minutes) | |
| 1. **Create Space** | |
| - Go to: https://huggingface.co/new-space | |
| - Or click your profile β **"New Space"** | |
| 2. **Configure Space** | |
| - **Owner**: Your username | |
| - **Space name**: `escalation-api` (or any name you like) | |
| - **License**: MIT | |
| - **Select the Space SDK**: Choose **"Docker"** (important!) | |
| - **Space hardware**: CPU basic (free) | |
| - **Visibility**: Public | |
| - Click **"Create Space"** | |
| 3. **Wait for Space Creation** | |
| - You'll see a page with instructions | |
| - Keep this page open | |
| --- | |
| ## Step 3: Add Required Files (5 minutes) | |
| We need to add a few files for Hugging Face Spaces: | |
| ### 3.1: Create Dockerfile | |
| I'll create a Dockerfile for you: | |
| ```bash | |
| # This will be created automatically in the next step | |
| ``` | |
| ### 3.2: Create .env.example for Spaces | |
| ```bash | |
| # This will be created automatically in the next step | |
| ``` | |
| Let me create these files now: | |
| --- | |
| ## Step 4: Push Code to Hugging Face (5 minutes) | |
| ### 4.1: Add Hugging Face Remote | |
| Open your terminal and run: | |
| ```bash | |
| # Add Hugging Face as a git remote | |
| # Replace YOUR_USERNAME with your actual Hugging Face username | |
| git remote add hf https://huggingface.co/spaces/YOUR_USERNAME/escalation-api | |
| ``` | |
| Example: | |
| ```bash | |
| git remote add hf https://huggingface.co/spaces/john/escalation-api | |
| ``` | |
| ### 4.2: Commit New Files | |
| ```bash | |
| # Add the new Hugging Face files | |
| git add Dockerfile README_SPACES.md app.py | |
| # Commit | |
| git commit -m "Add Hugging Face Spaces deployment files" | |
| ``` | |
| ### 4.3: Push to Hugging Face | |
| ```bash | |
| # Push to Hugging Face Spaces | |
| git push hf main | |
| ``` | |
| **You'll be prompted for credentials:** | |
| - **Username**: Your Hugging Face username | |
| - **Password**: Use the **access token** you created in Step 1 (NOT your password!) | |
| --- | |
| ## Step 5: Configure Environment Variables (3 minutes) | |
| 1. **Go to Your Space** | |
| - Visit: `https://huggingface.co/spaces/YOUR_USERNAME/escalation-api` | |
| 2. **Open Settings** | |
| - Click the **"Settings"** tab at the top | |
| 3. **Add Secrets (Environment Variables)** | |
| - Scroll down to **"Repository secrets"** | |
| - Click **"New secret"** for each variable: | |
| | Name | Value | | |
| |------|-------| | |
| | `GOOGLE_API_KEY` | Your Gemini API key from https://makersuite.google.com/app/apikey | | |
| | `ARTICLES_DIR` | `data/articles` | | |
| | `EMBEDDING_MODEL` | `all-MiniLM-L6-v2` | | |
| | `RELEVANCE_THRESHOLD` | `0.5` | | |
| | `TOP_K_CHUNKS` | `3` | | |
| | `CHUNK_SIZE` | `500` | | |
| | `CHUNK_OVERLAP` | `50` | | |
| | `LLM_MODEL` | `gemini-1.5-flash` | | |
| | `LLM_TEMPERATURE` | `0.3` | | |
| | `CORS_ORIGINS` | `https://escalation-api-frontend.vercel.app,http://localhost:5173` | | |
| 4. **Save Each Secret** | |
| - Click **"Add secret"** after entering each one | |
| --- | |
| ## Step 6: Wait for Build (10-15 minutes) | |
| 1. **Go to "App" Tab** | |
| - Click the **"App"** tab at the top | |
| 2. **Watch Build Logs** | |
| - You'll see the Docker build progress | |
| - It will download ML models (~2GB) | |
| - This takes 10-15 minutes on first build | |
| 3. **Build Complete** | |
| - When done, you'll see: **"Running"** status | |
| - Your API is now live! π | |
| --- | |
| ## Step 7: Test Your API (2 minutes) | |
| ### 7.1: Get Your API URL | |
| Your API is available at: | |
| ``` | |
| https://YOUR_USERNAME-escalation-api.hf.space | |
| ``` | |
| Example: | |
| ``` | |
| https://john-escalation-api.hf.space | |
| ``` | |
| ### 7.2: Test with curl | |
| ```bash | |
| curl -X POST https://YOUR_USERNAME-escalation-api.hf.space/ask \ | |
| -H "Content-Type: application/json" \ | |
| -d '{"question": "How do I reset my password?"}' | |
| ``` | |
| ### 7.3: Test in Browser | |
| Visit: | |
| ``` | |
| https://YOUR_USERNAME-escalation-api.hf.space/docs | |
| ``` | |
| You'll see interactive API documentation where you can test the `/ask` endpoint. | |
| --- | |
| ## Step 8: Connect Frontend to Backend (5 minutes) | |
| Now connect your Vercel frontend to the Hugging Face backend: | |
| ### 8.1: Copy Your Backend URL | |
| ``` | |
| https://YOUR_USERNAME-escalation-api.hf.space | |
| ``` | |
| ### 8.2: Add to Vercel | |
| 1. Go to https://vercel.com/dashboard | |
| 2. Open your project: `escalation-api-frontend` | |
| 3. Go to **Settings** β **Environment Variables** | |
| 4. Click **"Add New"** | |
| - **Key**: `VITE_API_URL` | |
| - **Value**: `https://YOUR_USERNAME-escalation-api.hf.space` | |
| - **Environments**: Check all (Production, Preview, Development) | |
| 5. Click **"Save"** | |
| ### 8.3: Redeploy Frontend | |
| 1. Go to **Deployments** tab | |
| 2. Find the latest deployment | |
| 3. Click **"β―"** (three dots) β **"Redeploy"** | |
| 4. Click **"Redeploy"** to confirm | |
| 5. Wait 1-2 minutes | |
| --- | |
| ## Step 9: Test End-to-End (1 minute) | |
| 1. **Visit Your Frontend** | |
| - Go to: https://escalation-api-frontend.vercel.app/ | |
| 2. **Ask a Question** | |
| - Type: "How do I reset my password?" | |
| - Click **"Send"** | |
| 3. **Success!** π | |
| - You should get an answer from your Hugging Face backend | |
| - Your full-stack ML app is now live! | |
| --- | |
| ## π Deployment Complete! | |
| Your app is now fully deployed: | |
| - **Frontend**: https://escalation-api-frontend.vercel.app/ (Vercel - FREE) | |
| - **Backend**: https://YOUR_USERNAME-escalation-api.hf.space (Hugging Face - FREE) | |
| - **Total Cost**: $0/month π | |
| --- | |
| ## Troubleshooting | |
| ### Build fails with "Out of memory" | |
| **Solution**: Upgrade to Hugging Face Pro ($9/month) for more resources, or: | |
| - Use a smaller embedding model: `all-MiniLM-L6-v2` β `paraphrase-MiniLM-L3-v2` | |
| - Reduce dependencies in `requirements.txt` | |
| ### "Application startup failed" | |
| **Solution**: Check the logs in the "App" tab: | |
| - Verify `GOOGLE_API_KEY` is set correctly | |
| - Check that all environment variables are set | |
| - Look for Python errors in the logs | |
| ### API returns 404 | |
| **Solution**: | |
| - Make sure the Space is "Running" (not "Building" or "Sleeping") | |
| - Check the URL is correct: `https://YOUR_USERNAME-escalation-api.hf.space` | |
| - Visit `/docs` to see available endpoints | |
| ### Frontend shows "Failed to fetch" | |
| **Solution**: | |
| - Verify `VITE_API_URL` is set in Vercel | |
| - Check backend URL is correct (no trailing slash) | |
| - Make sure Hugging Face Space is running | |
| - Check CORS_ORIGINS includes your Vercel frontend URL | |
| ### Space goes to sleep | |
| **Solution**: Hugging Face Spaces on free tier sleep after inactivity: | |
| - First request after sleep takes 30-60 seconds (cold start) | |
| - Subsequent requests are fast | |
| - Upgrade to Pro ($9/month) for always-on instances | |
| --- | |
| ## Updating Your App | |
| To update your code: | |
| ```bash | |
| # Make changes to your code | |
| git add . | |
| git commit -m "Update feature" | |
| # Push to GitHub (for version control) | |
| git push origin main | |
| # Push to Hugging Face (to deploy) | |
| git push hf main | |
| ``` | |
| Hugging Face will automatically rebuild and redeploy. | |
| --- | |
| ## Cost Comparison | |
| | Platform | Free Tier | Paid Tier | RAM | Notes | | |
| |----------|-----------|-----------|-----|-------| | |
| | **Hugging Face** | FREE | $9/month | 2GB | Best for ML apps | | |
| | **Render** | 512MB (too small) | $7/month | 512MB+ | Good for web apps | | |
| | **Railway** | $5 credit | $5-20/month | 512MB+ | Pay as you go | | |
| | **Vercel** | β Can't deploy ML | β Can't deploy ML | 500MB limit | Frontend only | | |
| --- | |
| ## Next Steps | |
| - β Your app is live and working! | |
| - π Monitor usage in Hugging Face dashboard | |
| - π§ Add more help articles in `data/articles/` | |
| - π¨ Customize the frontend | |
| - π Track API usage and performance | |
| --- | |
| ## Need Help? | |
| - **Hugging Face Docs**: https://huggingface.co/docs/hub/spaces | |
| - **Hugging Face Discord**: https://discord.gg/hugging-face | |
| - **Your Space Settings**: https://huggingface.co/spaces/YOUR_USERNAME/escalation-api/settings | |
| Enjoy your FREE ML-powered API! π | |