Quick Start
Get started with Feedhog in under 5 minutes. Collect user feedback from any website or application.
Quick Start
Feedhog helps you collect, organize, and act on customer feedback. This guide will get you up and running quickly.
Installation Options
Choose the integration method that works best for your project:
| Method | Best For | Effort |
|---|---|---|
| Widget Script Tag | Any website, no build step | Easiest |
| Widget React Component | React/Next.js apps | Easy |
| JavaScript SDK | Custom UI, full control | Medium |
| REST API | Server-to-server, any language | Flexible |
Option 1: Widget (Recommended)
The widget provides a complete feedback UI with minimal setup.
Script Tag (Any Website)
Add this script before the closing </body> tag:
<script>
window.feedhogSettings = {
apiKey: 'fhpk_your_public_key',
position: 'bottom-right',
primaryColor: '#3b82f6',
user: {
externalId: 'user-123',
email: 'user@example.com',
name: 'John Doe'
}
};
</script>
<script async src="https://cdn.feedhog.com/widget.js"></script>React/Next.js Component
npm install @feedhog/widgetimport { FeedhogWidget } from '@feedhog/widget/react';
function App() {
return (
<FeedhogWidget
apiKey="fhpk_your_public_key"
position="bottom-right"
user={{
externalId: currentUser.id,
email: currentUser.email,
name: currentUser.name
}}
/>
);
}Option 2: JavaScript SDK
For custom UI or programmatic feedback submission:
npm install @feedhog/jsimport Feedhog from '@feedhog/js';
const feedhog = new Feedhog({ apiKey: 'fhpk_your_public_key' });
// Identify the user
await feedhog.identify({
externalId: 'user-123',
email: 'user@example.com',
name: 'John Doe'
});
// Submit feedback
const feedback = await feedhog.submit({
title: 'Add dark mode',
description: 'Would love a dark theme option',
type: 'idea'
});
console.log('Feedback submitted:', feedback.id);Option 3: REST API
For server-side integrations or any programming language:
curl -X POST https://feedhog.com/api/v1/feedback \
-H "Content-Type: application/json" \
-H "x-api-key: fhpk_your_public_key" \
-d '{
"title": "Add dark mode",
"description": "Would love a dark theme option",
"type": "idea",
"endUser": {
"externalId": "user-123",
"email": "user@example.com",
"name": "John Doe"
}
}'Getting Your API Key
- Sign in to your Feedhog dashboard
- Navigate to your project settings
- Copy your Public API Key (starts with
fhpk_)
The public key is safe to use in client-side code. It can only submit feedback and read public data.
Next Steps
- SDK Reference - Full SDK documentation with all methods
- Widget Customization - Theme and styling options
- REST API Reference - Complete API endpoint documentation
- AI Reference (llms.mdx) - Complete reference for AI assistants