For people shipping apps with AI

Terminal · Git · AI tools · Prompts

The Vibe Coder Cheat Sheet

Build with AI without pretending the terminal, Git, deployment, and prompts are obvious. One sharp map for the parts beginners actually touch.

Commands
40+
Tools
20+
Skills
19
MCPs
9
Prompts
9
01 · Terminal

Bash you'll actually use

The terminal is a text-based remote control for your computer. You don't need to learn all of it — just these commands will cover 90% of what you do.

Moving around files

  • pwd

    Show which folder you're in right now.

  • ls

    List files and folders in the current directory.

  • ls -la

    List everything, including hidden files (like .env).

  • cd my-folder

    Enter a folder called my-folder.

  • cd ..

    Go up one folder.

  • cd ~

    Go to your home folder.

  • mkdir new-folder

    Create a new folder.

  • touch file.txt

    Create a new empty file.

  • cat file.txt

    Print the contents of a file.

  • rm file.txt

    Delete a file. Careful — no undo.

  • rm -rf folder

    Delete a folder and everything inside it. Extremely dangerous.

    Never run this on a path you don't fully understand.

  • cp a.txt b.txt

    Copy a file (a.txt → b.txt).

  • mv old.txt new.txt

    Rename or move a file.

  • clear

    Wipe the terminal screen. (Cmd/Ctrl+L also works.)

  • open .

    Open the current folder in Finder (Mac). Use explorer . on Windows.

Installing packages

  • pnpm install

    Install all dependencies listed in package.json.

  • pnpm add react-icons

    Add a new package to your project.

  • pnpm add -D eslint

    Add a dev-only dependency (tools, not shipped).

  • pnpm remove react-icons

    Remove a package.

  • pnpm dev

    Start the local dev server. Usually on http://localhost:3000.

  • pnpm build

    Build your app for production.

  • pnpm start

    Run the production build locally.

  • npx shadcn@latest add button

    Install a shadcn/ui component into your project.

Environment & misc

  • echo $PATH

    Show where your shell looks for commands.

  • which node

    Check where a command lives (e.g. node, pnpm, python).

  • node -v

    Check your Node.js version.

  • pnpm -v

    Check your pnpm version.

  • code .

    Open the current folder in VS Code / Cursor.

  • kill -9 $(lsof -ti:3000)

    Free up port 3000 when something's stuck.

02 · Git

Git without the tears

Git is a time machine for your code. Every commit is a save point. When everything breaks, you can always go back to a working version.

The daily loop

  • git status

    See what files you've changed.

  • git add .

    Stage all your changes for the next commit.

  • git commit -m "add login page"

    Save a snapshot with a message.

  • git push

    Send your commits to GitHub.

  • git pull

    Download the latest changes from GitHub.

  • git clone https://github.com/user/repo.git

    Download a project from GitHub.

  • git checkout -b new-feature

    Create and switch to a new branch.

  • git log --oneline -10

    See the last 10 commits in a compact list.

  • git restore file.tsx

    Undo unsaved changes to a file.

    Undo staged file with: git restore --staged file.tsx

The rhythm

  1. 1. Make a small, working change.
  2. 2. git add . to stage it.
  3. 3. git commit -m "what I did"
  4. 4. git push to back it up on GitHub.
  5. 5. Repeat every 15–30 minutes. Future-you will thank you.

Golden rule: commit before any risky change. If it all goes wrong, you're one command away from safety.

03 · AI Tools

Your AI toolbox

Different tools are good at different things. Use a chat for thinking, a builder for shipping, and an SDK when you need to put AI inside your own app.

04 · Cheat Sheets

Visual shortcut sheets

Two quick-reference sheets for the editor loop: Codex Desktop for agent work, Zed for fast local navigation.

OpenAI Codex Desktop cheat sheet

OpenAI Codex Desktop

macOS shortcuts and slash commands for the Codex desktop app.

Download PNG
Zed cheat sheet

Zed

Default macOS shortcuts for the VS Code-style Zed keymap.

Download PNG
05 · Skills

Skills — expertise on tap

Skills are pre-packaged playbooks that AI tools load on demand. Ask for a Stripe checkout and your AI pulls in the Stripe skill, which bundles the right patterns, gotchas, and up-to-date API knowledge. You don't invoke them directly — just describe what you want and the right skill activates.

01 · What you say

“Add Stripe checkout for the Pro plan.”

02 · What loads

The stripe skill — current API, webhook patterns, env vars.

03 · What you get

Working checkout, first try — no hallucinated APIs.

  • ai-sdk-6
    AI

    Chat, streaming, tools, and agents with the current Vercel AI SDK.

    Triggers on: add a chatbot, stream responses, call tools

  • chat-sdk
    AI

    Ship bots across Slack, Teams, Discord, GitHub, and Linear.

    Triggers on: build a Slack bot, Discord bot

  • workflow
    Backend

    Durable, resumable workflows that survive restarts and retries.

    Triggers on: long-running jobs, queues, multi-step flows

  • nuxt
    Framework

    Vue-based full-stack patterns, composables, and server routes.

    Triggers on: building in Nuxt 4+

  • supabase-next16
    Database

    Supabase auth and Postgres, wired up for Next.js 16.

    Triggers on: add login, add a database

  • neon
    Database

    Serverless Postgres with branching — great for AI agents.

    Triggers on: spin up a Postgres DB

  • upstash-redis
    Cache

    Serverless Redis for caching, rate limits, and sessions.

    Triggers on: cache API results, rate limit

  • vercel-blob
    Storage

    File uploads, downloads, and asset management.

    Triggers on: upload images, store PDFs

  • stripe
    Payments

    Checkout, subscriptions, and one-off payments.

    Triggers on: add checkout, take payments

  • shopify
    Commerce

    Storefront API — products, carts, and checkout.

    Triggers on: build a storefront

  • r3f
    3D

    3D scenes, models, and interactions with React Three Fiber.

    Triggers on: add a 3D model, build a 3D scene

  • rapier
    3D

    3D physics — gravity, colliders, and rigid bodies.

    Triggers on: add physics to a 3D scene

  • charts
    Data

    Beautiful charts with shadcn/ui + Recharts.

    Triggers on: add a chart, visualize data

  • fal
    AI

    Image generation with Fal AI models.

    Triggers on: generate images

  • pdf
    Docs

    Generate, parse, and manipulate PDF files.

    Triggers on: create a PDF, extract from PDF

  • vercel-cli
    DevOps

    Manage projects, domains, env vars, and deploys.

    Triggers on: deploy, configure env vars

  • github-cli
    DevOps

    Repos, issues, PRs, and checks from the terminal.

    Triggers on: open a PR, check CI status

  • skill-creation
    Meta

    Package your own workflow as a reusable skill.

    Triggers on: save this as a skill

Pro tip: If the AI gets a library wrong, name the skill out loud: “Use the ai-sdk-6 skill — I want to stream a chat response.” It forces the right playbook to load.
06 · MCPs

MCPs — give your AI superpowers

Where skills are knowledge, MCPs are connections. Model Context Protocol lets an AI tool talk to other services. Plug in Linear and it can create tickets. Plug in Sentry and it can read production errors. Think of them as USB ports for AI.

07 · The Stack

The rest of your stack

Every real app needs a place to live, a place to store data, and a way to take money. Here's the shortlist that works well with AI builders.

08 · Prompt Patterns

How to talk to AI

The difference between a great result and a frustrating one is usually the prompt. These are the patterns that compound.

  • 01

    Be specific, not polite

    AI doesn't need pleasantries. Say exactly what you want, what it should look like, and what it should NOT do.

  • 02

    Show, don't just tell

    Paste an example, screenshot, or link. Describing 'a clean dashboard' works 10× better with a reference attached.

  • 03

    Constrain the scope

    'Only change the Header component. Don't touch anything else.' keeps the AI from rewriting your entire app.

  • 04

    Give it a role

    'Act as a senior designer reviewing this landing page for conversion' gets sharper critique than 'review this page'.

  • 05

    Ask for the plan first

    Before big changes: 'Outline the plan in bullets. Don't write code yet.' Approve the plan, then execute.

  • 06

    Paste the whole error

    Copy the full stack trace — not a summary. The AI reads line numbers and file paths you'd miss.

  • 07

    Iterate in small steps

    Ship one thing. Test it. Then ask for the next thing. Long multi-step prompts compound bugs.

  • 08

    Ask for tradeoffs

    'Give me 3 approaches with pros and cons' surfaces options you didn't know existed.

09 · Prompt Library

Steal these prompts

Copy, paste, fill in the blanks. These are the prompts you'll reach for again and again. Replace the bracketed parts with your specifics.

  • Kick off a new app

    Starting from scratch

    Build a [type of app] for [audience]. Core features: [1, 2, 3]. Use Next.js, Tailwind, and shadcn/ui. Design should feel [adjective, adjective]. Start with the homepage only — I'll approve before we build more pages.
  • Design review

    Your UI looks 'off' and you can't tell why

    Act as a senior product designer. Review this page for visual hierarchy, spacing, typography, and color usage. List the top 5 issues and a specific fix for each. Be blunt.
  • Debug an error

    Something broke

    I'm getting this error:
    
    [paste full error]
    
    Here's the relevant file:
    
    [paste code]
    
    Explain in plain English what's wrong, why it happened, and the smallest possible fix.
  • Explain this code

    AI wrote something you don't understand

    Explain this code to me like I've never seen it before. Walk through each section, what it does, and why it exists. Flag anything that looks risky or unusual.
  • Add auth

    You need logins

    Add email + password authentication using Supabase. Create a sign-up page, a login page, and protect the /dashboard route. Show the user's email in the top-right when logged in, with a logout button.
  • Connect a database

    Your data needs to persist

    Set up a Supabase table called [name] with these columns: [list]. Then replace the mock data in [component] with real reads and writes. Include loading and error states.
  • Refactor safely

    The code is getting messy

    Refactor [file] without changing any behavior. Keep the same props, exports, and output. Focus on readability: smaller functions, clearer names, remove duplication. List what you changed and why.
  • Write the copy

    Placeholder text everywhere

    Rewrite all copy on this page. Audience: [who]. Tone: [words]. The goal is to [action]. Keep each headline under 8 words and each paragraph under 2 sentences.
  • Ship it

    Ready to deploy

    Walk me through deploying this to Vercel. List every environment variable I need to set, where to get each value, and how to verify the deploy worked.
10 · When It Breaks

Fixes for the common stuff

Something will break. It's not personal — it happens to everyone. Here's the quick triage for the errors you'll hit most.

  • 'Module not found' error

    You're importing a package that isn't installed. Run: pnpm add [package-name]. If it's a local file, check the import path and capitalization.

  • 'Port 3000 is already in use'

    Another dev server is running. Close it, or run: kill -9 $(lsof -ti:3000) to force-free the port. On Windows: netstat -ano | findstr :3000 then taskkill /PID [pid] /F.

  • Changes aren't showing up

    Hard refresh the browser (Cmd/Ctrl+Shift+R). Still nothing? Stop the dev server (Ctrl+C) and run pnpm dev again. Still nothing? Delete .next and node_modules, then pnpm install.

  • 'Cannot find module' after pulling changes

    Someone added a new package. Run pnpm install to sync your dependencies with the latest package.json.

  • Environment variables aren't working

    Restart the dev server — env vars only load on startup. In Next.js, client-side vars must start with NEXT_PUBLIC_. Never commit .env files to Git.

  • Deploy works locally but breaks on Vercel

    99% of the time it's a missing environment variable. Check the Vercel dashboard → Settings → Environment Variables. Redeploy after adding them.

  • Git says 'merge conflict'

    Two people changed the same lines. Open the flagged files, look for <<<<<<< markers, pick which version to keep, delete the markers, then git add . and git commit.

  • The AI keeps making the same mistake

    Start a fresh chat. Long conversations accumulate bad context. Paste only the relevant files and describe the exact problem again.

11 · Learn More

Docs and communities

AI is amazing at writing code, but you'll build better apps the more you understand the fundamentals. These are the highest-quality free resources.