Skip to main content
Tips for writing better prompts
When building with CodinIT.dev, the quality of your results will often depend less on how well you know code and more on how clearly and effectively you can express your ideas through prompts. Learning to prompt well is like learning a new language: the better you get at it, the more powerful and precise your builds will become. This article will help you understand how to approach prompting so you can unlock the full potential of your projects.

​
Plan your app, and your first prompt

When you start with a clear, well-structured prompt, you set yourself up for success. Think of your prompt as a blueprint. The clearer your blueprint, the smoother the build process will be and the less likely you’ll need to rework things down the line. Not sure where to begin? Our guide on Planning your app walks you through practical ways to organize your ideas and start with a powerful first prompt.

​
Automatically improve your prompt

CodinIT.dev has a built-in feature to help you create better prompts: prompting tools
  1. Write your prompt in the chatbox.
  2. In the bottom-left corner of the chatbox, click the plus icon, then click Enhance prompt.
  3. CodinIT.dev generates a recommended prompt, which you can then edit.

​
Comparing original and enhanced prompt results

The image below compares two websites created with the same prompt. The version on the right was built with a simple prompt, while the version on the left was enhanced to produce a more engaging homepage and additional pages. Prompt comparison

​
Prompting quick tips

  • Start with the application architecture, including your choice of tools, frameworks, and so on.
  • Clear context regularly, so long as you’re sure CodinIT.dev doesn’t need to remember anything short-term.
  • Add individual components and features, one by one.
  • Add in details in each component with small, specific prompts. Avoid overwhelming the LLM with too many instructions and requirements at once.
  • Be explicit about what should and shouldn’t change. You can tell CodinIT.dev to change or not change specific files. When possible, refer to specific elements, classes, or functions to guide CodinIT.dev to the exact place where you want the changes made.
  • Don’t expect the LLM to have common sense.

​
Guide CodinIT.dev’s focus

You can direct CodinIT.dev to focus on specific files or avoid changing certain parts of your project: Tell CodinIT.dev what to change:
  • “Update the button styling in components/Button.tsx”
  • “Add a new function to utils/helpers.js”
  • “Modify only the header component”
Tell CodinIT.dev what NOT to change:
  • “Don’t modify the authentication logic”
  • “Keep the existing API routes unchanged”
  • “Update the styling but don’t touch the component logic”
Being specific about files, functions, or components helps CodinIT.dev make precise changes without affecting unrelated parts of your project.

​
Troubleshooting prompting

If CodinIT.dev doesn’t respond exactly as you expect, try these steps to work through common issues.

​
CodinIT.dev didn’t complete everything you asked for

Break your request into smaller parts. Ask CodinIT.dev to make one change at a time.
  1. Make one change.
  2. Check that the change works.
  3. Move on to the next update or feature.

​
CodinIT.dev forgets what you told it earlier in the same chat

CodinIT.dev’s ability to remember your chat history isn’t infinite. A way to preserve information while keeping the chat history window small is to ask CodinIT.dev to summarize your conversations far, then reset your chat history by duplicating your project.

​
Customize the project and system prompts

Project and system prompts are extra instructions sent to CodinIT.dev. They tell it how to behave and provide helpful context. You can use them to guide CodinIT.dev’s tone, focus, or behavior every time it responds. Project versus system prompts:
  • The project prompt is specific to your current project.
  • The system prompt applies to every project.
To update project and system knowledge, follow these steps:
  1. Click the gear icon in the top center of your screen, then click All project settings.
  2. Click one of the two Knowledge options. (Project-specific or system.)
    To update a specific project’s Project knowledge, you must have that project open, and CodinIT.dev must not be in the process of building.
  3. Update the Project Prompt or Global System Prompt.
  4. Click Save prompt. CodinIT.dev will confirm whether the prompt updated successfully. 
For all designs I ask you to make, have them be beautiful, not cookie cutter. Make webpages that are fully featured and worthy for production.

By default, this template supports JSX syntax with Tailwind CSS classes, the shadcn/ui library, React hooks, and Lucide React for icons. Do not install other packages for UI themes, icons, etc unless absolutely necessary or I request them.

Use icons from lucide-react for logos.

Use stock photos from unsplash where appropriate.

​
Tips for the project or system prompts

  • Include instructions to CodinIT.dev to only change relevant code.