Skip to content

Deploying to Cloudflare Pages

Cloudflare Pages is an excellent alternative to Vercel for deploying the Next.js frontend, offering fast edge caching and a generous free tier.

Prerequisites

  • A GitHub/GitLab repository with your code.
  • A Cloudflare account.
  • Your Backend API deployed and accessible.

Setup Steps

  1. Create Pages Project:
  2. Go to Cloudflare Dashboard -> Workers & Pages.
  3. Click Create application -> Pages -> Connect to Git.

  4. Select the Atlas ERP repository.

  5. Configure Build Settings:

  6. Framework preset: Next.js
  7. Build command: npx turbo run build --filter=web
  8. Build output directory: apps/web/.next

  9. Root directory: / (Keep at root so Turborepo works correctly)

  10. Environment Variables:

  11. NEXT_PUBLIC_API_URL: The URL of your deployed backend.
  12. NEXT_PUBLIC_TURNSTILE_SITE_KEY: Your Turnstile key.

  13. NODE_VERSION: 22 (Ensure Cloudflare uses the correct Node version).

  14. Deploy:

  15. Click Save and Deploy.

Important Notes for Cloudflare Pages

If you are using Next.js Server Actions or heavily relying on Node.js specific APIs in your frontend, you may need to configure the project to run on Cloudflare Workers using the @cloudflare/next-on-pages adapter, or stick to Vercel/Render for the frontend.