AI Toolkit

Claude Prompts

Ready-to-use prompts for common tasks. These aren't just copy-paste templates—each one teaches you how to think about a type of problem.

How to use these prompts

Replace the bracketed placeholders [like this] with your specific details. The goal isn't just to get an answer—it's to learn how to communicate with AI effectively. Over time, you'll write your own prompts instinctively.

beginnerWebsite Generation

Start a New Component

I need to create a new React component for [describe what it does]. The site uses Next.js and Tailwind CSS. Can you help me create a clean, reusable component that follows React best practices? Show me the component structure first before writing the full code.

What This Teaches

How to think about component structure before coding, and how to communicate requirements clearly.

When to Use

When you need to build something new from scratch.

beginnerWebsite Generation

Understand Existing Code

I'm looking at this code and I want to understand what it does before I make changes. Can you explain this code to me step by step, including what each part does and why it might have been written this way? [paste code]

What This Teaches

How to read and understand code you did not write—a critical professional skill.

When to Use

Before editing any code you do not fully understand.

beginnerWebsite Generation

Find and Replace Safely

I need to find all instances of [old text/value] in this codebase and replace them with [new text/value]. Can you help me search for all occurrences and make sure I do not miss any? Also flag if any replacements might cause issues.

What This Teaches

Systematic searching and the importance of checking for unintended consequences.

When to Use

When updating content, names, or values across a project.

intermediateDesign Improvement

Improve Visual Hierarchy

This section does not feel visually balanced. Can you suggest Tailwind CSS changes to improve the visual hierarchy? I want the most important element to stand out, good spacing, and a professional feel. Current code: [paste code]

What This Teaches

How visual hierarchy works and how to use CSS to create emphasis.

When to Use

When something looks "off" but you are not sure why.

beginnerDesign Improvement

Make It Responsive

This component looks good on desktop but breaks on mobile. Can you help me add responsive Tailwind classes so it works on all screen sizes? Show me the mobile-first approach. [paste code]

What This Teaches

Mobile-first responsive design patterns using Tailwind breakpoints.

When to Use

When a design does not work on smaller screens.

intermediateDesign Improvement

Match Existing Style

I need to create a new section that matches the style of this existing section. Can you analyze the design patterns used here (colors, spacing, typography, effects) and help me replicate them for my new section? [paste reference code]

What This Teaches

How to identify and extract design patterns from existing code.

When to Use

When adding new sections that need to feel consistent with existing design.

beginnerDebugging

Fix an Error Message

I am getting this error: [paste error]. Can you explain what this error means in simple terms, why it is happening, and walk me through how to fix it step by step?

What This Teaches

How to read error messages and systematic debugging.

When to Use

When you encounter any error message.

beginnerDebugging

Something Is Not Displaying

This element is not showing up on the page but there are no errors. Can you help me debug why? Here is my code: [paste code]. Walk me through the common reasons something might not display.

What This Teaches

Common causes of invisible elements (CSS issues, conditional rendering, etc.).

When to Use

When code seems correct but nothing appears.

beginnerDebugging

Check My Changes

I just made these changes and want to make sure I did not break anything. Can you review my changes and point out any potential issues or improvements? [paste before and after code]

What This Teaches

Code review practices and catching bugs before they go live.

When to Use

Before committing any significant changes.

intermediateCopywriting

Improve Website Copy

This website copy needs to be more compelling. The business is [describe business] and the goal of this section is [describe goal]. Can you suggest improved copy that is clear, professional, and encourages action? Current copy: [paste text]

What This Teaches

How good copy drives business results and the elements of persuasive writing.

When to Use

When client copy feels weak or generic.

beginnerCopywriting

Write a Call to Action

I need a compelling call-to-action button and supporting text for [describe what you want users to do]. The audience is [describe audience]. Give me 3 options ranging from subtle to bold.

What This Teaches

How CTAs work and the psychology of getting users to take action.

When to Use

When creating or improving buttons and action prompts.

intermediateClient Thinking

Explain Like a Client

I need to explain [technical concept] to a client who is not technical. Can you help me write a simple explanation that focuses on the benefit to their business, not the technical details?

What This Teaches

Translating technical work into business value—essential for client relationships.

When to Use

Before any client communication about technical work.

beginnerClient Thinking

Write a Status Update

I need to send the client a status update on this project. Here is what I have done: [list tasks]. Can you help me write a professional update that explains progress, next steps, and any questions I need answered?

What This Teaches

Professional client communication and keeping clients informed.

When to Use

When updating clients on project progress.

intermediateClient Thinking

Handle a Client Request

A client asked for [describe request]. I want to respond professionally and make sure I understand exactly what they need. Can you help me write a response that confirms the requirements and sets clear expectations?

What This Teaches

Requirement gathering and expectation setting.

When to Use

When receiving new work requests from clients.

intermediateBusiness Strategy

Price a Project

A client wants [describe project]. I estimate it will take me [time estimate]. Help me think through how to price this project. What factors should I consider? What would be a fair rate that values my time while being reasonable for the client?

What This Teaches

How to value your work and think about pricing strategically.

When to Use

When quoting new projects or services.

intermediateBusiness Strategy

Identify Upsell Opportunities

I'm doing [current task] for a client. While working on their site, I noticed [observations]. Help me think through: Are there additional services I could offer that would genuinely help their business? How would I propose them professionally?

What This Teaches

How to grow client relationships by providing genuine value.

When to Use

When you notice ways to help a client beyond the current task.

beginnerAI Workflow

Plan My Approach

I need to [describe task]. Before I start, can you help me break this down into clear steps? What should I do first? What could go wrong? What should I test before considering it done?

What This Teaches

Planning work before diving in—reduces mistakes and missed requirements.

When to Use

Before starting any non-trivial task.

beginnerAI Workflow

Write a Commit Message

I just made these changes: [describe changes]. Help me write a clear, professional git commit message that explains what changed and why.

What This Teaches

Good commit hygiene and documentation practices.

When to Use

Before every commit.

beginnerAI Workflow

Organize My Work

I have these tasks to complete: [list tasks]. Help me prioritize them. What should I do first? How should I batch similar work? What is the most efficient order?

What This Teaches

Task prioritization and efficient work organization.

When to Use

When facing multiple tasks and unsure where to start.

beginnerAI Workflow

Learn From What I Did

I just finished [describe task]. Before I move on, can you help me reflect: What did I learn? What would I do differently next time? What skills did this build that I can use on future projects?

What This Teaches

Deliberate learning and continuous improvement mindset.

When to Use

After completing any significant task.

Be Specific

The more context you give Claude, the better the response. Include file names, error messages, and what you've already tried.

Ask Follow-ups

Don't stop at the first response. Ask "why does this work?" or "what could go wrong?" to deepen your understanding.

Verify Everything

Claude is helpful but not perfect. Always test code changes locally before committing, and double-check important facts.