Back to Blog
January 19, 2026

Bolt to Claude Code: Keep Your AI Workflow While Adding Git

A weekend migration guide for makers ready to add version control without sacrificing velocity

Bolt to Claude Code migration workflow comparison showing AI-assisted development with version control

You've been shipping fast with Bolt.new. Chat with AI, watch your app materialize, deploy instantly. It's been magical—until you hit that moment: a client wants Git history, your co-founder needs to collaborate, or you accidentally overwrote three hours of work.

You've mastered rapid prototyping. Now it's time to add professional tooling without losing the AI-first workflow that made you productive. This guide shows you how to migrate from Bolt.new to Claude Code in a weekend, keeping your conversational development speed while gaining version control, proper deployment pipelines, and team collaboration capabilities.

Before/After: What Changes

Before (Bolt.new):

  • Chat in browser → instant preview → one-click deploy
  • No Git, no local files, no command line
  • Perfect for MVPs and prototypes
  • Hit limits: can't customize deployment, limited context window, no rollback

After (Claude Code):

  • Chat in terminal → instant file edits → Git commits → deploy pipeline
  • Full Git history, local development, CI/CD control
  • Same conversational coding, now with professional guardrails
  • Keep AI speed, gain: branching, testing, team workflows, deployment flexibility

Prerequisites Checklist

Before starting, have these ready:

  • Your Bolt.new project - Open and functional
  • GitHub account - Free tier works fine
  • Claude.ai account - Sign up at claude.ai
  • Node.js installed - Version 18+ (run node --version to check)
  • VS Code installed - Or your preferred code editor
  • 30 minutes - Realistically, first migration takes an hour

Step-by-Step Migration Guide

Step 1: Export Your Bolt Project

Bolt doesn't have a direct "export" button, but you can extract your project:

  • Open your Bolt project
  • Click the "Download" icon (usually top-right near preview)
  • Save the ZIP file to your computer
  • Extract it to a new folder: ~/Projects/my-app

Pro tip: If Bolt doesn't show a download option, use the browser DevTools to copy file contents manually. Open DevTools → Sources tab → navigate through the file tree → copy each file.

Step 2: Initialize Git Repository

Open terminal in your project folder and run:

cd ~/Projects/my-app
git init
git add .
git commit -m "Initial commit from Bolt.new"

# Connect to GitHub (create repo first at github.com/new)
git remote add origin https://github.com/yourusername/my-app.git
git branch -M main
git push -u origin main

You now have version control. Every change from here will be tracked.

Step 3: Install Claude Code

Claude Code brings AI assistance directly into your terminal:

# Install Claude CLI globally
npm install -g @anthropic-ai/claude-cli

# Authenticate
claude auth login

# Navigate to your project
cd ~/Projects/my-app

# Start Claude Code
claude code

You'll see a chat interface in your terminal. This is your new Bolt-style workspace, but with direct file system access.

Step 4: Configure Claude to Match Your Bolt Workflow

Create a .claude/config.json file in your project:

{
  "context": {
    "files": ["src/**/*", "package.json", "README.md"],
    "maxTokens": 100000
  },
  "workflow": {
    "autoCommit": false,
    "createBackups": true
  },
  "prompts": {
    "style": "conversational",
    "verbosity": "detailed"
  }
}

This tells Claude to:

  • Automatically load your project files as context
  • Use conversational style (like Bolt)
  • Create backups before major changes
  • Ask before committing (you control Git)

Step 5: Test Your First AI Edit

Let's verify everything works. In Claude Code, try:

"Add a console.log to the main app file that prints 'Migration successful' when the app starts"

Claude will:

  • Analyze your project structure
  • Find the correct entry file
  • Make the edit
  • Show you a diff of changes

Run your app (npm run dev) and verify the log appears. If it works, commit:

git add .
git commit -m "Test: add startup log"
git push

Step 6: Set Up Deployment Pipeline

Bolt handled deployment automatically. With Claude Code, you choose your platform. For Vercel (closest to Bolt's experience):

# Install Vercel CLI
npm i -g vercel

# Connect your project
vercel link

# Deploy
vercel --prod

Now configure automatic deployment: go to Vercel dashboard → Settings → Git → connect your GitHub repo. Every push to main deploys automatically.

Alternative platforms:

  • Netlify - Similar to Vercel, great for static sites
  • Railway - Best for full-stack apps with databases
  • Render - Good free tier, flexible deployment options

Skill Bridge: Bolt Concepts → Claude Code

Here's how your Bolt skills translate:

Bolt.newClaude Code
Chat promptChat prompt (same conversational style)
"Make a login page""Create a login page component in src/components"
Instant previewnpm run dev in browser
Undo = chat "revert that"git checkout . or chat "undo that edit"
Deploy buttongit push (auto-deploys via CI/CD)
Bolt's AI contextClaude reads entire project automatically

Advanced Workflow: Branching for Features

You've been iterating in one continuous stream. Now you can work on multiple features safely:

# Create feature branch
git checkout -b feature/new-dashboard

# Chat with Claude, make changes
claude code
> "Build a new analytics dashboard page"

# Commit when ready
git add .
git commit -m "Add analytics dashboard"

# Push and create PR
git push -u origin feature/new-dashboard
gh pr create --title "New Analytics Dashboard" --body "Dashboard with user metrics"

Your main branch stays clean. Test the feature branch on a preview URL (Vercel creates these automatically), then merge when ready.

Troubleshooting Common Issues

Issue: "Claude doesn't see my files"

Solution: Check you're in the project directory. Run pwd to verify. Claude Code needs to start from your project root.

Issue: "Dependencies missing after export"

Solution: Bolt includes node_modules in exports sometimes. Delete that folder and run:

rm -rf node_modules
npm install

Issue: "Deployment fails on Vercel"

Solution: Check build command in package.json. Bolt uses different defaults. Common fixes:

  • Ensure build script exists: "build": "vite build"
  • Check output directory matches Vercel settings (usually dist for Vite)
  • Add vercel.json if custom routing needed

Issue: "Claude changes wrong files"

Solution: Be specific with file paths in prompts:

  • Vague: "Add error handling"
  • Specific: "Add try-catch error handling to the login function in src/auth/login.ts"

What You've Gained

After this migration, you can:

  • Roll back mistakes - git revert any change
  • Collaborate - Team members can clone, branch, and PR
  • Customize deployment - Add testing, staging environments, custom domains
  • Work offline - Full local development environment
  • Scale context - Claude can work with larger codebases than Bolt

And you haven't lost anything—you're still shipping with AI at the same velocity, just with professional guardrails.

Next Steps

Your migration is complete when you've:

  • Exported and Git-initialized your Bolt project
  • Successfully made an AI-assisted edit with Claude Code
  • Deployed via your chosen platform
  • Created your first feature branch

From here, explore:

  • Testing - Add Vitest or Jest for confidence before deployment
  • CI/CD - Set up GitHub Actions to run tests automatically
  • Environment variables - Secure API keys properly (not hardcoded)
  • Monitoring - Add Sentry or LogRocket to catch production errors

You've leveled up. Same AI-powered speed, now with the tooling that scales.

Ready to Level Up Your Workflow?

At Desplega.ai, we help development teams across Spain—Barcelona, Madrid, Valencia, and Malaga—transition from vibe coding to production-ready workflows. Whether you're migrating from Bolt, Lovable, or Replit, we provide consulting, training, and tooling to maintain your velocity while adding professional practices.

Get Started with Desplega.ai