📤Self-Hosting
Webstudio can be self-hosted, putting you in control of your hosting, pricing, security, and compliance.
The Builder and Projects are hosted separately. The Builder is used to create Projects, and when a Project is published or exported, the site/app is deployed independently.
Builder
While both the Builder and the generated site are open-source, self-hosting the Builder in production is more difficult and currently not recommended. You can still self-host the Builder for development, and of course, you can self-host the sites for production.
Projects
After building, export your Projects and host them on your own server or preferred platform.
Export methods
There are two ways to export Projects:
Webstudio CLI – Allows you to interact with and export your Projects. Supports static and dynamic (see below).
Download button in the Builder – Click a button in the Webstudio Builder, and the Project will be downloaded as a zip. Supports static only (see below).
If you are self-hosting the Builder, then please use the Webstudio CLI to export your project.
Export types
There are two types of exports:
JavaScript application – Builds a dynamic Remix app. This is the default behavior of Webstudio Cloud and provides the most functionality, but it requires hosting that works with apps.
Static site – Outputs a static site (HTML/CSS/JS) with limited functionality, but has more versatile hosting options.
If you want the export to contain human-readable class names, disable atomic CSS. See Atomic CSS for more information.
JavaScript application
This is the default behavior if you were to publish to Webstudio Cloud.
The JavaScript application supports dynamic functionality like CMS integrations, Webhook forms, image optimization, redirects, and more.
JavaScript applications require a hosting environment that handles server-side code execution, fetching data from CMS integrations, and more.
Platforms for JavaScript applications
Here are the platforms we have documented:
Static site
You can optionally export your Webstudio Project as a static site, i.e., a collection of HTML, CSS, JavaScript, and image files. This allows you to host your site on traditional hosting providers or, better yet, on dedicated static site hosting and deployment platforms.
Static site limitations
While static site exporting and hosting are less technical, this comes at the cost of functionality.
The following are not supported:
Dynamic pages
Redirects
Statuses
Client navigation
Webhook form
Image optimization
No robots.txt
No sitemap.xml
Local
To run a project locally, you must run a simple local server. Use the command npx serve . to spin one up. This is required because the static files use absolute URLs.
Platforms for static sites
Here are the platforms we have documented:
Last updated