Just in a few days, when I started to adopt cursor AI, it’s time to switch to stackblitz’s Bolt.new, which absolve cursor AI user’s repetitive installation or deployment efforts. to use it, click the web here.

And use the boiler template of “create a docs site with Vitepress”, literally in several seconds, I was able to deploy it alive on https://storied-malasada-4cbaa5.netlify.app/, it will be supported for a week and then be automatically removed if you don’t claim it.

What’s more, the stackblitz open sourced the bolt.new codes.

In their readme page, they directly pointed out the downside of existing AI powered coding tools: Claude, v0, etc are incredible- but you can’t install packages, run backends or edit code. That’s where Bolt.new stands out:

• Full-Stack in the Browser: Bolt.new integrates cutting-edge AI models with an in-browser development environment powered by StackBlitz’s WebContainers. This allows you to:
  • Install and run npm tools and libraries (like Vite, Next.js, and more)
  • Run Node.js servers
  • Interact with 3rd party APIs
  • Deploy to production from chat
  • Share your work via a URL
• AI with Environment Control: Unlike traditional dev environments where the AI can only assist in code generation, Bolt.new gives AI models complete control over the entire environment including the filesystem, node server, package manager, terminal, and browser console. This empowers AI agents to handle the entire app lifecycle—from creation to deployment.

Whether you’re an experienced developer, a PM or designer, Bolt.new allows you to build production-grade full-stack applications with ease. They even encourage you to build your own AI powered coding tool on web browser:

If you’re here to build your own AI powered web dev agent using the Bolt open source codebase, click here to get started!

Note to leverage this codebase, we need to know their web container API, Remix and AI SDK. Remix is a modern web framework designed for building high-quality, server-rendered React applications. It leverages the power of React along with modern web standards to create fast, dynamic, and user-friendly web applications. unique data loading mechanism that allows you to fetch data on the server before rendering the page. nested routes, enabling you to create complex UIs without the need for cumbersome state management. simplifies form handling with built-in support for data mutations. By rendering pages on the server and serving fully-formed HTML to the client, Remix enhances SEO, as search engines can crawl and index your content more effectively. while From the creators of Next.js, the AI SDK is a free open-source library that gives you the tools you need to build AI-powered products. it’s website is https://sdk.vercel.ai/ and it’s actually also v0.dev/chat.

WebContainers run full-stack applications directly in the browser without the cost and security concerns of cloud hosted AI agents. WebContainers are interactive and editable, and enables Bolt’s AI to run code and understand any changes from the user.

The WebContainer API is free for personal and open source usage. If you’re building an application for commercial usage, you can learn more about our WebContainer API commercial usage pricing here.

Tips and Tricks

Here are some tips to get the most out of Bolt.new:

• Be specific about your stack: If you want to use specific frameworks or libraries (like Astro, Tailwind, ShadCN, or any other popular Javacsript framework), mention them in your initial prompt to ensure Bolt scaffolds the project accordingly.
• Use the enhance prompt icon: Before sending your prompt, try clicking the ‘enhance’ icon to have the AI model help you refine your prompt, then edit the results before submitting.
• Scaffold the basics first, then add features: Make sure the basic structure of your application is in place before diving into more advanced functionality. This helps Bolt understand the foundation of your project and ensure everything is wired up right before building out more advanced functionality.
• Batch simple instructions: Save time by combining simple instructions into one message. For example, you can ask Bolt to change the color scheme, add mobile responsiveness, and restart the dev server, all in one go saving you time and reducing API credit consumption significantly.