Skip to main content
 /  Around 8 minutes to read

Vibe Coding From Anywhere

Building a $10/mo portable development environment.

It's 11pm. You're on the couch, scrolling through your phone, when suddenly that feature idea you've been mulling over crystallizes. The implementation is clear in your mind. But your laptop is upstairs, and honestly, you're comfortable right where you are.

Vibe Coding From Anywhere

Or maybe you're on the train, forty minutes from home, watching the landscape blur past. That side project you've been thinking about? You just figured out how to solve that tricky problem. But by the time you get home, make dinner, deal with life, the ideas will be gone.

This is the reality of modern development. Our best ideas rarely arrive when we're sitting at our desk. They come in the gaps, in the quiet moments, in the places where we can't traditionally code.

The dream isn't just mobile coding. It's vibe coding. It's having a real development environment, complete with AI pair programming, accessible from your phone. It's being able to turn inspiration into implementation, regardless of where you are.

Here's how to build that dream for $10 a month.

The Philosophy: This Isn't Production

Before we dive into the technical setup, let's be clear about what we're building. This is a sandbox VPS, a playground where you can experiment, break things, and learn without consequences.

This isn't about hotfixing production at 2am from your phone (though technically you could). It's about capturing ideas when they arrive. Code here, push to Git, and deploy to production through your proper CI/CD pipeline later. That separation is liberating. You can try wild ideas without worrying about taking down your live site.

Think of it as your portable sketchpad, but for code.

The Stack: What $10 Actually Gets You

For the price of a streaming subscription, here's your setup:

  • Ubuntu VPS with 2GB RAM, 55GB storage
  • Your own .dev domain (or use whatever domain you have laying around)
  • Multiple project environments running simultaneously
  • Full VS Code in your browser
  • Claude Code for AI pair programming
  • Secure, password-protected preview URLs
  • Everything accessible from your phone

The flow is beautifully simple: VPSDomainNginxSSLGittmuxMobile. Each piece serves a purpose, and together they create something greater than the sum of their parts.

Foundation: Your Server in the Cloud

Start with a VPS. I chose Vultr at $10/month, but DigitalOcean, Hetzner, or Linode work just as well. The key specs you need:

  • 2GB RAM (1GB works, but 2GB gives you breathing room)
  • 25-50GB storage
  • Ubuntu 22.04 LTS (stick with LTS for stability)

First moves after spinning up your server:

Bash/Shell
# Update everything
apt update && apt upgrade -y

# Create a non-root user
adduser dev
usermod -aG sudo dev

# Set up swap file for memory management
fallocate -l 2G /swapfile
chmod 600 /swapfile
mkswap /swapfile
swapon /swapfile

Never work as root. Your dev user has sudo powers when needed but operates safely by default.

For SSH access, set up key authentication. First, check if you already have an SSH key on your local machine:

Bash/Shell
# On your local machine
ls ~/.ssh/id_rsa.pub

If the file doesn't exist, generate a new SSH key:

Bash/Shell
# Still on your local machine
ssh-keygen -t rsa -b 4096
# Just press Enter for all prompts to use defaults

Now copy your public key to the server:

Bash/Shell
# From your local machine
ssh-copy-id dev@your-server-ip
# Enter the dev user's password one last time

This copies your public key to the server's ~/.ssh/authorized_keys file. From now on, you can SSH without a password.

Then create a config entry on your local machine (~/.ssh/config):

Bash/Shell
Host mydev
    HostName your-server-ip
    User dev
    Port 22

Now you can connect with just ssh mydev. Clean, simple, secure.

Web Infrastructure: Making It Accessible

Nginx is your traffic director. It takes incoming requests and routes them to the right service. Install it along with SSL tools:

Bash/Shell
sudo apt install -y nginx certbot python3-certbot-nginx

Your domain needs proper DNS records. If you bought domain.dev, set up:

  • A record: code.domain.dev → your-server-ip
  • A record: *.preview.domain.dev → your-server-ip

That wildcard subdomain is magic. It means anything.preview.domain.dev automatically points to your server. Each project gets its own preview URL without additional DNS configuration.

SSL is non-negotiable in 2025, and .dev domains require it anyway. Certbot makes this trivial:

Bash/Shell
sudo certbot --nginx -d code.domain.dev

For wildcard certificates (covering all preview subdomains), you'll need DNS validation:

Bash/Shell
sudo certbot certonly --manual --preferred-challenges dns -d "*.preview.domain.dev"

Password protection keeps your experiments private. Create an htpasswd file:

Bash/Shell
sudo htpasswd -c /etc/nginx/.htpasswd dev

Now every preview URL requires authentication. Your code is visible only to you.

Development Tools: The Core Setup

Let's install the essentials for web development:

Bash/Shell
# PHP and friends
sudo apt install -y php-cli php-mysql php-mbstring php-xml php-curl php-zip composer

# Node.js for modern JavaScript
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt install -y nodejs

# MySQL for databases
sudo apt install -y mysql-server

But here's where it gets interesting. Code-server brings VS Code to your browser:

Bash/Shell
curl -fsSL https://code-server.dev/install.sh | sh
sudo systemctl enable --now code-server@dev

Configure Nginx to proxy Code-server:

Nginx
server {
    listen 443 ssl;
    server_name code.domain.dev;
    
    location / {
        proxy_pass http://127.0.0.1:8080;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }
}

Now VS Code runs at https://code.domain.dev/. Full IDE, in your browser, accessible from anywhere.

The real magic comes with Claude Code though:

Bash/Shell
npm install -g @anthropic-ai/claude-code

This gives you an AI pair programmer right in your terminal. The catch? Running as non-root triggers permission prompts. The fix (for dev servers only, don't do this on a prod server):

Bash/Shell
echo 'alias claude="claude --dangerously-skip-permissions"' >> ~/.bashrc
source ~/.bashrc

Now you can type claude "help me refactor this function" and get instant AI assistance. Remember: this skip-permissions flag is only for your personal dev server. Never use it in production environments. Or do it, but don't blame me if something goes wrong 😉

Tailwind CSS: Rapid Styling Without the Bulk

Tailwind CSS deserves its own section because it's perfect for this workflow. The standalone CLI runs anywhere, no Node.js build process required. Here's how to set it up:

Bash/Shell
# Download the standalone CLI
cd ~
curl -sLO https://github.com/tailwindlabs/tailwindcss/releases/latest/download/tailwindcss-linux-x64
chmod +x tailwindcss-linux-x64
sudo mv tailwindcss-linux-x64 /usr/local/bin/tailwindcss

# Verify it works
tailwindcss --help

For each project that needs Tailwind, create a simple build setup:

Bash/Shell
cd ~/projects/mysite

# Initialize Tailwind
tailwindcss init

# Create your input CSS file
cat > input.css << EOF
@tailwind base;
@tailwind components;
@tailwind utilities;
EOF

# Create a build script
cat > build-css.sh << EOF
#!/bin/bash
tailwindcss -i ./input.css -o ./public/style.css --watch
EOF

chmod +x build-css.sh

Now you can run ./build-css.sh in a tmux pane and Tailwind watches for changes, rebuilding automatically. The beauty of this approach:

Bash/Shell
tmux new -s mysite
# Split the window: Ctrl+B then %
# Left pane: php -S localhost:3000
# Right pane: ./build-css.sh

Your PHP server runs on the left, Tailwind watches on the right. Both keep running when you disconnect.

For production builds, add the minification flag:

Bash/Shell
tailwindcss -i ./input.css -o ./public/style.css --minify

This setup is particularly powerful with Claude Code. You can ask Claude to generate Tailwind components and see them instantly reflected in your preview URL. No complex build pipeline, no webpack configuration, just CSS that updates as you code.

If you prefer using Node.js and npm (maybe you're already using it for other build processes), you can install Tailwind the traditional way:

Bash/Shell
cd ~/projects/mysite
npm init -y
npm install -D tailwindcss

# Add to package.json scripts:
"scripts": {
    "buildCSS": "npx tailwindcss -i input.css -o assets/css/style.css --minify",
    "watchCSS": "npx tailwindcss -i input.css -o assets/css/style.css --watch"
}

Then run npm run watchCSS in your tmux pane. This approach makes sense if you're already managing other npm packages, but for pure simplicity, the standalone CLI is hard to beat.

The standalone CLI approach means one less dependency to manage, faster builds, and perfect compatibility with our simple PHP server setup. It's the ideal CSS solution for vibe coding.

Git Workflow: Syncing Your Worlds

Git is your bridge between local and server development. But GitHub killed password authentication, so you need personal access tokens:

  1. GitHub → Settings → Developer settings → Personal access tokens
  2. Generate token with 'repo' scope
  3. Use token as password when Git asks

Store credentials so you don't retype them:

Bash/Shell
git config --global credential.helper store
git config --global user.name "Your Name"
git config --global user.email "you@email.com"

Then the workflow simply becomes:

  • Local development when at your computer
  • Push changes to GitHub
  • Pull on server when on mobile
  • Edit, test, commit, push from server
  • Pull on local when back at computer

Or even simpler: skip local development entirely and work exclusively on the VPS. With code-server and Claude Code, your server can become your primary development machine. No syncing needed, just push to Git when ready for production.

Your code follows you seamlessly. You might have concerns about latency and lag, but I have not experienced significant lag in my testing. YMMV.

tmux: Persistent Sessions

The PHP development server dies when you disconnect. tmux keeps it alive:

Bash/Shell
tmux new -s projectname
cd ~/projects/myproject
php -S localhost:3000

# Ctrl+B, then D to detach

Your server keeps running. Come back hours later:

Bash/Shell
tmux attach -t projectname

Everything's exactly as you left it. Multiple projects? Multiple tmux sessions:

  • tmux new -s frontend for your React app
  • tmux new -s backend for your API
  • tmux ls to see all sessions

This persistence is crucial for mobile development. You can't keep SSH connections alive on a phone, but tmux doesn't care.

Project Setup: Real Examples

Here's a simple PHP project structure:

Bash/Shell
mkdir ~/projects/mysite
cd ~/projects/mysite
git init
echo ".DS_Store" > .gitignore

Configure Nginx to route your preview subdomain:

Nginx
server {
    listen 443 ssl;
    server_name ~^(?<project>.+)\.preview\.domain\.dev$;
    
    location / {
        if ($project = "mysite") {
            proxy_pass http://localhost:3000;
        }
        if ($project = "api") {
            proxy_pass http://localhost:3001;
        }
    }
}

Start your project in tmux:

Bash/Shell
tmux new -s mysite
php -S localhost:3000

Access it at https://mysite.preview.domain.dev/. Password protected, SSL secured, professionally presented.

The Mobile Experience: Where Magic Happens

Termius changes everything. It's a native iOS/Android SSH client that actually works. No web terminal lag, proper-ish copy/paste, real keyboard support.

Setup is straightforward:

  1. Add your server (IP, port 22, username)
  2. Generate SSH key in Termius
  3. Add public key to server's ~/.ssh/authorized_keys
  4. Connect without passwords

The workflow on mobile becomes:

  1. Open Termius
  2. Connect to your server
  3. Attach to tmux session (or just jump straight to work if you keep sessions running)
  4. Pull latest code from Git
  5. Edit with nano or vim (not ideal I know, so just use Claude Code)
  6. Test in browser
  7. Commit and push

Code-server works on mobile browsers, but it's clunky. Small buttons, weird keyboard behaviour, constant zooming. Termius + Claude Code is surprisingly better. You're not typing massive amounts of code on your phone anyway. You're making surgical changes, experimenting with ideas, using AI to generate boilerplate.

Real-World Usage: How It Actually Feels

Last Tuesday, 11pm. I'm about to go to bed, when I realize how to fix that CSS animation on my site that's been bugging me. Instead of getting up and firing up the laptop, I grab my phone and open Termius.

Bash/Shell
cd ~/projects/site
git pull
claude "fix the hero section animation timing"
git commit -m "Fixed animation timing"
git push

Five minutes. Problem solved. No laptop required. No need to attach to tmux since I keep my sessions running permanently.

Or imagine being on a train or a plane. A long commute could be productive time:

  • git pull and review yesterday's code
  • Try that new approach you've been considering
  • Test it live on your preview URL
  • Refactor with Claude's help
  • Push to Git before you land

The psychological shift is profound. Code isn't locked to your desk anymore. Ideas can be explored when they arrive, not when you finally get to your computer.

Gotchas and Solutions

Database Synchronization: Databases need a source of truth. The cleanest approach? Production is the source. When you need fresh data on your dev server:

Bash/Shell
# Export from production (via your prod backup system)
# Then on dev server:
scp prod-backup.sql mydev:~/
mysql database < prod-backup.sql

This way you're always working with real data, but never risking production. Create content on production, code on dev. When you need to test with latest content, pull a fresh database dump. Never push database changes upstream, only code through Git.

Environment Variables: Keep separate .env files. Never commit them. Each environment has its own settings:

  • Local: SITE_URL=http://localhost:3000
  • Server: SITE_URL=https://project.preview.domain.dev

Performance: The PHP built-in server isn't production-grade, but for development? It's perfect. Lightweight, simple, sufficient.

Limited Mobile Editing: You're not writing novels on your phone. You're making targeted changes, testing ideas, leveraging AI for heavy lifting. Adjust expectations accordingly.

The Setup Script

Want to automate this? Here's a setup script for new projects:

Bash/Shell
#!/bin/bash
PROJECT=$1
PORT=$2

# Create project
mkdir -p ~/projects/$PROJECT
cd ~/projects/$PROJECT
git init

# Add to Nginx config
sudo bash -c "cat >> /etc/nginx/sites-available/preview" << EOF
    if (\$project = "$PROJECT") {
        proxy_pass http://localhost:$PORT;
    }
EOF

# Reload Nginx
sudo nginx -t && sudo systemctl reload nginx

# Create tmux session
tmux new -s $PROJECT -d "cd ~/projects/$PROJECT && php -S localhost:$PORT"

echo "Project $PROJECT running at https://$PROJECT.preview.domain.dev"

Save it, make it executable, and spinning up new projects becomes:

Bash/Shell
./new-project.sh coolapp 3002

Cost Breakdown

Alright, let's talk money:

  • VPS: $10/month (Vultr/DigitalOcean/Hetzner)
  • Domain: $12/year (roughly $1/month)
  • Everything else: Free (you can get the pro version of Termius but it's not required.)

Total: $11/month for unlimited projects, accessible from anywhere, with AI assistance built in.

The Vibe: What This Really Enables

This setup isn't about emergency fixes or working on vacation. It's about something more fundamental: removing friction between idea and implementation.

That moment of inspiration on the couch? Captured. The solution that comes during your commute? Implemented. The "what if I tried..." thought at midnight? Tested. Claude Code is the real differentiator here too. It's just so good, and I enjoy working with the CLI.

You're not carrying a laptop everywhere. You're not remote-desktoping into your home machine. You have a real development environment, with real tools, accessible from the device already in your pocket.

Conclusion: Your Ideas Don't Wait

Building this takes what? 2 hours, if that. Less time than binge-watching a TV series. The result? Complete freedom to code whenever, wherever inspiration strikes.

This isn't about being always-on or working more. It's about working when you feel it. When the vibe is right, and when the idea is fresh.

The future of coding isn't bigger monitors or faster laptops. It's the freedom to create from anywhere, with AI as your pair programmer, using the device you already carry.

Welcome to vibe coding. This is the future.