Deployment - Moorcheh Documentation

Pre-Deployment Checklist

Ensure your application is ready for production deployment:

Environment Configuration

API key is properly configured
Namespace is set up and documents are uploaded
Appearance configuration is finalized
Environment variables are set for production

Build & Testing

Application builds successfully
All tests pass
Chat functionality works correctly
Responsive design works on all devices

Security & Performance

API keys are not exposed in client-side code
Environment variables are properly configured
Images and assets are optimized
Bundle size is reasonable

Vercel Deployment (Recommended)

Deploy to Vercel with one click for the best Next.js experience.

One-Click Deploy

Deploy with Vercel

Click here to deploy directly to Vercel

Manual Deployment

If you prefer manual deployment:

Push to Repository

Push your code to GitHub, GitLab, or Bitbucket

Connect to Vercel

Connect your repository to Vercel

Configure Environment Variables

Set environment variables in Vercel dashboard

Deploy

Deploy automatically on every push

Environment Variables

Set these in your Vercel project settings:

NEXT_PUBLIC_MOORCHEH_API_KEY=your_production_api_key_here

Netlify Deployment

Alternative deployment option with Netlify.

Build Configuration

Create a netlify.toml file in your project root:

[build]
  command = "npm run build"
  publish = ".next"

[build.environment]
  NODE_VERSION = "18"

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

Deployment Steps

Push to Repository

Push your code to a Git repository

Connect to Netlify

Connect your repository to Netlify

Set Build Command

Set build command: npm run build

Set Publish Directory

Set publish directory: .next

Configure Environment Variables

Set environment variables in Netlify dashboard

Deploy

Deploy your application

Environment Variables

Set in Netlify dashboard under Site settings → Environment variables:

NEXT_PUBLIC_MOORCHEH_API_KEY=your_production_api_key_here

Environment Configuration

Configure your application for different environments.

Environment Files

Create environment-specific configuration files:

# .env.local (development)
NEXT_PUBLIC_MOORCHEH_API_KEY=your_dev_api_key_here

# .env.production (production)
NEXT_PUBLIC_MOORCHEH_API_KEY=your_production_api_key_here

# .env.staging (staging)
NEXT_PUBLIC_MOORCHEH_API_KEY=your_staging_api_key_here

Next.js Configuration

Update your next.config.js:

/** @type {import('next').NextConfig} */
const nextConfig = {
  // Enable standalone output for Docker
  output: 'standalone',
  
  // Environment-specific settings
  env: {
    CUSTOM_KEY: process.env.CUSTOM_KEY,
  },
  
  // Image optimization
  images: {
    domains: ['your-domain.com'],
    formats: ['image/webp', 'image/avif'],
  },
  
  // Security headers
  async headers() {
    return [
      {
        source: '/(.*)',
        headers: [
          {
            key: 'X-Frame-Options',
            value: 'DENY',
          },
          {
            key: 'X-Content-Type-Options',
            value: 'nosniff',
          },
          {
            key: 'Referrer-Policy',
            value: 'origin-when-cross-origin',
          },
        ],
      },
    ];
  },
};

module.exports = nextConfig;

Post-Deployment

Steps to take after successful deployment:

1. Verify Deployment

Check that your application loads correctly
Verify chat functionality works
Test responsive design on different devices
Confirm environment variables are loaded

2. Performance Monitoring

Monitor Core Web Vitals
Check bundle size and loading times
Monitor API response times
Set up error tracking (e.g., Sentry)

3. Security & Maintenance

Regularly update dependencies
Monitor for security vulnerabilities
Backup configuration files
Set up automated deployments

Troubleshooting

Common deployment issues and solutions:

Build Failures

Common Issues:

Missing environment variables
TypeScript compilation errors
Missing dependencies
Node.js version incompatibility

Runtime Errors

Common Issues:

API key not accessible
CORS issues
Missing API configuration
Environment variable loading issues

Debugging Steps

Check Build Logs

Review build logs for errors

Verify Environment Variables

Ensure all required variables are set

Test API Connectivity

Verify API endpoints are accessible

Check Browser Console

Look for client-side errors

Verify Configuration Files

Ensure all config files are present

Continuous Deployment

Set up automated deployments for seamless updates.

GitHub Actions

Create .github/workflows/deploy.yml:

name: Deploy to Production

on:
  push:
    branches: [ main ]

jobs:
  deploy:
    runs-on: ubuntu-latest
    
    steps:
    - uses: actions/checkout@v3
    
    - name: Setup Node.js
      uses: actions/setup-node@v3
      with:
        node-version: '18'
        cache: 'npm'
    
    - name: Install dependencies
      run: npm ci
    
    - name: Build application
      run: npm run build
      env:
        NEXT_PUBLIC_MOORCHEH_API_KEY: ${{ secrets.NEXT_PUBLIC_MOORCHEH_API_KEY }}
    
    - name: Deploy to Vercel
      uses: amondnet/vercel-action@v25
      with:
        vercel-token: ${{ secrets.VERCEL_TOKEN }}
        vercel-org-id: ${{ secrets.VERCEL_ORG_ID }}
        vercel-project-id: ${{ secrets.VERCEL_PROJECT_ID }}
        vercel-args: '--prod'

Required Secrets

Set these secrets in your GitHub repository:

NEXT_PUBLIC_MOORCHEH_API_KEY - Your production API key
VERCEL_TOKEN - Vercel deployment token
VERCEL_ORG_ID - Vercel organization ID
VERCEL_PROJECT_ID - Vercel project ID

Performance Optimization

Bundle Optimization

Use dynamic imports for large components
Optimize images with Next.js Image component
Enable compression and minification
Remove unused dependencies

Caching Strategy

Implement proper caching headers
Use CDN for static assets
Cache API responses when appropriate
Optimize database queries

Monitoring

Set up performance monitoring
Track Core Web Vitals
Monitor API response times
Set up error tracking

Security Best Practices

Environment Variables

Never commit API keys to version control
Use environment-specific configurations
Rotate keys regularly
Use secure key management

API Security

Implement rate limiting
Use HTTPS for all communications
Validate all inputs
Implement proper error handling

Application Security

Keep dependencies updated
Use security headers
Implement proper authentication
Regular security audits

Support

Need help with deployment?

Get Support

Contact our support team for deployment assistance

​Pre-Deployment Checklist

Environment Configuration

Build & Testing

Security & Performance

​Vercel Deployment (Recommended)

​One-Click Deploy

Deploy with Vercel

​Manual Deployment

​Environment Variables

​Netlify Deployment

​Build Configuration

​Deployment Steps

​Environment Variables

​Environment Configuration

​Environment Files

​Next.js Configuration

​Post-Deployment

​1. Verify Deployment

​2. Performance Monitoring

​3. Security & Maintenance

​Troubleshooting

​Build Failures

​Runtime Errors

​Debugging Steps

​Continuous Deployment

​GitHub Actions

​Required Secrets

​Performance Optimization

​Bundle Optimization

​Caching Strategy

​Monitoring

​Security Best Practices

​Environment Variables

​API Security

​Application Security

​Support

Get Support

Pre-Deployment Checklist

Vercel Deployment (Recommended)

One-Click Deploy

Manual Deployment

Environment Variables

Netlify Deployment

Build Configuration

Deployment Steps

Environment Variables

Environment Configuration

Environment Files

Next.js Configuration

Post-Deployment

1. Verify Deployment

2. Performance Monitoring

3. Security & Maintenance

Troubleshooting

Build Failures

Runtime Errors

Debugging Steps

Continuous Deployment

GitHub Actions

Required Secrets

Performance Optimization

Bundle Optimization

Caching Strategy

Monitoring

Security Best Practices

Environment Variables

API Security

Application Security

Support