Build a Web App with Bolt.new and Deploy with DeployHQ
This guide will walk you through the process of creating a web app using the AI-driven platform Bolt.new and then setting up an automated deployment pipeline with DeployHQ to publish your bolt.new app to a live server.
Step 1: Set Up Bolt.new and Start Building
First, navigate to Bolt.new and sign in or create an account. Bolt.new is an AI-powered, full-stack development environment that lets you build projects directly in your browser. With the launch of Bolt v2, the platform now supports Figma imports, GitHub repository integration, and team collaboration alongside its core AI assistant that can generate entire applications from a simple text prompt — no local setup required.
Step 2: Use the AI to Build Your Web App
Once you are in the Bolt.new IDE, you will see an interface where you can interact with the AI assistant. Enter a prompt to describe the app you want to build. For example: "Create a simple portfolio website with sections for About, Projects, and Contact." The AI will generate the entire project's code for you. You can make adjustments and continue building with the AI's help.
Bolt.new typically generates React and Vite-based projects, which means your finished app will need a build step before deployment. Keep this in mind when you configure DeployHQ in Step 4.
Step 3: Prepare Your Bolt.new App for Deployment with Git
Before you can deploy with DeployHQ, you need to get your bolt.new project into a Git repository (GitHub, GitLab, or Bitbucket). Bolt.new has built-in integration for this. Locate the Version Control or Git section within the Bolt.new IDE. Here, you can initialize a repository, commit your changes, and push them to a remote repository. This Git repository will be the source code that DeployHQ pulls from when deploying your bolt new project.
Why Deploy Beyond Bolt.new?
Bolt.new is excellent for building and previewing your app in the browser, but its built-in hosting is limited. Deploying your bolt.new app with DeployHQ to your own server gives you:
- Full ownership: your app runs on your infrastructure, not Bolt.new's platform — deploy to AWS, DigitalOcean, Hetzner, or any VPS provider
- Cost savings: a VPS is normally cheaper than managed platform hosting, especially as traffic grows
- No lock-in: your code is already in Git, so you are free to deploy it anywhere at any time
- Production-grade control: configure environment variables, custom domains, SSL certificates, and server settings exactly as your app requires
Step 4: Deploy Your Bolt.new App with DeployHQ
Now that your bolt.new project is on GitHub, you can set up DeployHQ to handle your deployments.
Create a New Project: Log in to your DeployHQ account and click New Project.
Connect to Your Repository: Connect DeployHQ to your Git provider and select the repository where you pushed your bolt.new project.
Configure Your Server: Navigate to the Servers & Groups section and click New Server. Provide the details for your hosting server, including the connection type (FTP, SFTP, or SSH), credentials, and the path to your public directory (e.g.,
/public_html). Within Bolt.new you can only use their hosting, but here you can use your VPS or server of choice, which is normally cheaper.Configure the Build Pipeline: Because bolt.new generates React/Vite applications, you need to run a build step before deploying. In your DeployHQ project settings, navigate to the Build Pipeline section and add a build command. Set the build command to
npm run buildand set the deployment subdirectory todist. DeployHQ will run the build on your repository and deploy only the compiled output to your server — exactly what a Vite app requires.Initiate the First Deployment: Go to the Deployments tab and click New Deployment. Select the branch you want to deploy from (e.g.,
main) and the server you just configured. DeployHQ will build and transfer the files to your server automatically.
Step 5: Set Up Automatic Deployments for Your Bolt.new Project
Once your first deployment is working, configure automatic deployments so that every push to your repository triggers a new bolt new deploy without any manual steps. In your DeployHQ project settings, go to the Automatic Deployments section and copy your webhook URL. Add this URL to your GitHub repository under Settings > Webhooks. From this point on, every code push will kick off a full build and deployment cycle automatically.
Step 6: Monitor Your Live Application
DeployHQ provides a comprehensive dashboard to monitor the status of your deployments. You can view detailed logs of each deployment, check for any errors, and even roll back to a previous version if a new deployment causes issues. This gives you complete control and visibility over your bolt.new app's live status.
Ready to deploy your bolt.new app to your own server? Sign up for DeployHQ and have your first deployment running in minutes — plans start with a free trial. Check out DeployHQ pricing for details.
Building with other AI tools? See our deployment guides for Lovable, Replit, and v0. For AI-assisted coding editors, check out our guides for Cursor, Windsurf, and Cline.
If you have questions along the way, email us at support@deployhq.com or find us on X at @deployhq.