Even non-developers (like me 😎) can now build stunning websites using AI-powered tools like Cursor, Windsurf, or Trae. But here’s the kicker: how do you automatically deploy an AI-generated site to the internet and attach your custom domain? This “last mile” dilemma is like riding the subway 🚇 almost to your destination, only to face that final block on foot 🚶♂️!
Enter Devbox by ClawCloud Run! 👏
When I needed a slick landing page for a new product, I tried out Devbox—and it blew me away! Here’s why:
- Auto-Initialization 🤖
Devbox automatically sets up your project based on the language, framework, or system you need. Say goodbye to manual configuration! - Your IDE, Your Choice 💻
Whether you’re a fan of AI-powered IDEs like Cursor or prefer the comfort of VS Code, Devbox connects seamlessly to your favorite environment, letting you code the way you want. - No More Clunky Web IDEs 🚫🖥️
Forget about slow, browser-dependent IDEs that mess with your workflow. Devbox keeps your development personal and performant!
With just a few clicks, Devbox takes your generated code and pushes it to production—bridging that crucial last mile effortlessly. Fast, seamless, and powerful! 🌐⚡
Ready to leave the last mile behind and deliver your code to production with ease? Give Devbox a try and speed up your journey from idea to live site! 🎯💡
Creating the Devbox Development Environment
The very first step is to head over to the ClawCloud Run dashboard (https://console.run.claw.cloud/) and open Devbox:
Create a new project, choose Node.js as the language, and allocate 1 CPU core and 2 GB of RAM—that’s all you need. And remember to change the port to 3000 in the network settings (we’ll be working with React shortly). The system automatically assigns you an HTTPS domain, which lets you access port 3000 in your Devbox environment.
After you select the framework and click Create, your development environment will be up and running in just a few seconds.
Next, choose to connect with Cursor from the options:
On your first run, you’ll be prompted to install the Devbox plug-in. Once installed, it will auto-connect you to the environment.
Isn’t it incredibly simple? You bypass all the tedious steps like configuring DNS, applying for SSL certificates, or setting up gateways—simply refreshing!
Let Your Words Command Cursor to Code
We’ve been doing the grunt work long enough; now I want to be the boss—and let Cursor handle the heavy lifting!
Press Ctrl+I to open the conversation panel. For the very first prompt, I used:
My company is Antworers LLC, and its main business is providing SaaS services. The specific service content can be determined by you. I now need to develop an official website. The website should be very modern, with the feel of Apple’s official website. Based on my needs, please think through step by step and help me develop an official website (using the React framework).
Requirements:
Use the current directory directly as the project root directory.
If commands need to be executed, pause the file creation process so I can execute the commands first.
Since Cursor can currently only create files—not execute commands—I made sure to specify in the prompt that if any commands need to run, it should notify me, pause the file creation, and then continue once I’ve executed them.
Once the initialization commands ran, Cursor got to work like a machine. I literally watched it create directories, files, and write code with lightning speed.
Cursor automatically generated major sections for the website—including the Navbar, Footer, Hero, Features, and Testimonial components.
It was impressive seeing it hustling away. This appears to be thanks to new functionality from Claude—it can interact with you and adjust its responses based on your feedback, a feature that wasn’t available before. There’s another tool (formerly known as Claude dev, now called Cline) that’s powerful and interactive as well, but it requires confirmation at every step, which can be a bit tedious. In contrast, the combination of Cursor and the new Claude 3.5 delivers excellent control without the drag.
After all the output was finished, I asked how I could preview the result. (Truth be told, I already knew what to do—I was just having some fun with the model.) It instructed me to type certain commands in the terminal. Here, Cursor wasn’t as proactive as Cline (which auto-runs terminal commands upon confirmation), but I expect Cursor will catch up in future updates.
The moment the webpage loaded, it didn’t just meet my requirements—it far exceeded my expectations. The color scheme, layout, and animations were simply stunning. Not long ago, I struggled for ages trying to get a webpage to look the way I wanted with Cursor. This first iteration obliterated my prior benchmarks. Check out the result:
Previewing the website in the Devbox environment is as easy as using the automatically assigned HTTPS domain from when you set up your Devbox.
Of course, since I didn’t supply detailed information about the company’s services, the page content came out pretty generic—like a report filled with corporate buzzwords. Refining it further requires more back-and-forth with the model.
After a few rounds of discussion, the website basically took shape. Later on, I had it adjust the content to create a bilingual (Chinese and English) version.
Even if errors popped up along the way, once I pointed them out, it would auto-fix everything—making me feel like a high-priority client. Throughout the entire process, I never had to manually write or modify a single line of code—part of it was to test the potential of AI, and mostly because I didn’t want to expend the extra effort.
The final website turned out like this:
Website Launch
With the front-end complete and after lavishing praise on what I just built, it was time to focus on the back-end deployment. For my current site, I know hardly anyone will visit it over the course of a year—but I still need it to serve as a proper face for the business. My requirements were clear:
- It must be inexpensive.
- It must be simple.
And honestly, the idea of using solutions that force you to type endless Linux commands makes my head spin!
Deploying projects built in the Devbox environment is ridiculously straightforward—almost no brainpower required.
Let’s walk through the steps:
To keep the project structure simple, we first need to move all files from the subdirectory into the root directory. Open the terminal in Cursor and run these commands:
cp -rf antworers-website/* .
cp -rf antworers-website/.* .
rm -rf antworers-websiteNext, open the entrypoint.sh file and add the startup command for your project (since, after deployment, Devbox runs your project by executing entrypoint.sh).
After modifying and saving the script, click Release:
Fill in the necessary details and click Release:
Important: Deploying a release will temporarily stop Devbox. Once the release goes live, Devbox will automatically restart, so be sure to save your work to avoid any data loss.
After a brief pause, you’ll see the release in the version list. Click “Go Live” to get redirected to the deployment page, then click Deploy Application to push your site to production.
You can adjust the CPU and memory based on your project’s needs.
The production environment is assigned a separate HTTPS domain from the development environment. Once deployed, use the production domain to access your service.
Conclusion
ClawCloud Run Devbox’s operations are indeed simple—and the cost is remarkably low. With the most basic configuration, you’re looking at just a few cents a day.
From project initiation to launch, it took me only one day (and that was during my spare time, since I’m not a full-time developer). This kind of efficiency would have been unimaginable in the past. While some media advocates claim that AI will replace programmers, is it really replacing them? It’s clearly empowering developers! It even makes me want to revisit and refactor that old spaghetti code from my past projects.
The ClawCloud Run link: https://run.claw.cloud/
This is how Devbox, combined with AI-powered coding assistants, is revolutionizing the way we build and deploy web applications—making it easier, faster, and more cost-effective than ever before. Enjoy the ride!