Meghly
বাংলা

Guides

Static sites — HTML, React, Vue and more

Plain HTML/CSS/JS, or a front-end built with React, Vue, Angular, Astro and the like — fast sites with no server.

Two kinds of static site

1. Ready files. index.html, CSS, JS and images straight in the repository. No build — the files are served as they are.

2. A built front-end. With one of these tools in package.json, Meghly runs npm run build and serves the folder it produces:

ToolBuild output
Vite (React, Vue, Svelte …)dist
Create React App (react-scripts)build
Vue CLIdist
Angulardist/<project>/browser
Astrodist
Eleventy_site
Gatsbypublic

With a server such as Next.js or Express it is not static — see Node.js.

How it is served

The site runs on a light nginx, port 8080, with HTTPS and your own domains.

  • Ready files: for /about it looks for about, then about/index.html, then about.html; with none, a 404.
  • A built front-end (SPA): when no file matches, it serves index.html — so addresses such as React Router's or Vue Router's /dashboard/settings work when opened directly or refreshed.
  • Files starting with . (such as .env, .git) are never served.

Variables and API addresses

A static site has no server, so variables reach the code only at build time. Vite wants names starting with VITE_:

Environment
VITE_API_URL=https://api.example.com
js
const api = import.meta.env.VITE_API_URL;

After changing a variable, deploy again — a restart is not enough.

Whatever goes into the build is visible to everyone in the browser. Never put secret keys (payments, databases) in a static site's variables — keep them on the API server.

An API as a separate app

If the front-end and the API are separate apps, run both on Meghly: the React site on www.example.com, the API (Node, Python, .NET) on api.example.com. Allow the front-end's address in the API's CORS settings.

When something goes wrong

What you seeCause and fix
A 404 on refreshCheck a build tool is in package.json — only then is the SPA fallback on.
A white page, files not found in the consoleVite's base or CRA's homepage is wrong — use / at the root.
The old API addressDeploy again after changing a VITE_ variable.

Stuck?

Talk to our engineers directly — by phone or email.

01782618248shohag.meghly@gmail.com