Deploy Remix to Vercel

The easiest and fastest way to deploy your Remix app.

  • Alexandro MartΓ­nez
    Author
    by Alexandro MartΓ­nez
    3 months ago
  • Deploying to Vercel might be the easiest way to deploy your Remix app.

    • 1) Connect your GitHub project: vercel.com/new

    • 2) Set the environment variables

    • 3) Make sure to add "postinstall": "prisma generate" to package.json scripts to generate the updated Prisma Client on Build.

    • 4) Optional: If you're using a React canary version, override the build command to npm install --legacy-peer-deps

    That's it πŸŽ‰! Every deployment will have it's own URL, no matter the branch. For example:

    Read Common Errors when Deploying Remix to Vercel if you encounter an error.


    Deployment Steps

    πŸ’Ώ Go to vercel.com/new and select your repository

    vercel-deployment-select-repository.png

    πŸ’Ώ Set up your environment variables

    Hint: You can copy-paste the content of your .env.production local file, and Vercel will be smart enough to parse it 🀩

    Optionally, override the build command to npm install --legacy-peer-deps.

    vercel-deployment-set-environment-variables.png

    πŸ’Ώ Wait 1-3 min and visit the deployed URLs

    vercel-deployment-success.png

    πŸ’Ώ Update the Function Region

    Change the function region to your database provider's region (i.e. Supabase). In my case I always choose iad1 (North Virginia).

    Vercel function region:

    vercel-project-settings-region.png

    Supabase infrastructure region:

    supabase-project-settings-region.png

    And redeploy if necessary.


    Can't get any easier than this!

    We respect your privacy.

    TLDR: We use cookies for language selection, theme, and analytics. Learn more.