Customer feedback

I currently have support for the following Customer Feedback tools:

• Canny

Canny

Canny allows you to embed a specific board on your website, allowing your users to submit feedback and upvote existing feedback without having to leave your app.

This can be a great way to gather feedback from your users and understand what features they would like to see implemented in the future.

Sign up for an account on Canny.

Environment variables

Once you've created a new app on Canny, go ahead and grab your App ID and add it to your environment variables.

You will also need the Board Token for the board you want to display.

.env
NEXT_PUBLIC_CANNY_APP_ID="your app id"
NEXT_PUBLIC_CANNY_BOARD_TOKEN="your board token"

Add the Canny script

In order to enable the feedback widget, we need to add a small piece of code to our providers.tsx file.

Ensure you add the code inside the <SessionProvider> component, above the {children} prop.

src/app/providers.tsx
import { CannySDKScript } from "@/lib/canny";

// ... 

<SessionProvider>
  <Toaster
    richColors
    position="bottom-right"
    expand={false}
    theme={theme === "dark" ? "light" : "dark"}
  />
  <CannySDKScript />
  {children}
</SessionProvider>

Enable feedback page

Your feedback widget will now automatically be enabled and able to be accessed by your users at the following url:

https://yourwebsite.com/feedback

The setup script for Canny can be found in the @/lib/canny.tsx file.

More information on how to set up Canny can be found in their official developer documentation.