DEV Community

Ramandeep Singh
Ramandeep Singh

Posted on

Deploying Express.js App on Vercel

✅ What's Already Vercel-Compatible:

  1. Express.js setup: Your app uses Express.js which works well on Vercel
  2. ES Modules: You're using "type": "module" which is supported
  3. Static file serving: public folder structure works correctly
  4. Environment variables: Use dotenv and process.env.PORT
  5. Port configuration: Keep const PORT = process.env.PORT || 3000;

⚠️ Issues to Fix for Vercel:

1. Missing Vercel Configuration

You need to create a vercel.json file to tell Vercel how to handle your Express app:

2. Update Package.json Scripts

Update your package.json to include a proper build script:

{
  "version": 2,
  "builds": [
    {
      "src": "index.js",
      "use": "@vercel/node"
    }
  ],
  "routes": [
    {
      "src": "/(.*)",
      "dest": "/index.js"
    }
  ]
}
Enter fullscreen mode Exit fullscreen mode

🚀 Deployment Steps:

  1. Set Environment Variables in Vercel:

    • Go to your Vercel dashboard
    • Add [API_KEY_NAME] as an environment variable
    • Set it to your actual any of your API key value
  2. Deploy:

   vercel --prod
Enter fullscreen mode Exit fullscreen mode

✅ Your App Will Work Because:

  • Express.js: Fully supported on Vercel
  • Static files: Your public folder will be served correctly
  • API routes: Your /api/ask and /api/set-key endpoints will work
  • Environment variables: Properly configured
  • Port handling: Uses process.env.PORT correctly

🔧 Minor Recommendations:

  1. Add error handling for missing static files
  2. Consider adding CORS if you plan to call the API from different domains
  3. Add rate limiting for production use

Express.js app is well-structured for Vercel deployment! The only main thing is adding the vercel.json configuration file.

Top comments (0)