Put a React / Vite site online

A React (or Vue, or Vite) app feels complicated, but putting it online is genuinely three steps: build it, upload the files, point your domain at it. No command line on the server, no scary config.

Why so simple? Because a built React app is static — just files. If that sentence is new to you, read Static vs dynamic first (2 minutes). It’s the key idea.

Step 1 — build it (on your computer)

In your project folder, run:

npm install      # first time only
npm run build

This creates a dist/ folder (sometimes build/). Inside it is an index.html and an assets/ folder — these are the real files your website is made of. You’ll upload what’s inside dist/, not the dist folder itself.

Step 2 — upload to the web root

1. In OrbixPanel, open File Manager and go to your site’s web root (the folder that already contains the default/placeholder index.html — see Where files go).
2. Delete the placeholder index.html if there is one.
3. Upload your files. The easy way:
   • On your computer, zip up the contents of dist/ (select the files inside dist, not the folder) into site.zip.
   • Upload site.zip in the File Manager, then Extract it right there.
4. You should now see index.html and assets/ sitting directly in the web root — not inside a dist/ subfolder.

That’s the step people trip on: the goal is webroot/index.html, not webroot/dist/index.html. If you ended up with a dist subfolder, open it, select everything, and Move it up one level.

Step 3 — point your domain at it

1. If you haven’t already, create the website for pulmocon.org so the panel serves this web root for that domain.
2. Make sure the domain’s A record points at your server’s IP (DNS) — a one-time step.
3. Request SSL so it loads over https:// (Websites).

Visit https://pulmocon.org — your app is live.

Two gotchas (and the one-line fixes)

• Blank page / assets 404, or it only works at a sub-path. Vite builds assuming the site is at the domain root. If it is (pulmocon.org/), you’re fine. If you’re serving it under a sub-path (pulmocon.org/app/), set that base when building:

  # vite.config.js  →  export default defineConfig({ base: '/app/' })
  npm run build

• Refreshing a page like /dashboard gives 404 (React Router apps). The server looks for a file called dashboard and doesn’t find one. You need a rule that serves index.html for unknown paths (SPA fallback). Ask your provider to enable it, or add it in the site’s config — it’s a one-liner (try_files $uri /index.html;).

To update the site later: re-run npm run build, then upload the new files to the web root again (overwrite). Same three steps, minus the domain setup.

That’s a real deployment — you just did what pros do. When your projects grow into dynamic apps (an API, a database), the Apps guide picks up from here.