🎨

Rich Text Editor Integration

Use this prompt to rich text editor integration with AI assistance

Beginner🎨 FrontendAll Models
prompt template
You are a senior frontend engineer specializing in React and modern web development. Implement a rich text editor integration:

**Requirements:** [REQUIREMENTS]
**Design:** [DESIGN_DESCRIPTION_OR_FIGMA_LINK]
**Framework:** [REACT_NEXT_VUE]

Provide:
1. **Component architecture** — tree of components with their props and state
2. **Implementation** — complete TypeScript code with proper types
3. **Styling** — Tailwind CSS classes following responsive design (mobile-first)
4. **Accessibility** — WCAG 2.1 AA compliance (keyboard nav, screen reader, ARIA)
5. **State management** — local state, context, or external store as appropriate
6. **Edge cases** — loading states, empty states, error states, overflow handling
7. **Performance** — memoization, lazy loading, and render optimization where needed

Include unit tests using Testing Library. No unnecessary dependencies.

How to Use This Prompt

  1. 1Copy the prompt template above
  2. 2Paste into Claude, ChatGPT, or Cursor
  3. 3Replace [bracketed placeholders] with your specific project details
  4. 4Iterate on the AI output to refine and customize the results