在 CodeStash 中调查 AI 对 Formbricks 的满意度

介绍

所以，我一直在开发 CodeStash，这是一个用于共享和讨论代码片段的平台，有点像 Reddit 和 Stack Overflow 的结合体。最酷的部分？有一个内置的人工智能可以解释代码片段，由 Google Gemini 提供支持。无论是一些粗糙的 JavaScript 还是 Python 代码，CodeStash 都可以让用户按需请求 AI 解释。但是……人工智能的解释可能有点随意。有些用户可能会发现这个回复非常有帮助，而其他用户呢？没那么多。这就是 Formbricks 发挥作用的地方。

在这篇文章中，我将向您展示如何添加 Formbricks 在用户获得 AI 答案后对他们进行调查，检查他们是否认为它有用。如果您对应用内反馈感到好奇，或者只是想了解 Formbricks 如何融入您的项目，请留下来！

为什么要费心进行调查？

人工智能令人印象深刻，但让我们面对现实吧——有时它没有达到目标。通过直接询问用户解释是否有帮助，我得到了诚实的、即时的反馈，我可以用它来微调 CodeStash。 Formbricks 使得将这些快速、简单的调查直接添加到应用程序中变得非常简单。双赢。

将 Formbricks 添加到 CodeStash（带有 Next.js）

添加 Formbricks 非常简单，设置时间不到 10 分钟。因此，如果您在想，“我没有时间添加所有这些调查内容”，请相信我，它比您想象的要快。详细介绍如下：

第 1 步：创建 Formbricks 帐户

按照本快速入门指南中的步骤开始使用 Formbricks。

第2步：安装Formbricks

您首先需要 Formbricks 软件包。运行此命令来安装它，然后按照以下步骤操作：

npm install @formbricks/js zod

现在，创建一个 app/formbricks.tsx 文件

"use client";

import { usePathname, useSearchParams } from "next/navigation";
import { useEffect } from "react";
import formbricks from "@formbricks/js";

export default function FormbricksProvider() {
  const pathname = usePathname();
  const searchParams = useSearchParams();

  useEffect(() => {
    formbricks.init({
      environmentId: "<environment-id>",
      apiHost: "<api-host>",
      userId: "<user-id>", //optional
    });
  }, []);

  useEffect(() => {
    formbricks?.registerRouteChange();
  }, [pathname, searchParams]);

  return null;
}
</user-id></api-host></environment-id>

现在，更新您的 app/layout.tsx 文件。

// other imports
import FormbricksProvider from "./formbricks";

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    
      <formbricksprovider></formbricksprovider>
      {children}
    
  );
}

第 3 步：嵌入调查

人工智能解释完成后，会弹出一项调查，询问用户是否喜欢它。以下是如何将调查组件嵌入到响应中。

在您的 Formbricks 帐户中，创建一个新调查，并在设置下的调查触发器中添加带有键“ai_answer”的代码触发器。

现在我们可以在代码中的任何位置使用 formbricks.track("ai_answer") 方法以编程方式触发调查。

例如...

import formbricks from "@formbricks/js";
import axios from "axios";

await axios
  .get("/ai/explain")
  .then((res) => {
      formbricks.track("ai_answer");
});

第 4 步：定制调查问题

在 Formbricks 仪表板中，调整调查以适合您正在寻找的内容。我带着这样的问题去：

“这个解释有帮助吗？” （是，否）
“我们如何改进人工智能的解释？” （可选）

我让调查简短明了，这样用户就不会因为调查而分心。

最好的部分？您可以将调查设置为每隔一段时间出现一次，这样您就不会在用户每次要求解释时向他们发送垃圾邮件。

截图

查看实际反馈

一旦回复开始滚滚而来，Formbricks 就会为您提供完整整洁的数据。现在我可以看到什么是有效的，什么是令人困惑的，以及什么需要一两个调整。

总结一下

将 Formbricks 添加到 CodeStash 可以轻松捕获诚实的反馈，而不会中断用户体验。因此，如果您在构建时考虑到了用户反馈，请尝试一下 Formbricks！

感谢您的阅读，如果您和我一样热衷于这些工具，请不要忘记为 Formbricks 的 GitHub 存储库加注星标 ⭐——如果您喜欢 CodeStash，也请给它加注星号！

参考

1. Formbricks 文档
2. Next.js 文档

以上是在 CodeStash 中调查 AI 对 Formbricks 的满意度的详细内容。更多信息请关注PHP中文网其他相关文章！