Prompting 101: Talking to AI 🤖

Ever wonder how to get the best results when working with AI in Bolt.new? Let’s make it super simple!

The Basics of Good Prompting

🎯 Be Specific

Instead of saying:

"Make a website"

Try this:

"Create a responsive landing page for a coffee shop with a dark theme, 
using Tailwind CSS. Include a hero section, menu, and contact form."

📝 Provide Context

Instead of:

"Fix this code"

Try this:

"I'm getting a TypeError in my React component when trying to map over 
user data. Here's my current code and the error message..."

Pro Tips for Better Results

1. Break Down Complex Requests

  • Split big tasks into smaller steps
  • Ask for one thing at a time
  • Build upon previous responses

2. Use Clear Formatting

  • Use bullet points for lists
  • Include code blocks with language specification
  • Separate different parts of your request

3. Specify Your Preferences

  • Mention frameworks or libraries you want to use
  • Specify coding style (functional, OOP, etc.)
  • Indicate performance requirements

Common Patterns That Work Well

For Bug Fixing

I'm encountering [specific error] when trying to [action].
Here's my current code:
[code block]
Expected behavior: [description]
Actual behavior: [description]

For New Features

I want to add [feature] to my project.
Tech stack: [list technologies]
Key requirements:
- Requirement 1
- Requirement 2
Must be compatible with: [dependencies/constraints]

For Code Reviews

Please review this code for:
1. Performance optimizations
2. Security concerns
3. Best practices
4. Potential edge cases

[code block]

What to Avoid

❌ Don’t Be Vague

Bad: “Make it better” Good: “Optimize this function for better performance, specifically reducing memory usage”

❌ Don’t Overload

Bad: “Add 10 different features all at once” Good: “Let’s start with implementing the user authentication feature”

❌ Don’t Skip Details

Bad: “It’s not working” Good: “The login form submission is failing with a 400 error when using valid credentials”

Examples of Effective Prompts

1. Setting Up a Project

Help me set up a new Next.js project with:
- TypeScript configuration
- Tailwind CSS
- ESLint + Prettier
- Basic folder structure for a blog
Please include explanations for each configuration choice.

2. Debugging Help

My authentication flow isn't working. Here's the sequence:
1. User clicks login
2. Form submits to /api/auth
3. Getting 401 error

Relevant code:
[auth code block]
[API route code block]

What should I check first and how can I debug this?

3. Code Optimization

Please review this React component for optimization:
[component code]

Focus on:
- Performance
- Re-rendering
- Memory leaks
- Best practices

Suggest specific improvements with examples.

Getting Unstuck

If you’re not getting the results you want:

  1. Rephrase Your Request

    • Be more specific
    • Add missing context
    • Break it down further
  2. Iterate

    • Start simple
    • Build complexity gradually
    • Ask follow-up questions
  3. Provide Examples

    • Show what you’ve tried
    • Include similar solutions
    • Describe your ideal outcome

Remember

  • AI is a tool, not a mind reader
  • Clear communication gets better results
  • It’s okay to iterate and refine your requests
  • The more context you provide, the better the response

Need More Help?

Happy prompting! 🚀