Single-File Web App
Definition
The structure is deliberately plain: a doctype, a head holding a style block and any metadata, a body holding the markup, and a script block at the end holding the logic. Everything the app needs is inside those tags, apart from libraries it may pull from a CDN and images it may carry as data URIs. Files of this shape are typically between 20 KB and 500 KB, which is small enough to email, attach to a ticket or paste into a chat. This is the format AI assistants produce most often, because a file that runs on its own is the only kind that can be previewed instantly without a toolchain. The trade-off is real: no build means no bundling, no minification and no framework tooling, so the file is larger and messier than a compiled equivalent and stops being pleasant to edit somewhere past a thousand lines.
Why It Matters
One file collapses the distance between writing something and putting it in front of someone. A conventional web app needs a repository, a package install, a build and a deployment target before anyone can look at it; a single file needs an upload. It also travels well over time. A compiled bundle depends on a dependency tree that rots, while a self-contained page that worked in 2024 still works today, because the only thing it needs is a browser. That makes the format a good choice for internal tools, calculators, demos and anything you want to still be able to open in five years without archaeology.
How It Works
The browser parses the document top to bottom, applies the inline CSS as it reaches the style block, builds the DOM from the markup, and executes the script block when it gets there. Everything runs on the visitor's machine, so the server's only job is to hand over the file with a Content-Type of text/html. Publishing is therefore an upload of one file named index.html and nothing else. If the app loads React or a chart library from a CDN, those requests go from the visitor's browser to the CDN directly, and the page will not work offline or behind a network that blocks them. Persisting anything means browser storage, which is per browser, per device and per address — good for a draft or a preference, useless for anything two people need to see.
Real-World Example
A logistics analyst builds a container-packing calculator: paste in dimensions, get an arrangement and a fill percentage. It is one 180 KB file with the maths, the styling and a small 3D view all inline. Uploaded to 99helpers as pack-calc, it answers at pack-calc.99helpers.site, and the warehouse team uses it on tablets. When he improves the packing algorithm he uploads the same filename again, and everyone has the new version on their next refresh.
Common Mistakes
- ✕Splitting the file into app.js and style.css but uploading only the HTML — the page loads with no styling and no behaviour, and the console shows two 404s
- ✕Relying on browser storage for shared data — each visitor gets their own private copy, so two people using the app see two different sets of numbers
- ✕Pasting a huge base64 image into the file and pushing it past a few megabytes — the page still works, but it takes several seconds to appear on a phone
- ✕Assuming a file that opens from your desktop will behave identically when served — features gated on a secure origin, like the clipboard API, behave differently over file:// than over HTTPS
Related Terms
Inline CSS
CSS written inside the HTML document rather than in a separate .css file — either in a style element in the head or in a style attribute on a single element. It removes a network request and keeps everything in one file.
Inline JavaScript
JavaScript written inside the HTML document — in a script element with no src attribute, or in an attribute such as onclick — rather than loaded from a .js file. It keeps a generated page to one file.
Generated HTML
Generated HTML is markup produced by a program or a model rather than typed by a person. From a browser's point of view it is indistinguishable from hand-written HTML, and a static host serves it the same way.
No-Backend App
An application that runs entirely in the visitor's browser, with no server process of its own. Everything it does — layout, logic, data — happens in downloaded files, so it can be served as plain static files.
index.html
index.html is the file a web server returns when a visitor asks for a folder rather than a named file. It is the default document for the site root and for every directory inside it.
Put a file online in seconds
Drop in a document, an image, a page or a whole static website and share the link — free, with no build step and no server to set up.
Host a file free →