Coding
for
Marketers

The Difference

ChatGPT gives you advice. Agentic tools do the work.

function ContactForm() {
  return <form>...</form>
}

You're the middleware between AI and your project.

What Agents Are Great At

Agents excel at work humans find tedious, error-prone, or overwhelming. Understanding this helps you delegate effectively.

What You Can Build

Real marketing projects you can build with AI agents. Each example is a prompt away.

Pick one thing you wish existed. Tell Claude to build it. Iterate.

Terminal Basics

The terminal is where you run commands. Claude Code uses it too. These are the same commands you'll see it run.

Install Node.js

Before installing Claude Code, you need Node.js. It's a runtime that lets you run JavaScript tools like npm (Node Package Manager).

Once Node.js is installed, you're ready to install Claude Code.

Getting Started

From zero to your first project in 5 steps. No coding knowledge required.

That's it. You just need a description of what you want to build.

What Code Actually Is

Code is just text files in folders. A "project" is a folder with rules about how the files work together.

Click folders to explore. This is all a project is: organized text files.

The Software Stack

Modern software has layers. Here's where you fit in.

As a marketer, you work at layer 2. The agentic tool handles everything else.

Running Locally & Ports

"localhost" means your computer. A "port" is like an apartment number: which app to connect to.

Environment Variables & API Keys

Secrets like passwords and API keys are stored separately from your code. Never in files that get uploaded to GitHub.

Context & Tokens

AI models have a "context window", a limit on how much they can remember in one conversation.

Markdown Files

Markdown (.md) is a simple way to format text. It's used for READMEs, docs, and notes.

How It Actually Works

You describe what you want. The agent reads your code, makes a plan, and executes.

Agent Modes

Control how much autonomy your agent has. Start safe, speed up as you get comfortable.

The Iteration Loop

You don't need to get it right the first time. Describe, review, refine.

Git & GitHub

Your safety net. Every change is tracked, nothing is lost.

Learning by Asking

You don't memorize syntax. You ask "why" and build intuition over time.

Week 1: "What does this do?" → Week 8: "I know what we need" → Week 12: "Try this instead"

Debugging

Errors are normal. Paste them to the agent and ask "What does this mean?"

If a fix makes things worse, undo with: git checkout .

Testing & TDD

Tests are code that checks if your code works. Write tests first, then the code.

Extending Your Agent

Give your AI more powers. Think of it as assembling a team of specialists.

Skills

Skills are reusable capabilities you can add to your AI agent. They give Claude domain expertise: best practices, patterns, and procedural knowledge.

Tech Stacks

AI tools work best with popular languages. Start with Next.js unless you have a reason not to.

Learn by Exploring

Clone these open source Vercel templates to see how real projects are built. Poke around, break things, ask Claude to explain what you find.

Try It Yourself

You just learned everything you need to start building. Click through this terminal to see the workflow in action.