Prompting guide

The art of prompting
with Claude Code

Master the art of communicating with AI. A good prompt makes the difference between a generic answer and a result perfectly tailored to your needs.

Discover the fundamentals View templates

Fundamentals

The 5 principles of good prompting

These principles are the foundation of every effective interaction with Claude Code. Master them and you will get 10x better results.

Principle 1

Be specific

Provide context and clear constraints. The more precise your prompt, the more relevant the response.

exemple-principe-1.mdmarkdown

# Vague
"Make me a form"

# Specific
"Create a contact form in React with TypeScript.
Fields: name (required), email (required, valid), message (required, min 20 chars).
Use react-hook-form with Zod validation.
Style with Tailwind CSS, responsive mobile-first.
Show a confirmation toast after submission."

Principle 2

Define a role

Give Claude an identity to frame its responses. The role influences the level of detail, vocabulary and approach.

exemple-principe-2.mdmarkdown

"You are a senior software architect specializing in React and Next.js.
You prioritize maintainability, performance and best practices.
You comment your code in English and explain each architectural decision."

Principle 3

Specify the expected format

Clearly indicate the desired response structure: code, list, table, JSON, markdown, etc.

exemple-principe-3.mdmarkdown

"Generate the response in the following format:
1. A summary in 2-3 sentences
2. The complete code with inline comments
3. A table of required dependencies (name | version | usage)
4. Step-by-step installation instructions"

Principle 4

Give examples (few-shot)

Show Claude what you expect with concrete examples. This is the most powerful technique for getting the exact format you want.

exemple-principe-4.mdmarkdown

"Generate variable names following this pattern:

Example 1: logged in user → isUserLoggedIn
Example 2: number of products in cart → cartItemCount
Example 3: last update date → lastUpdatedAt

Now generate for:
- form being submitted
- email validation error
- filtered orders list"

Principle 5

Iterate and refine

Prompting is a dialogue. Progressively refine your requests based on the responses you get.

exemple-principe-5.mdmarkdown

# Iteration 1
"Create a Button component"

# Iteration 2
"Add variants: primary, secondary, ghost and danger"

# Iteration 3
"Add icon support on left and right,
a loading state with a spinner, and the disabled prop"

# Iteration 4
"Add unit tests with Testing Library
and Storybook stories for each variant"

The golden rule

Imagine you are delegating a task to a brilliant colleague who knows nothing about your project. What would you tell them so they succeed on the first try? That is exactly what you should tell Claude.

Templates

Ready-to-use prompts

Copy, adapt and use these templates for your projects. Each template follows the 5 principles and has been optimized for the best results.

Web development

To create components, pages or complete web features.

template-web-dev.txtmarkdown

You are a senior React/Next.js/TypeScript developer.

Create a React component that [COMPONENT DESCRIPTION].

Technical context:
- Framework: Next.js 14 (App Router)
- Language: TypeScript (strict mode)
- Styling: Tailwind CSS
- State management: [zustand / React Context / none]

Functional specifications:
- [Feature 1]
- [Feature 2]
- [Feature 3]

Constraints:
- Responsive mobile-first
- Accessible (ARIA, focus management)
- Performance optimized (memo, lazy loading if needed)
- Error handling and loading states

Generate the complete code with:
1. The main component
2. TypeScript types/interfaces
3. A usage example
4. Unit tests (Vitest + Testing Library)

How to customize