next-feedback-template

next-feedback-template is an open-source Next.js 13 starter that turns website visitor feedback into emails sent to your inbox via react.email and Resend. Built on the official shadcn-ui template, it provides a Radix UI-based feedback form styled with Tailwind CSS, complete with dark mode and Lucide icons.

What is next-feedback-template?

next-feedback-template is a minimal Next.js 13 App Directory application that lets you collect customer feedback directly on your website and receive each submission as an email. It uses react.email to compose HTML email templates and Resend to deliver them, so you don't need a separate backend or customer-support tool. The project is distributed under the MIT license and requires only two commands to get running: npm i and npm run dev.

What makes next-feedback-template stand out?

• react.email and Resend integration — Feedback messages are rendered as react.email templates and sent through Resend's API, giving you a complete email delivery pipeline.
• Next.js 13 App Directory — Structured around the modern App Router with server components, following the official shadcn-ui starter.
• Radix UI Primitives — Accessible, unstyled components for the feedback dialog and form fields, so you can fully customize the look.
• Tailwind CSS setup — Utility-first styling with automated class sorting, merging, and linting configured out of the box.
• Lucide icons — Consistent, lightweight icons for the interface.
• Dark mode — Theme switching built with next-themes, respecting system preferences.
• MIT License — Free to use in personal and commercial projects.

Who should use next-feedback-template?

• Next.js developers who need a working feedback widget to copy into an existing App Directory project without building the form and email logic from scratch.
• SaaS founders and indie hackers who want a lightweight way to collect feature requests and bug reports directly from their product page and receive them in their regular email inbox.
• Agency developers building client websites that need a self-hosted feedback mechanism that can be styled with Tailwind to match the brand.

What can you do with next-feedback-template?

• Embed a feedback form on a landing page so visitors can send comments or bug reports straight to your team's email.
• Customize the email templates using react.email to format incoming feedback exactly how you want.
• Study a reference implementation of the shadcn-ui stack, showing how Radix UI, Tailwind CSS, and next-themes integrate in a real project.

How does next-feedback-template work?

The template is installed by running npm i and then started with npm run dev. It serves a Next.js application where visitors submit feedback through the Radix UI-based form; the submission is converted into a styled email by react.email and sent to you via Resend. The specific API route and environment variables are part of the starter code, though they are not documented in the README beyond the feature list.

FAQ

Is next-feedback-template free?

Yes, the project is licensed under the MIT license, which permits free use, modification, and distribution, including in commercial projects.

What does next-feedback-template do?

It provides a feedback form for your website that emails submissions to you. Instead of relying on a third-party widget service, the template uses react.email and Resend to send the feedback directly from your Next.js app.

What tech stack does it use?

It uses Next.js 13 with the App Directory, Radix UI primitives, Tailwind CSS, Lucide icons, next-themes for dark mode, react.email for email templates, and Resend for email delivery.

How do I install it?

Clone or download the repository, run npm i to install dependencies, and then npm run dev to start the development server. No additional build steps are listed in the README.