Guide to Prompting

Start building better apps using the power of AI.

Building Modern Applications

Building apps used to require deep technical knowledge and months of development time. With chat.mui.com and modern AI tools, anyone can create full-stack applications. Here's how.

Think of prompts as conversations with an expert developer. The better you explain what you want, the better results you'll get. This guide shows you how.

Starting New Projects

Use this template to begin:

I need a [type] application with:

Tech Stack:
- Frontend: React with TypeScript
- Styling: Tailwind CSS
- Auth: Firebase
- Database: [choice]

Core Features:
1. User authentication
2. [Main feature]
3. [Secondary features]

Start with the main page containing: [Detailed page requirements]

Core Prompting Strategies

Start with the Big Picture:

• Begin with your end goal and work backwards
• Let the MUI Chat interpret your vision before diving into specifics
• Be intentionally vague sometimes - MUI Chat often surprises you with better solutions

Example:

I want to build a marketplace app where:
- Users list items for sale
- Buyers browse and purchase
- Sellers track their sales
[other stuff you want]

Sometimes, be intentionally vague to let the MUI Chat surprise you with creative solutions.

You might get something even better than what you imagined.

Break Down into Pieces

Instead of building everything at once, request specific parts:

1. First, the main page
2. Then, the listing form
3. Next, the search feature
4. Finally, user profiles

Pro Tips:

• Break large files into logical components (header, main content, sidebar)
• For critical changes, use "Do not touch anything else, focus only on this task"
• When debugging gets stuck, use "Let's take a step back" to reset
• Use right-click on a file item to lock or unlock the file to prevent the MUI Chat from editing this file.

Design and Component Strategies

Adapting Designs You Love

Found a design you love? Here's how to use it:

1. Find and copy component code (or screenshot)
2. Show it to MUI Chat:

Make my navigation menu look like this style: [paste component code/screenshot]
Keep the same visual style but change it to include these menu items:
- Home
- Products
- About Us"

Happy building :)