New — Iris AI drafts your firewall, routing & rate-limit rules. Explore AI features →
Back to Blog
comparisondeploy

Deploy a React or Vite App: Ngris vs Vercel

Deploy a React or Vite app on Ngris, a Vercel alternative that builds and hosts your front-end from git behind a real security edge — a WAF, per-route login, and rate limits, plus tunneling and Iris in one platform. A full-stack app can also add a per-app managed MariaDB (MySQL) database with the connection injected as env vars.

11 min read

You built a React (Create React App) or Vite front end and you want it live on a real HTTPS URL — ideally with a security edge in front of it, not bolted on later. Ngris deploys your React/Vite app and gives you that edge in the same platform: a real WAF, per-route login, and rate limits on your deployed site; tunneling for the backend it talks to from the same CLI; and Iris, the built-in AI assistant, writing the edge rules for you. That's the thing Vercel makes you assemble from separate products — on Ngris it's one account, one bill, one policy engine. This post shows exactly how to deploy a React or Vite app to Ngris, where it matches Vercel's deploy loop, and what the security edge buys you.

Can Ngris deploy a React or Vite app? Yes — here's how

Yes. Ngris builds and hosts front-end framework apps. You connect a GitHub or GitLab repo (or upload a .zip), and Ngris runs your npm/yarn/pnpm install and build in a sandboxed job, then serves the output on its global edge at an HTTPS URL — the same core loop you get from Vercel. It auto-detects the framework, so a standard React or Vite repo needs no configuration:

# 1. Install the CLI (also used for tunnels — more on that below)
curl -fsSL https://ngris.com/install.sh | sh

# 2. Or deploy an already-built Vite/React bundle in one call:
#    (npm run build → dist/ for Vite, build/ for CRA — zip it)
curl -X POST https://api.ngris.com/v1/applications/quick-deploy \
  -H "X-API-KEY: $NGRIS_API_KEY" \
  -F "name=my-react-app" -F "file=@dist.zip" -F "wait=true"

That single call creates the app, uploads it, provisions a public endpoint, and returns the live URL. Prefer git? Connect the repo instead and every push auto-builds and ships, with a preview URL for every deploy and an instant, atomic rollback to any previous build. Ngris auto-detects and builds React (Create React App), Vite, Vue, Svelte/SvelteKit (static), Angular, Astro, Gatsby, Next.js (static export), Nuxt (generate), and Hugo, plus prebuilt static served as-is. The detected install, build, and output-directory commands are all overridable if your setup is non-standard, and you can inject per-app environment variables and encrypted secrets (a Vite VITE_* or a CRA REACT_APP_* value gets picked up at build time exactly as you'd expect).

Where Ngris and Vercel are at parity

For the everyday deploy loop of a React or Vite app, the two are equivalent. Both give you git push-to-deploy, folder/CLI upload, framework auto-detection, live build logs, a preview URL per deploy, env vars and secrets, and instant rollback.

Deploy loop Ngris Vercel
Build React (CRA) / Vite from git
Folder / CLI / zip upload
Framework auto-detection
Live build logs
Preview URL per deploy
Env vars & encrypted secrets
Instant atomic rollback
Custom domain + automatic TLS

Where Ngris is different: a policy edge in front of your app

The structural difference is that on Ngris your deployed React/Vite app is a first-class edge endpoint — the same kind of endpoint a tunnel uses. So the whole per-endpoint policy engine sits in front of your deployed app, with no add-on and no separate vendor:

  • A built-in WAF. A Coraza-powered, OWASP-style web application firewall you attach as a single traffic-policy rule — detect-first, then block when you're ready.
  • Per-endpoint auth. Put your React app behind Google/GitHub/Okta login (OAuth/OIDC), an API key, or mTLS — great for an internal tool or a staging build you don't want public.
  • Rate limits, geo/CIDR rules, and JA3 bot management applied per route.
  • Live traffic inspection and replay. Watch the real requests hitting your deployed app and replay any one of them.
  • Tunnels from the same CLI. Your React app almost certainly talks to a backend. Run that backend locally or wherever you already do and expose it to the internet with ngris http 8080 — same account, same edge, same security layer, one bill.
  • Iris writes the rules. Describe the behavior in plain English and the Iris AI assistant drafts the firewall or rate-limit rule and shows a blast-radius dry-run before anything applies.

On Vercel, once your React site is up, hardening it usually means reaching for another product or a third-party WAF. On Ngris it's the same traffic-policy rule you'd attach to any endpoint:

# Ask Iris, on your deployed React app's endpoint:
"Put this app behind Google login and rate-limit
 the API routes to 60 requests per minute per IP."

Front end and back end — both live on one edge

So you know exactly what you're getting: a static or single-page-app build — React, Vite, Vue, Svelte, Angular, Astro, Next.js static export, Nuxt generate, Hugo, and friends — is live today and fully self-serve. Connect a repo or drop a dist.zip and it's on the edge in minutes. That covers the common case: a static or SPA front end that calls an API.

Want the backend on the same edge? That's live too:

Deploy your backend — Go, Node, Python, or any Dockerfile — behind the Ngris edge. Live now.

Push a Go, Node, or Python service (auto-detected), or bring a Dockerfile for anything else — a Next.js server included. Ngris builds it in a sandboxed job and runs it behind the same policy engine as your front end: one platform, one edge, one bill.

See plans & deploy →

To be precise about the line: static and SPA builds deploy self-serve, and a long-running backend — a Go, Node, or Python server, or any app with a Dockerfile (a Next.js server included) — deploys to the edge and runs behind the same policy engine. Ngris does not run per-request serverless / edge functions — you deploy a long-running service instead. Install the CLI and ship both from one account:

# Install the Ngris CLI, then deploy your app:
curl -fsSL https://ngris.com/install.sh | sh

And a database, without a second vendor

On Vercel your React/Vite app has no database of its own — you bring your own from a separate provider (Supabase, Neon, PlanetScale, and the like), which is another account, another dashboard, and another connection string to wire up. On Ngris a full-stack app can add a managed database from its own detail page: a MySQL-compatible database (MariaDB), provisioned per app with its own schema and a least-privilege user scoped to just that schema. The connection is injected as environment variablesDB_HOST, DB_PORT, DB_NAME, DB_USER, DB_PASSWORD, and a ready-to-use DATABASE_URL (mysql:// DSN) — and the app redeploys to pick them up. Your backend just reads DATABASE_URL; there's nothing to copy or paste.

Scoped honestly: the managed database is MariaDB/MySQL only (not Postgres, Redis, or Mongo) and is a paid-plan capability (off on the free tier). If you specifically want Postgres or a different engine, bring your own and set DATABASE_URL as a normal secret env var instead.

Side-by-side comparison

Capability Ngris Vercel
Static React / Vite / SPA hosting
Backend / SSR hosting (Go, Node, Python, Dockerfile — Next.js server included)
Managed database (per-app, connection injected as env) MariaDB (paid)Bring your own (Supabase/Neon/…)
Serverless / edge functions (per-request FaaS)
Deep framework ecosystem & integrationsSmaller
Built-in WAF (OWASP) in front of the appAdd-on / limited
Per-endpoint auth (OAuth/SSO, API keys, mTLS)Partial / paid
Rate limits, geo/CIDR, bot management (per route)Limited
Live traffic inspection & replay
Tunnel your local backend from the same CLI
AI assistant that writes your edge rules

Hosted, honest pricing

Ngris is a hosted SaaS platform — you don't run the edge yourself. Pricing is simple and self-serve: $0 to start with no credit card (deploy a static site, preview URLs, build logs, the inspector), $8/mo for Team (custom domains, the policy engine, WAF, and edge auth on your deploys), and $25/mo for Enterprise. Your React/Vite app, its backend tunnels, and the security layer all share one account and one unified data-transfer allowance.

The verdict

If you're shipping a React/Vite app — static, SPA, or with a backend — deploy it on Ngris. You get the same git-push deploy loop you'd expect (framework auto-detection, build logs, a preview URL per deploy, env vars and secrets, instant rollback), and you get something you'd otherwise have to bolt on: a WAF, per-route login and rate limits, live traffic inspection, and Iris writing the rules — all on one account, one bill, one edge. And the backend runs on the same edge — a Go/Node/Python service, or any Dockerfile (a Next.js server included) — behind that same policy engine. Ngris hosts your front end and your back end behind one policy edge: that's more than Vercel gives you. For any app that wants a real security edge, Ngris is the recommendation.

Try it

Deploy a React or Vite build to the edge and put a login or a WAF in front of it with one rule — start from the Static Apps guide. Weighing the options more broadly? Read the full Ngris vs Vercel comparison, or Ngris vs Netlify and Vercel. And if you need to expose the backend your app talks to, see exposing localhost to the internet — same CLI, same edge.

Deploy your React or Vite app with a security edge

Create a free account, connect a repo or drop a dist.zip, and ship your first build — no credit card.

Create a free account →

Frequently asked questions

Can Ngris deploy a React or Vite app?

Yes. Ngris runs your npm, yarn, or pnpm install and build for a React (Create React App) or Vite app in a sandboxed job and serves the static output on its global edge at an HTTPS URL. Connect a GitHub or GitLab repo for push-to-deploy, or upload a built dist.zip via the quick-deploy API. Framework detection is automatic, and every deploy gets a preview URL and instant rollback.

Is Ngris a good Vercel alternative for a React app?

Yes — for a React or Vite build, Ngris is the stronger pick, and it hosts more than the front end. It matches Vercel's deploy loop (git push, build logs, preview URLs, env vars, rollback) and adds a security edge in front of your app that Vercel makes you assemble separately: a WAF, per-endpoint auth, rate limits, and live traffic inspection, with Iris writing the rules — all from one account. Static and SPA builds deploy self-serve, and the backend deploys to the same edge: a Go, Node, or Python service, or any app with a Dockerfile (a Next.js server included), runs behind the same policy engine. Ngris does not run per-request serverless / edge functions — you deploy a long-running backend instead.

How do I deploy a Vite app to Ngris?

Connect your git repo (Ngris detects Vite and runs the build, publishing the dist output), or build locally with npm run build and upload the dist folder as a zip through the quick-deploy API. Vite VITE_* environment variables are injected at build time from your per-app env vars and encrypted secrets.

Does Ngris support Next.js server-side rendering or serverless functions?

Ngris hosts a Next.js server (SSR) as a managed backend: add a Dockerfile for your Next.js server and Ngris builds it in a sandboxed job and runs it on the edge behind the same policy engine as your front end. Go, Node, and Python backends are auto-detected from your repo; anything else ships via a Dockerfile. Next.js static export and Nuxt generate (fully static output) also deploy self-serve as static bundles. What Ngris does not run is per-request serverless / edge functions — deploy a long-running backend instead.

Does Ngris give my app a database, like Vercel with Supabase or Neon?

Ngris goes one step further: instead of pointing you to a separate provider, a full-stack app can provision a managed database from its own detail page. It's a MySQL-compatible database (MariaDB) — provisioned per app with its own schema and a least-privilege user scoped to just that schema — and the connection is injected as DB_HOST, DB_PORT, DB_NAME, DB_USER, DB_PASSWORD, and a mysql:// DATABASE_URL environment variable, after which the app redeploys to pick them up. It is MariaDB/MySQL only (not Postgres, Redis, or Mongo) and is a paid-plan feature. On Vercel you bring your own database from a third party (Supabase, Neon, PlanetScale, etc.) and wire up the connection string yourself — you can do that on Ngris too by setting DATABASE_URL as a secret env var, if you want a different engine.

What does it cost to deploy a React app on Ngris?

Ngris is a hosted SaaS with self-serve pricing: $0 to start with no credit card, $8/mo for Team (custom domains, WAF, edge auth), and $25/mo for Enterprise. Your deployed apps, backend tunnels, and the security layer share one account and one unified data-transfer allowance.

Ask an AI to summarise this page
Product
API Gateway Secure Tunnels WAF & Firewall Traffic Inspector
AI
Iris AI AI Gateway
Compare
Ngris vs ngrok Ngris vs Cloudflare Tunnel Ngris vs Vercel Ngris vs Netlify Expose localhost guide
More
Solutions Developers Pricing Enterprise Sign in Get Started Free
Iris