Host your Frontend in Xano with Static Hosting

Xano's Static Hosting feature lets you deploy a frontend right alongside your backend — no separate hosting service required. Whether you're spinning up a quick prototype, testing an AI-generated app, or hosting an internal tool, Static Hosting gives you a fast and convenient way to get your frontend live without leaving Xano.

What Static Hosting Supports

You can use any modern frontend framework with Static Hosting. React, TypeScript, or really any framework that includes a package.json file in the root of the project should work. What Xano doesn't support are server-side languages like Ruby, PHP, or Python. It's also worth noting that Static Hosting does not currently support server-side rendering or SEO — so it's best suited for quick deployments, prototypes, and internal-facing applications rather than production public sites that rely on search visibility.

Development and Production Environments

Xano gives you both a development and a production environment for static hosting. This means you can test new builds without affecting anything that's already live. You can deploy different builds to different environments at any time, making it easy to iterate and test with confidence.

Uploading Your Build Inside Xano

To get started, navigate to your Library and select Static Hosting. You'll find a default static host ready to use. Click Upload Build, give your build a name and optional description, then attach your zip file. Xano will handle the build process for you — compiling your frontend into browser-ready code. Once the build is ready, you can deploy it to either your production or development environment with just a click. After publishing, you'll get a direct link to access your live frontend.

Deploying from a Git Repository

If you prefer to connect a Git repository, you can do that too. When creating a new site, choose the Git repository option during the upload build step and provide the URL to your repo. One important thing to keep in mind: Xano won't automatically pull in new changes when you update your repository. You'll need to manually deploy a new build each time you want to push updates.

Deploying from VS Code

If you're using the Xano VS Code extension, the process is straightforward. Create a folder called static in the root of your project and place all of your frontend files inside it. Then, open the Xano Script extension panel in VS Code, click Upload Static Files, and select which environment you want to deploy to. That's all it takes.

Static Hosting is a powerful addition to your Xano workflow, especially when you want everything — frontend and backend — managed in one place. Give it a try the next time you're prototyping or building out an internal tool.