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

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 --versionto 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.new | Claude Code |
|---|---|
| Chat prompt | Chat prompt (same conversational style) |
| "Make a login page" | "Create a login page component in src/components" |
| Instant preview | npm run dev in browser |
| Undo = chat "revert that" | git checkout . or chat "undo that edit" |
| Deploy button | git push (auto-deploys via CI/CD) |
| Bolt's AI context | Claude 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
buildscript exists:"build": "vite build" - Check output directory matches Vercel settings (usually
distfor Vite) - Add
vercel.jsonif 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 revertany 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.aiRelated Posts
Why Your QA Team Is Secretly Running Your Company (And Your Developers Don't Want You to Know) | desplega.ai
A satirical exposé on how QA engineers have become the unsung kingmakers in software organizations. While CTOs obsess over microservices, QA holds the keys to releases, customer satisfaction, and your weekend.
Rabbit Hole: Why Your QA Team Is Building Technical Debt (And Your Developers Know It) | desplega.ai
Hiring more QA engineers without automation strategy compounds technical debt. Learn why executive decisions about test infrastructure matter 10x more than headcount.
Rabbit Hole: TDD in AI Coding Era: Tests as Requirements
TDD transforms into strategic requirement specification for AI code generation. Tests become executable contracts that reduce defects 53% while accelerating delivery.