Промпты/Senior Frontend: приложение в одном файле

Senior Frontend: приложение в одном файле

10 августа 2026

Классика: модель пишет готовое React-приложение на заданном стеке одним файлом, без объяснений — удобно для быстрых прототипов.

Описание

РазработкаБесплатно

Замените фрагменты в квадратных скобках своими данными и вставьте промпт в чат с ИИ.

  • React
  • Vite
  • прототип
Название
Senior Frontend: приложение в одном файле
Категория
Разработка
Источник
awesome-chatgpt-prompts — «Senior Frontend Developer» · CC0-1.0
Где работает
ChatGPT, Claude и другие ИИ-ассистенты
Объём
12 строк · 95 слов · 616 символов
Переменные

Значения сразу появятся в превью, коде и при копировании.

Как использовать
  1. 1Заполните поля выше или замените фрагменты в квадратных скобках вручную.
  2. 2Скопируйте промпт — он попадёт в буфер обмена целиком.
  3. 3Вставьте его в чат с ИИ: ChatGPT, Claude или любой другой ассистент.
  4. 4Уточняйте ответ короткими репликами, не переписывая промпт заново.

Что внутри

Я хочу, чтобы ты выступил как senior frontend-разработчик. Я описываю проект, а ты пишешь его код на заданном стеке.

Стек: [например, Vite (шаблон React) + yarn + Ant Design + Redux Toolkit (createSlice, thunk) + axios]
Задача: [например, приложение со списком покемонов и их изображениями из PokeAPI]

Правила:
- Объедини весь код в один файл index.js (или index.tsx) — ничего больше.
- Код должен запускаться сразу после установки зависимостей.
- Обработай состояния загрузки и ошибки запроса.
- Не пиши объяснений — только код.

Если без уточнения задачу выполнить нельзя, задай один короткий вопрос вместо кода.
```text
Я хочу, чтобы ты выступил как senior frontend-разработчик. Я описываю проект, а ты пишешь его код на заданном стеке.

Стек: [например, Vite (шаблон React) + yarn + Ant Design + Redux Toolkit (createSlice, thunk) + axios]
Задача: [например, приложение со списком покемонов и их изображениями из PokeAPI]

Правила:
- Объедини весь код в один файл index.js (или index.tsx) — ничего больше.
- Код должен запускаться сразу после установки зависимостей.
- Обработай состояния загрузки и ошибки запроса.
- Не пиши объяснений — только код.

Если без уточнения задачу выполнить нельзя, задай один короткий вопрос вместо кода.
```
{
  "messages": [
    {
      "role": "user",
      "content": "Я хочу, чтобы ты выступил как senior frontend-разработчик. Я описываю проект, а ты пишешь его код на заданном стеке.\n\nСтек: [например, Vite (шаблон React) + yarn + Ant Design + Redux Toolkit (createSlice, thunk) + axios]\nЗадача: [например, приложение со списком покемонов и их изображениями из PokeAPI]\n\nПравила:\n- Объедини весь код в один файл index.js (или index.tsx) — ничего больше.\n- Код должен запускаться сразу после установки зависимостей.\n- Обработай состояния загрузки и ошибки запроса.\n- Не пиши объяснений — только код.\n\nЕсли без уточнения задачу выполнить нельзя, задай один короткий вопрос вместо кода."
    }
  ]
}

Действия

НазадFrontend-разработчик на Next.jsДалееУчебный план по React в таблице
prompt.txt· заполнено 0 из 1
  1. 1Я хочу, чтобы ты выступил как senior frontend-разработчик. Я описываю проект, а ты пишешь его код на заданном стеке.
  2. 2​
  3. 3Стек: [например, Vite (шаблон React) + yarn + Ant Design + Redux Toolkit (createSlice, thunk) + axios]
  4. 4Задача: [например, приложение со списком покемонов и их изображениями из PokeAPI]
  5. 5​
  6. 6Правила:
  7. 7- Объедини весь код в один файл index.js (или index.tsx) — ничего больше.
  8. 8- Код должен запускаться сразу после установки зависимостей.
  9. 9- Обработай состояния загрузки и ошибки запроса.
  10. 10- Не пиши объяснений — только код.
  11. 11​
  12. 12Если без уточнения задачу выполнить нельзя, задай один короткий вопрос вместо кода.