Skip to main content
The portal supports deployment to multiple hosting platforms. Each platform has different features, configurations, and pricing models.

​
Platform Overview

Netlify

Automatic deployments with preview URLs

Vercel

Optimized for Next.js applications

AWS S3

Static hosting with CloudFront CDN

​
Netlify Deployment

Netlify provides automatic deployments from Git with built-in CI/CD.

​
Configuration

The repository includes a netlify.toml configuration file:
netlify.toml
[[headers]]
  for = "/_next/image/*"

  [headers.values]
    Content-Security-Policy= "upgrade-insecure-requests"
    Strict-Transport-Security = "max-age=63072000; includeSubDomains; preload"
    X-XSS-Protection = "1; mode=block"
    X-Frame-Options = "DENY"
    X-Content-Type-Options = "nosniff"
    Referrer-Policy = "strict-origin-when-cross-origin"
    Permissions-Policy= "accelerometer=(self), ambient-light-sensor=(self), ..."
This configuration applies security headers to Next.js image optimization requests.

​
Deployment Steps

1

Connect Repository

  1. Log in to Netlify
  2. Click “Add new site” → “Import an existing project”
  3. Connect your Git provider (GitHub, GitLab, Bitbucket)
  4. Select the portal repository
2

Configure Build Settings

Set the following build configuration:
  • Build command: npm run build
  • Publish directory: .next
  • Node version: 22
3

Add Environment Variables

In Netlify dashboard, go to Site settings → Environment variables:
NEXT_PUBLIC_INFURA_PROJECT_ID=your_infura_id
NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID=your_wc_id
NEXT_PUBLIC_METADATACACHE_URI=https://aquarius.pontus-x.eu
NEXT_PUBLIC_MARKET_FEE_ADDRESS=0x...
AGROPORTAL_API_KEY=your_api_key
NEXT_TELEMETRY_DISABLED=1
4

Deploy

Click “Deploy site”. Netlify will:
  • Install dependencies
  • Build the application
  • Deploy to CDN
  • Provide a preview URL

​
Netlify Features

Every push to your main branch triggers a new deployment automatically.
Pull requests get unique preview URLs for testing before merging.
Deploy specific branches for staging or feature testing.
Add custom domains with automatic HTTPS certificates.

​
Netlify CLI Deployment

Deploy from command line: 
# Install Netlify CLI
npm install -g netlify-cli

# Login to Netlify
netlify login

# Build and deploy
npm run build
netlify deploy --prod

​
Vercel Deployment

Vercel is optimized for Next.js and offers zero-configuration deployment.

​
Deployment Steps

1

Import Project

  1. Go to Vercel Dashboard
  2. Click “Add New” → “Project”
  3. Import your Git repository
2

Configure Project

Vercel auto-detects Next.js configuration:
  • Framework Preset: Next.js
  • Build Command: npm run build (auto-detected)
  • Output Directory: .next (auto-detected)
  • Install Command: npm install
3

Set Environment Variables

Add environment variables in project settings:
NEXT_PUBLIC_INFURA_PROJECT_ID=your_infura_id
NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID=your_wc_id
NEXT_PUBLIC_METADATACACHE_URI=https://aquarius.pontus-x.eu
AGROPORTAL_API_KEY=your_api_key
4

Deploy

Click “Deploy”. Vercel will build and deploy your application with:
  • Automatic HTTPS
  • Global CDN
  • Edge network optimization

​
Vercel CLI Deployment

npm install -g vercel

​
Vercel Features

  • Edge Functions: Run server-side code at the edge
  • Image Optimization: Automatic image optimization
  • Analytics: Built-in performance analytics
  • Preview Deployments: Unique URL for every commit

​
AWS S3 + CloudFront

Deploy as a static site with AWS infrastructure.

​
Prerequisites

  • AWS account
  • AWS CLI configured
  • S3 bucket created
  • CloudFront distribution (optional)

​
Static Export Build

1

Build Static Export

Generate static HTML files:
npm run build:static
This creates a public/ directory with exported HTML.
2

Create S3 Bucket

Create and configure S3 bucket:
aws s3 mb s3://agrospai-portal
aws s3 website s3://agrospai-portal \
  --index-document index.html \
  --error-document 404.html
3

Configure Bucket Policy

Add public read policy:
bucket-policy.json
{
  "Version": "2012-10-17",
  "Statement": [{
    "Sid": "PublicReadGetObject",
    "Effect": "Allow",
    "Principal": "*",
    "Action": "s3:GetObject",
    "Resource": "arn:aws:s3:::agrospai-portal/*"
  }]
}
Apply policy:
aws s3api put-bucket-policy \
  --bucket agrospai-portal \
  --policy file://bucket-policy.json
4

Upload Files

Sync the public directory:
aws s3 sync public/ s3://agrospai-portal \
  --delete \
  --cache-control "public, max-age=31536000"

​
CloudFront CDN Setup

Add CloudFront for global CDN distribution:
1

Create Distribution

aws cloudfront create-distribution \
  --origin-domain-name agrospai-portal.s3.amazonaws.com \
  --default-root-object index.html
2

Configure Custom Error Pages

Map 404 errors to index.html for client-side routing:
aws cloudfront update-distribution \
  --id YOUR_DISTRIBUTION_ID \
  --custom-error-responses \
    "ErrorCode=404,ResponsePagePath=/index.html,ResponseCode=200"
3

Add Custom Domain

  1. Request SSL certificate in ACM
  2. Add custom domain to distribution
  3. Update DNS records to point to CloudFront

​
S3 Deployment Script

Automate deployment with a script:
deploy-s3.sh
#!/bin/bash

BUCKET_NAME="agrospai-portal"
DISTRIBUTION_ID="YOUR_CLOUDFRONT_ID"

echo "Building static export..."
npm run build:static

echo "Uploading to S3..."
aws s3 sync public/ s3://$BUCKET_NAME \
  --delete \
  --cache-control "public, max-age=31536000" \
  --exclude "*.html" \
  --exclude "sw.js"

aws s3 sync public/ s3://$BUCKET_NAME \
  --delete \
  --cache-control "public, max-age=0, must-revalidate" \
  --exclude "*" \
  --include "*.html" \
  --include "sw.js"

echo "Invalidating CloudFront cache..."
aws cloudfront create-invalidation \
  --distribution-id $DISTRIBUTION_ID \
  --paths "/*"

echo "Deployment complete!"
Make executable and run: 
chmod +x deploy-s3.sh
./deploy-s3.sh

​
Deployment Comparison

FeatureNetlifyVercelAWS S3
Setup ComplexityEasyEasyModerate
Next.js SupportGoodExcellentLimited (static only)
Auto DeployYesYesNo (CI/CD needed)
Preview URLsYesYesNo
Custom DomainsYesYesYes (via CloudFront)
HTTPSAutomaticAutomaticVia ACM
CDNIncludedIncludedCloudFront (separate)
Server FunctionsYesYesNo
Free TierGenerousGenerousPay per use
Enterprise SupportAvailableAvailableAvailable

​
Environment Variables Per Platform

Remember: NEXT_PUBLIC_* variables must be set at build time on all platforms.
Set in: Site settings → Environment variablesVariables are available during build and runtime.

​
Continuous Deployment

All platforms support automated deployments:

​
GitHub Actions Example

.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: '22'
          
      - name: Install dependencies
        run: npm install
        
      - name: Build
        env:
          NEXT_PUBLIC_INFURA_PROJECT_ID: ${{ secrets.INFURA_PROJECT_ID }}
          NEXT_PUBLIC_METADATACACHE_URI: https://aquarius.pontus-x.eu
          AGROPORTAL_API_KEY: ${{ secrets.AGROPORTAL_API_KEY }}
        run: npm run build
        
      - name: Deploy to Netlify
        uses: netlify/actions/cli@master
        with:
          args: deploy --prod
        env:
          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID }}
          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}

​
Monitoring and Analytics

After deployment, set up monitoring:
  • Netlify Analytics: Built-in traffic and performance metrics
  • Vercel Analytics: Web Vitals and performance insights
  • AWS CloudWatch: S3 and CloudFront metrics and logs
  • Third-party: Google Analytics, Plausible (configured in app.config.js)

​
Next Steps

Production Build

Optimize your build process

Docker Deployment

Deploy with containers

Configuration

Configure environment settings

Network Setup

Configure network and chain settings

Build docs developers (and LLMs) love

Get started for freeTalk to us