scriptshare-cursor-clone/DEPLOYMENT.md

🚀 ScriptShare - Platform Deployment Guide

Overview

ScriptShare is a modern React application with a Node.js API backend, designed to work seamlessly with any deployment platform including Vercel, Coolify, DigitalOcean App Platform, Railway, Render, and others.

📦 Application Structure

Frontend (React + Vite)

• Dockerfile: Dockerfile
• Build: Vite-based React application
• Output: Static files served by Nginx
• Port: 80

Backend API (Node.js + Express)

• Dockerfile: Dockerfile.api
• Runtime: Node.js 18 with TypeScript
• Port: 3000
• Health Check: /api/health

🔧 Deployment Options

Option 1: Vercel (Recommended for Frontend)

Frontend Deployment:

1. Connect your repository to Vercel
2. Set build command: npm run build
3. Set output directory: dist
4. Configure environment variables:

   VITE_APP_NAME=ScriptShare
   VITE_APP_URL=https://your-domain.vercel.app
   VITE_ANALYTICS_ENABLED=true
   

API Deployment:

• Deploy API separately to platforms like Railway, Render, or DigitalOcean
• Or use Vercel Functions (requires code modification)

Option 2: Coolify (Full Stack)

Deploy both frontend and API:

1. Create application from Git repository
2. Frontend:
   • Use Dockerfile
   • Port: 80
3. API:
   • Use Dockerfile.api
   • Port: 3000
4. Configure environment variables

Option 3: DigitalOcean App Platform

Create app.yaml:

name: scriptshare
services:
- name: frontend
  source_dir: /
  dockerfile_path: Dockerfile
  github:
    repo: your-username/scriptshare-cursor
    branch: main
  http_port: 80
  routes:
  - path: /
- name: api
  source_dir: /
  dockerfile_path: Dockerfile.api
  github:
    repo: your-username/scriptshare-cursor
    branch: main
  http_port: 3000
  routes:
  - path: /api
  envs:
  - key: NODE_ENV
    value: production
  - key: DATABASE_URL
    value: ${DATABASE_URL}
databases:
- name: scriptshare-db
  engine: MYSQL
  version: "8"

Option 4: Railway

1. Frontend: Connect repo, Railway auto-detects Dockerfile
2. API: Deploy from same repo using Dockerfile.api
3. Database: Add MySQL service
4. Configure environment variables

Option 5: Render

1. Frontend:
   • Static Site
   • Build Command: npm run build
   • Publish Directory: dist
2. API:
   • Web Service
   • Docker build using Dockerfile.api
3. Database: Add MySQL database

🏗️ Build Commands

Frontend

# Install dependencies
npm install

# Build for production
npm run build

# Preview build
npm run preview

API

# Install dependencies
npm install

# Build TypeScript
npm run build:api

# Start API server
npm run start:api

🔐 Environment Variables

Frontend (Build-time)

• VITE_APP_NAME - Application name
• VITE_APP_URL - Frontend URL
• VITE_ANALYTICS_ENABLED - Enable analytics (true/false)

API (Runtime)

• NODE_ENV - Environment (production/development)
• PORT - Server port (default: 3000)
• DATABASE_URL - MySQL connection string
• JWT_SECRET - JWT secret key
• CORS_ORIGIN - Allowed CORS origins

🗄️ Database Setup

MySQL Connection String Format:

DATABASE_URL=mysql://username:password@host:port/database

Required Tables:

The application uses Drizzle ORM. Run migrations after deployment:

npm run db:migrate

🔍 Health Checks

Frontend Health Check:

GET /health

API Health Check:

GET /api/health

📝 Platform-Specific Notes

Vercel

• Frontend deploys automatically
• Use Vercel Functions for API (requires modification)
• Environment variables in Vercel dashboard

Coolify

• Supports full Docker deployment
• Easy environment variable management
• Built-in SSL and domain management

DigitalOcean App Platform

• Use app.yaml for configuration
• Automatic HTTPS
• Managed database available

Railway

• Auto-deployment from Git
• Environment variables in dashboard
• Add-on database services

Render

• Separate frontend (static) and backend (web service)
• Auto-deployment from Git
• Environment variables in dashboard

🐳 Docker Commands

Build Frontend:

docker build -t scriptshare-frontend .
docker run -p 3000:80 scriptshare-frontend

Build API:

docker build -f Dockerfile.api -t scriptshare-api .
docker run -p 3001:3000 scriptshare-api

Local Development:

docker-compose up

🔧 Local Development

Frontend:

npm run dev

API:

npm run build:api
npm run start:api

Database:

npm run db:studio  # Drizzle Studio
npm run db:migrate # Run migrations

🚀 Quick Deploy Examples

Deploy to Vercel (Frontend):

vercel --prod

Deploy to Railway:

railway deploy

Deploy to Render:

Connect GitHub repository in Render dashboard

📞 Support

• Documentation: Check platform-specific documentation
• Environment: Ensure all required environment variables are set
• Health Checks: Monitor /health and /api/health endpoints
• Logs: Check platform logs for deployment issues

---

Your ScriptShare application is ready for deployment on any modern platform! 🎉

Choose the platform that best fits your needs - from simple static hosting to full-stack container deployments.