AI Artifacts & Generated Sites
Ask Claude, ChatGPT or any of the newer builders for a page, a calculator or a small app and you get back something real: usually one self-contained HTML file with its styling and scripts inline, rendered beside the conversation. This category is about that object. What an artifact or a canvas actually is, what changes the moment it leaves the chat window, and which parts survive being served as a plain static file — inline CSS and JavaScript, a CDN script tag, localStorage, a data URI — versus which parts quietly need a server, a database or a secret key and will not work at all. It also covers the vocabulary around getting generated work published without a build pipeline: static exports, single-file apps, REST endpoints, API tokens and MCP servers.
36 terms in this category
AI Artifact
An AI artifact is a self-contained piece of work an AI assistant produces and renders in its own panel beside the conversation — commonly a web page, a small app, a document or a chart. Most are a single file, which is why they can be put on the open web with very little work.
AI Code Generation
Producing working source code from a description written in ordinary language, using a large language model. The output is real code you can read, edit and publish yourself.
AI Dashboard
A dashboard whose layout and charts were generated by an AI assistant from a description and some figures. It is normally one page that draws itself in the browser from data embedded in the file or fetched from an endpoint.
AI-Generated Website
An AI-generated website is a site whose pages were written by a model from a description rather than by hand or through a site builder. In practice it is usually ordinary HTML, CSS and JavaScript, which any static host can serve unchanged.
API Token
A secret string that identifies your account to an API in place of a username and password. You send it with each request, and the service checks it and applies whatever permissions it carries.
Artifact Expiry
The practical problem that work generated inside a chat stays inside that chat. It is tied to one conversation, awkward to find again, and often unreachable by anyone without an account on the same tool.
Artifact Hosting
Artifact hosting is putting something an AI assistant built for you — usually one HTML file — at a public web address, so it can be opened by anyone with the link instead of only inside the conversation that produced it.
Artifact Sandbox
The restricted environment a chat tool runs your generated code in while you are still in the conversation. It renders a live preview, but with tight limits on network access, storage and anything outside its own frame.
Base64 Encoding
A way of writing binary data using 64 printable characters, so that images and other files can travel inside text. It makes the data about a third larger and is not encryption.
Browser Storage
The set of places a web page can keep data on the visitor's own machine — localStorage, sessionStorage, IndexedDB and cookies. It is private to that browser on that device, not a shared database.
ChatGPT Canvas
Canvas is a side-by-side editing surface in ChatGPT for documents and code. The work opens in a panel next to the conversation, where you can edit it directly or ask for changes to one part of it, rather than regenerating the whole reply each time.
Claude Artifact
A Claude artifact is a self-contained piece of work Claude renders beside the conversation rather than printing as chat text — commonly a single HTML page or a React component — which you can view, iterate on and share.
Client-Side Rendering
A model where the server sends a nearly empty HTML file and JavaScript builds the page in the browser. Nothing is visible until the script has downloaded and run.
Data URI
A URL that carries the file's contents inside itself rather than pointing at a location. It starts with data: and is how an image or font gets embedded directly in an HTML or CSS file.
ES Module
JavaScript's built-in module format, using import and export statements. Browsers load ES modules natively from a script tag with type set to module, with no bundler involved.
Export to HTML
Exporting to HTML means taking work out of the tool that made it and saving it as a web page. For AI output it usually means copying a generated document or app into a file you own, so it can be published rather than only viewed inside the chat.
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.
iframe Sandbox
The sandbox attribute on an HTML iframe strips the embedded page of most privileges, then lets you hand back only the ones you name. It is how a host page displays untrusted content without giving it the run of the browser.
Import Map
A block of JSON in an HTML page that tells the browser which URL a bare module name like react should resolve to. It lets a page use normal import statements without a bundler.
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.
Interactive Demo
A working sample of a product or idea that a visitor can click through in the browser, rather than read about or watch. It runs entirely on the front end, with data faked or held in memory.
localStorage
A browser API that stores string key-value pairs on the visitor's device, scoped to one origin and kept until something clears it. Around 5 MB is available, and the data never leaves that one browser.
MCP Server
A program that exposes a set of tools to an AI assistant over the Model Context Protocol. The assistant sees a list of actions it can take — read this, create that — and calls them during a conversation.
Model Context Protocol
An open standard for connecting AI assistants to external tools and data. It defines how a client and a server describe available actions and pass results back, so any assistant that speaks it can use any server that speaks it.
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.
No-Code App
A no-code app is software built without writing code — historically by dragging components around a builder, and increasingly by describing what you want and letting a model produce it. The result is still code; you just did not type it.
Prompt-to-App
Prompt-to-app describes tools that turn a written description of an application into something you can run — usually a working web page produced in one pass, then refined by asking for changes.
Prototype Hosting
Putting an unfinished build somewhere other people can open it, at a real address, without setting up infrastructure. The point is feedback, not permanence.
React via CDN
Running React by loading it from script tags on a public CDN rather than installing it and bundling it. It lets a single HTML file render a React app with no npm, no bundler and no compile step.
REST API
A way of exposing a service over HTTP where each thing you can act on has its own URL, and the HTTP method says what you are doing to it. GET reads, POST creates, PUT replaces, DELETE removes.
Single-File Web App
A single-file web app is a complete, working application contained in one HTML document, with the styles and the JavaScript written inside the same file. Open it in a browser and it runs — there is nothing to install and nothing to build.
Static Export
A static export is a build that turns a framework project into plain files — HTML, CSS, JavaScript and assets — that any file host can serve without running the framework. Features that depend on a server are dropped in the process.
Tailwind via CDN
Loading Tailwind CSS from a script or stylesheet hosted on a public CDN instead of compiling it locally. It gives a single HTML file working utility classes with no build tooling at all.
Vibe Coding
Vibe coding is building software by describing what you want in ordinary language and iterating on whatever the model returns, judging the result by whether it behaves correctly rather than by reading every line of the code.
Webhook
An HTTP request a service sends to a URL you provide when something happens on its side. Instead of you asking repeatedly whether an event has occurred, it tells you once, immediately.