A practical guide on how to use the VibeFast prompts to accelerate your development with AI.

Using the VibeFast AI Co-Pilot is a simple, three-step process. This guide will walk you through how to use the write-unit-tests.md prompt as an example, but the same principle applies to all prompts in the /prompts directory.

The General Workflow

Step 1: Choose Your Prompt

Select the prompt from the /prompts directory that matches the task you want to accomplish. For example, if you want to write unit tests for a component, you would choose write-unit-tests.md.

Step 2: Provide the Context to Your AI

Copy the entire contents of the chosen prompt file. Paste this into your AI chat tool of choice (e.g., ChatGPT, Claude, Cursor). This is the most important step, as it gives the AI the "expert brain" it needs to understand the task within the context of the VibeFast architecture.

Step 3: Provide Your Specific Request

Immediately after pasting the prompt content, add your specific request. This usually involves providing the code you want the AI to work on.

Example: Generating Unit Tests for a Component

Let's say you've created a new button component and you want to write tests for it.

1. Your Component Code:

src/components/ui/my-new-button.tsx

import { Pressable, Text } from 'react-native';

export const MyNewButton = ({ onPress, label, disabled }) => {
  return (
    <Pressable
      onPress={onPress}
      disabled={disabled}
      className={`p-4 ${disabled ? 'bg-gray-400' : 'bg-blue-500'}`}
    >
      <Text className="text-white">{label}</Text>
    </Pressable>
  );
};

2. Your Prompt to the AI:

You would structure your message to the AI like this:

Here are our comprehensive testing guidelines. Please follow them strictly. Now, write unit tests for the following component:

[...paste the entire content of prompts/write-unit-tests.md here...]

[...paste your MyNewButton component code here...]

3. The AI's Output:

The AI, now equipped with the expert testing rules, will generate a high-quality test file that correctly mocks dependencies, uses React Native Testing Library, and covers key cases like user interaction and the disabled state.

src/components/ui/__tests__/my-new-button.test.tsx

import React from 'react';
import { screen, act } from '@testing-library/react-native';
import { setup } from '@/lib/test-utils';
import { MyNewButton } from '../my-new-button';

describe('MyNewButton', () => {
  it('renders correctly with a label', () => {
    setup(<MyNewButton label="Click Me" />);
    expect(screen.getByText('Click Me')).toBeOnTheScreen();
  });

  it('calls onPress when clicked', async () => {
    const mockOnPress = jest.fn();
    const { user } = setup(<MyNewButton label="Submit" onPress={mockOnPress} />);
    await user.press(screen.getByText('Submit'));
    expect(mockOnPress).toHaveBeenCalledTimes(1);
  });

  it('does not call onPress when disabled', async () => {
    const mockOnPress = jest.fn();
    const { user } = setup(<MyNewButton label="Submit" onPress={mockOnPress} disabled={true} />);
    await user.press(screen.getByText('Submit'));
    expect(mockOnPress).not.toHaveBeenCalled();
  });
});

Tip: For the best results, start a new, fresh chat session with your AI for each major task to ensure the context from previous conversations doesn't interfere with the specific rules from the prompt.

You can apply this same "Prompt + Request" pattern with all the files in the /prompts directory to accelerate your development.

This completes the final document in our documentation plan. We have now drafted all the content for all sections.

Using the Prompts