ven 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-website
Next, 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.
đNew feature: Auto Shutdown Timer
(Updated on 15 May 2025)
Based on feedback from developers, weâve observed that most users engage with Devbox for an average of 3â4 hours daily. To enhance cost control and prevent unnecessary charges, ClawCloud Run has introduced a Scheduled Shutdown feature for Devbox:
- Predefine Runtime Duration: When creating a Devbox, you can now set its runtime duration between 1 to 24 hours.
- Modify or Cancel Shutdown: At any time, you can access the Devboxâs details page to adjust or cancel the scheduled shutdown.
- Immediate Billing Stop: Once the Devbox shuts down, billing ceases immediately, ensuring youâre only charged for active usage.
This enhancement maintains the continuity of your development environment while offering transparent and controllable cloud development costs.
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!
Top comments (0)