{"product_id":"chatbot-builder-react","title":"Skill для создания чат-ботов на React","description":"\u003cp\u003eБольшинство учебных материалов по чат-ботам на React заканчиваются демонстрацией. Ответ появляется целиком через восемь секунд, вся переписка отправляется модели заново при каждом сообщении, а ключ хранится в переменной NEXT_PUBLIC_, которую Next напрямую встраивает в браузерный бандл. На скриншоте всё выглядит нормально, но при реальном использовании проблемы начинаются уже в первую неделю.\u003c\/p\u003e\u003cp\u003eЭто руководство по созданию, а не системный prompt. Вы добавляете файл в проект, открываете его в Claude Code или Cursor, и он вместе с вами прорабатывает архитектуру: потоковую передачу с помощью читателя Fetch ReadableStream, AbortController, подключённый к остановке, оптимистичное сообщение пользователя с добавлением к нему токенов, список, который не перерисовывает каждое сообщение при каждом токене, автопрокрутку, которая перестаёт мешать читателю, прокрутившему страницу вверх, Markdown и блоки кода, ключ за обработчиком маршрута, историю в localStorage, а затем в настоящем бэкенде, и ограничение количества токенов на случай, когда переписка станет длинной.\u003c\/p\u003e\u003cp\u003eВы покупаете его один раз и сохраняете навсегда. Никакой подписки, зависимостей времени выполнения и ограничений, мешающих использовать его в следующем проекте или редактировать по мере развития вашей кодовой базы.\u003c\/p\u003e","brand":"KissMySkills","offers":[{"title":"Default Title","offer_id":58693470486792,"sku":null,"price":14.99,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/1036\/1444\/7880\/files\/chatbot-builder-react-1.png?v=1789397346","url":"https:\/\/kissmyskills.com\/ru\/products\/chatbot-builder-react","provider":"KissMySkills","version":"1.0","type":"link"}