Skip to content

Latest commit

 

History

History
252 lines (183 loc) · 5.7 KB

File metadata and controls

252 lines (183 loc) · 5.7 KB

🚀 Deploying Hook Forge to Render.com

Complete guide to deploy your futuristic Hook Forge app to Render.com using Docker.

📋 Prerequisites

  1. GitHub Account - Your code needs to be in a Git repository
  2. Render.com Account - Sign up at https://render.com (free)
  3. OpenAI API Key - Get from https://platform.openai.com/api-keys

🎯 Quick Deployment Steps

1. Push Your Code to GitHub

# Initialize git (if not already done)
git init

# Add all files
git add .

# Commit
git commit -m "feat: futuristic Hook Forge ready for deployment"

# Add your GitHub remote
git remote add origin https://github.com/k1lgor/hook-forge.git

# Push to GitHub
git push -u origin main

2. Deploy on Render.com

Option A: Using render.yaml (Recommended)

  1. Go to https://render.com/dashboard
  2. Click "New +""Blueprint"
  3. Connect your GitHub repository
  4. Render will auto-detect render.yaml
  5. Set environment variable:
    • OPENAI_API_KEY: Your OpenAI API key
  6. Click "Apply"

Option B: Manual Setup

  1. Go to https://render.com/dashboard

  2. Click "New +""Web Service"

  3. Connect your GitHub repository

  4. Configure:

    • Name: hook-forge
    • Environment: Docker
    • Region: Choose closest to you
    • Branch: main
    • Dockerfile Path: ./Dockerfile
    • Plan: Free or Starter
  5. Add Environment Variables:

    NODE_ENV=production
    PORT=3001
    OPENAI_API_KEY=your_openai_api_key_here
    JWT_SECRET=any_random_secret_string
    
  6. Click "Create Web Service"

3. Wait for Deployment

Render will:

  1. ✅ Clone your repository
  2. ✅ Build Docker image (takes 5-10 mins)
  3. ✅ Deploy your app
  4. ✅ Provide a URL (e.g., https://hook-forge.onrender.com)

🔧 Configuration Details

Environment Variables

Variable Required Description
NODE_ENV Yes Set to production
PORT Yes Set to 3001 (Render provides this)
OPENAI_API_KEY Yes Your OpenAI API key
JWT_SECRET Optional Random string for JWT (auto-generated)

Health Check

Render uses /health endpoint to verify your app is running.

Dockerfile Architecture

The multi-stage Dockerfile:

  1. deps: Installs dependencies
  2. client-builder: Builds React frontend
  3. server-builder: Builds Express backend
  4. runner: Production image with both built apps

Static File Serving

In production, the Express server serves:

  • API routes at /api/*
  • Static frontend files at /*

🎨 Post-Deployment

Access Your App

Visit your Render URL: https://your-app-name.onrender.com

Check Logs

  1. Go to Render Dashboard
  2. Click on your service
  3. View "Logs" tab

Monitor Health

Visit: https://your-app-name.onrender.com/health

Should return:

{
  "status": "ok"
}

🐛 Troubleshooting

Build Fails

Problem: Docker build fails
Solution: Check Render logs for errors. Common issues:

  • Missing dependencies in package.json
  • TypeScript compilation errors
  • Environment variables not set

App Won't Start

Problem: Deployment succeeds but app crashes
Solution:

  1. Check logs for errors
  2. Verify OPENAI_API_KEY is set correctly
  3. Ensure PORT environment variable is set

API Errors

Problem: Frontend loads but API calls fail
Solution:

  1. Check OpenAI API key is valid
  2. Check API key has credits
  3. Check server logs for errors

Database Issues

Problem: Patterns not loading
Solution:

  • Database auto-creates on first run
  • Check server/data/db.json exists
  • Restart the service on Render

💰 Pricing

Free Tier

  • ✅ 750 hours/month
  • ✅ Sleeps after 15 mins of inactivity
  • ✅ Wakes up on request (30 sec delay)
  • ✅ Perfect for demos

Starter Plan ($7/month)

  • ✅ Always running (no sleep)
  • ✅ Faster performance
  • ✅ Custom domains
  • ✅ Priority support

🚀 Updating Your App

  1. Make changes locally
  2. Commit and push to GitHub:
    git add .
    git commit -m "feat: update hook generator"
    git push
  3. Render auto-deploys on push!

🔒 Security Best Practices

✅ DO:

  • Use environment variables for secrets
  • Keep OpenAI API key secure
  • Enable HTTPS (automatic on Render)
  • Set strong JWT_SECRET

❌ DON'T:

  • Commit .env files
  • Hardcode API keys
  • Expose sensitive data in logs

📊 Production Checklist

  • GitHub repository is public or connected
  • OpenAI API key is valid and has credits
  • Environment variables are set on Render
  • Health check endpoint works
  • Build completes successfully
  • App is accessible via Render URL
  • All features work (Generate, Analyze, Patterns)

🎯 Next Steps

Custom Domain

  1. Go to Render Dashboard → Your Service
  2. Click "Settings"
  3. Scroll to "Custom Domain"
  4. Add your domain (e.g., hookforge.com)
  5. Update DNS records as instructed

SSL Certificate

  • Automatic! Render provides free SSL
  • Your site will be https:// automatically

Monitoring

  • View analytics in Render Dashboard
  • Set up email alerts for downtime
  • Monitor OpenAI API usage

📚 Additional Resources

🆘 Need Help?

  1. Render Community: https://community.render.com/
  2. Render Support: support@render.com
  3. Check Logs: Always check Render logs first

🎉 Success!

Once deployed, your futuristic Hook Forge app will be live at: https://your-app-name.onrender.com

Share it with the world! 🌍✨


Deployment Time: ~10 minutes
Cost: Free tier available
Difficulty: Easy 🟢