How do I set up account and explore interface?

# Step 1: Get Started with Bolt.new 1. Visit [bolt.new](https://bolt.new/) in your web browser. 60 2. Click 'Start building' or 'Try for free' to create a StackBlitz/Bolt account (uses GitHub login or email). 64 3. Familiarize with the interface: - **Chatbox**: Bottom area for prompts. - **Preview pane**: Live app preview. - **Code view**: Toggle to edit files directly. 62 - **Sidebar**: Projects list (hover left edge). 4. Review settings: Bottom-left gear icon for agent selection (Claude recommended), personal settings. 63 Free tier includes 1M tokens/month; upgrade for more. 58

How do I create your first app with prompts?

# Step 2: Build a Simple App 1. On homepage, type a prompt: 'Create a todo list app with React and Tailwind CSS'. 63 2. Click arrow or Enter; AI scaffolds the app. 64 3. Use 'Enhance' icon to refine prompt if needed. 4. Preview the running app; interact to test. 5. Rename project: Click title > Rename. Tips: Specify stack upfront (e.g., Next.js, Shadcn). 63

How do I iterate and edit code effectively?

# Step 3: Refine and Customize 1. Prompt changes: 'Add dark mode toggle' or 'Make responsive for mobile'. 63 2. Toggle Code View to edit files manually (e.g., add features in src/). 3. Use backups: Project menu > Rollback if issues. 62 4. Batch instructions: 'Fix bugs, add login form, restart server'. 5. Test in preview; use browser console for debug.

How do I add backend with databases?

# Step 4: Integrate Data and Backend 1. Prompt: 'Add user authentication with Supabase' or use Bolt Cloud DB. 64 2. Access DB: Sidebar > Database tab; view/edit data. 62 3. Connect Stripe for payments if needed via integrations. 4. Test CRUD operations in app. 5. Explore supported tech: JS frameworks, Node servers. 62

How do I deploy, backup, and collaborate?

# Step 5: Deploy and Manage 1. Deploy: Click 'Deploy' > Use Bolt hosting (.bolt.host free). 64 2. Custom domain (Pro): Bolt Cloud > Domains. 62 3. GitHub: Connect repo via integrations; push/pull changes. 65 4. Share: Set visibility (Public/Secret); duplicate/export ZIP. 5. Backup: Export > Download ZIP; join Discord for community. 63

Master Bolt.new: Build AI Apps in 5 Steps

🧰

Instant Toolkit

2 artifacts

📋
Step-by-Step Guide

1

Step 1: Get Started with Bolt.new

Visit bolt.new in your web browser.
Click 'Start building' or 'Try for free' to create a StackBlitz/Bolt account (uses GitHub login or email).
Familiarize with the interface:
- Chatbox: Bottom area for prompts.
- Preview pane: Live app preview.
- Code view: Toggle to edit files directly.
- Sidebar: Projects list (hover left edge).
Review settings: Bottom-left gear icon for agent selection (Claude recommended), personal settings.

Free tier includes 1M tokens/month; upgrade for more.

Why this step matters:

-Establishes a strong foundation for prompting and building
-Enables seamless workflow in browser without setup

15-30 minutes

Web browser (Chrome recommended), GitHub account

$0

Definition of Done

•Account created and logged in
•Interface elements identified (chatbox, preview, code view)

Common Mistakes to Avoid

❌ Skipping agent selection

→Choose Claude Agent for best results in settings

❌ Using unsupported browser

→Use latest Chrome or Firefox for WebContainers

2

Following along, or just reading? 👀

Spin up a personalized “learn Bolt.new” plan you can save, check off, and return to anytime — unlimited on the free trial.

Start free trial →

3

4

5

🎥
Suggested Videos

Bolt.New AI Tutorial for Beginners: Create an App in Under 20 Minutes

The ultimate guide to Bolt.new | Build apps with AI (step-by-step)

Bolt tutorial for beginners with the Bolt CEO Eric Simons

📚
Learning Resources

📖 Online Courses

Boltnew AI - From Code to App

beginner

Paid

Coursera

Learn Bolt.new Web App Development – Full Course

beginner

Instructa.ai

Bolt.new: Introduction - Create AI-Driven Web Applications

beginner

Paid

LinkedIn Learning

📖 Recommended Books

Building Web Apps with Bolt

beginner

by Packt Publishing

🌐 Helpful Websites

Bolt Help Center

documentation

Official docs, FAQs, and tutorials

Bolt.new GitHub Repo

documentation

Open-source code and contributing guide

Bolt.new Pricing

documentation

Plans and token details

🛠️ Useful Tools

Bolt.new

Development

AI-powered browser app builder

StackBlitz WebContainers

IDE

In-browser dev environment

Bolt Discord

Community

Community support

Master Bolt.new: Build AI Apps in 5 Steps