Catch, Inspect & Debug Webhooks — In Real Time
Hook Relay is a developer-first webhook inspection platform. Generate endpoints, verify HMAC-SHA256 signatures, log every request, and debug payloads through a clean dashboard.
- Instant Endpoints — Generate unique webhook URLs per project, ready to receive POST requests in seconds
- HMAC-SHA256 Verification — Verify request signatures with constant-time comparison
- Full Request Logging — Headers, payload, IP, user-agent, response time — all logged and queryable
- JSON Payload Inspector — Formatted JSON view, raw view, and header inspection
- Secret Rotation — One-click secret rotation without downtime
- Password Reset — Token-based reset flow with email support (console for dev, Gmail SMTP for production)
- Multi-User — Isolated webhook namespaces per user with JWT authentication
- Docker-Ready — Full Docker Compose stack with PostgreSQL, Django, React, and Nginx
┌─────────────────────────────────────────────────────────────┐
│ Nginx (Port 80) │
│ Reverse Proxy / Router │
├──────────────────────────┬──────────────────────────────────┤
│ │ │
│ /api/* /webhooks/* │ /* │
│ /admin/* │ │
│ ▼ │ ▼ │
│ ┌───────────────┐ │ ┌──────────────────┐ │
│ │ Django API │ │ │ React Frontend │ │
│ │ Port 8000 │ │ │ Port 3000 │ │
│ │ │ │ │ │ │
│ │ • Auth (JWT) │ │ │ • Dashboard │ │
│ │ • Webhooks │ │ │ • Log Viewer │ │
│ │ • Logging │ │ │ • Auth Pages │ │
│ │ • Admin │ │ │ │ │
│ └───────┬───────┘ │ └──────────────────┘ │
│ │ │ │
│ ▼ │ │
│ ┌───────────────┐ │ │
│ │ PostgreSQL │ │ │
│ │ Port 5432 │ │ │
│ └───────────────┘ │ │
│ │ │
└──────────────────────────┴──────────────────────────────────┘
- Python 3.11 + Django 4.2 — Battle-tested web framework
- Django REST Framework — API layer with serialization, pagination, filtering
- SimpleJWT — Access + refresh token authentication with blacklisting
- PostgreSQL 15 — Production-grade relational database
- Gunicorn — WSGI HTTP server for production
- WhiteNoise — Static file serving
- React 18 + TypeScript — Type-safe component architecture
- Vite — Lightning-fast dev server and build tool
- TailwindCSS — Utility-first CSS with custom design tokens
- React Router 6 — Client-side routing with code splitting ready
- Axios — HTTP client with interceptors for token refresh
- React Hot Toast — Elegant notification system
- Docker + Docker Compose — Containerized development and deployment
- Nginx — Reverse proxy, static file caching, security headers
- AWS Free Tier compatible deployment design
- Docker and Docker Compose (recommended)
- Or: Python 3.11+, Node.js 18+, PostgreSQL 15+
# Clone the repository
git clone https://github.com/aneeshrao/hook-relay-app.git
cd hook-relay-app
# Copy environment file
cp backend/.env.example backend/.env
# Start all services
docker compose up --build
# In another terminal, create a superuser
docker compose exec backend python manage.py createsuperuserThe app will be available at:
- Frontend: http://localhost:3000
- Backend API: http://localhost:8000
- Admin Panel: http://localhost:8000/admin
- Full Stack (via Nginx): http://localhost
# --- Backend ---
cd backend
python -m venv venv
source venv/bin/activate # On Windows: venv\Scripts\activate
pip install -r requirements.txt
# Set up environment
cp .env.example .env
# Edit .env with your database credentials
# Run migrations and start server
python manage.py migrate
python manage.py createsuperuser
python manage.py runserver
# --- Frontend (new terminal) ---
cd frontend
npm install
npm run devFrontend dev server runs at http://localhost:5173 with API proxying to port 8000.
1. Register/Login ──► 2. Create Webhook ──► 3. Get unique URL + secret
│
▼
4. External service sends POST ──► 5. Hook Relay receives request
│
┌────────────────┼────────────────┐
▼ ▼ ▼
6. Verify 7. Extract 8. Log
Signature Headers/Body Everything
│ │ │
└────────────────┼────────────────┘
▼
9. View in Dashboard
# Generate the signature
SECRET="your-webhook-secret"
PAYLOAD='{"event": "payment.success", "amount": 99.99}'
SIGNATURE=$(echo -n "$PAYLOAD" | openssl dgst -sha256 -hmac "$SECRET" | cut -d' ' -f2)
# Send the webhook
curl -X POST https://your-domain/webhooks/{user_id}/{webhook_id}/ \
-H "Content-Type: application/json" \
-H "X-Webhook-Signature: $SIGNATURE" \
-d "$PAYLOAD"{
"status": "received",
"signature_valid": true,
"message": "Webhook received and logged successfully."
}| Method | Endpoint | Description |
|---|---|---|
POST |
/api/auth/register/ |
Create a new account |
POST |
/api/auth/login/ |
Get JWT tokens |
POST |
/api/auth/logout/ |
Blacklist refresh token |
GET |
/api/auth/me/ |
Get current user profile |
PATCH |
/api/auth/me/ |
Update profile |
POST |
/api/auth/change-password/ |
Change password |
POST |
/api/auth/forgot-password/ |
Request password reset |
POST |
/api/auth/reset-password/ |
Reset password with token |
POST |
/api/auth/token/refresh/ |
Refresh access token |
| Method | Endpoint | Description |
|---|---|---|
GET |
/api/webhooks/ |
List all webhooks |
POST |
/api/webhooks/ |
Create webhook |
GET |
/api/webhooks/{id}/ |
Get webhook details |
PATCH |
/api/webhooks/{id}/ |
Update webhook |
DELETE |
/api/webhooks/{id}/ |
Delete webhook |
POST |
/api/webhooks/{id}/rotate-secret/ |
Rotate secret |
GET |
/api/webhooks/{id}/logs/ |
Get webhook logs |
GET |
/api/webhooks/{id}/stats/ |
Get webhook statistics |
| Method | Endpoint | Description |
|---|---|---|
GET |
/api/logs/{id}/ |
Get log detail |
| Method | Endpoint | Description |
|---|---|---|
POST |
/webhooks/{user_id}/{webhook_id}/ |
Receive webhook |
- JWT Authentication with access/refresh token rotation and blacklisting
- HMAC-SHA256 signature verification with constant-time comparison
- Rate Limiting — 100 req/hr anonymous, 1000 req/hr authenticated, 500 req/min webhooks
- Payload Size Validation — Configurable max payload size (default 512KB)
- CORS Configuration — Whitelist-based origin control
- Password Validation — Django's built-in validators (similarity, length, common, numeric)
- Environment Secrets — All sensitive config via environment variables
- Security Headers — X-Frame-Options, X-Content-Type-Options, X-XSS-Protection via Nginx
hook-relay-app/
├── backend/
│ ├── django_project/ # Django settings, URLs, WSGI
│ │ ├── settings.py
│ │ ├── urls.py
│ │ └── wsgi.py
│ ├── apps/
│ │ ├── accounts/ # User model, auth views, JWT
│ │ │ ├── models.py
│ │ │ ├── serializers.py
│ │ │ ├── views.py
│ │ │ ├── urls.py
│ │ │ └── admin.py
│ │ ├── webhooks/ # Webhook CRUD, logging, verification
│ │ │ ├── models.py
│ │ │ ├── serializers.py
│ │ │ ├── views.py
│ │ │ ├── services.py # Public endpoint + signature logic
│ │ │ ├── api_urls.py
│ │ │ ├── public_urls.py
│ │ │ └── admin.py
│ │ └── core/ # Shared utilities
│ ├── Dockerfile
│ ├── requirements.txt
│ └── manage.py
├── frontend/
│ ├── src/
│ │ ├── contexts/ # Auth context provider
│ │ ├── layouts/ # Auth + App layouts
│ │ ├── lib/ # API client, utilities
│ │ ├── pages/
│ │ │ ├── auth/ # Login, Register, Forgot/Reset Password
│ │ │ └── app/ # Dashboard, Webhooks, Logs, Profile
│ │ ├── types/ # TypeScript interfaces
│ │ ├── App.tsx
│ │ └── main.tsx
│ ├── Dockerfile
│ └── package.json
├── nginx/
│ └── nginx.conf
├── docker-compose.yml
├── docs/
│ └── project_info.md
└── README.md
# Run migrations
python manage.py migrate
# Create superuser
python manage.py createsuperuser
# Run development server
python manage.py runserver
# Run with Docker
docker compose exec backend python manage.py <command># Development server
npm run dev
# Production build
npm run build
# Preview production build
npm run preview- JWT Authentication with refresh tokens
- Webhook CRUD with UUID endpoints
- HMAC-SHA256 signature verification
- Full request logging (headers, payload, metadata)
- Dashboard with statistics
- Log inspector with JSON formatter
- Secret rotation
- Docker Compose deployment
- Real-time log streaming (WebSockets)
- Webhook request replay
- Advanced search and filtering
- Webhook analytics charts
- Email notifications on failures
- Team/organization support
- Custom response templates
- Export logs (CSV/JSON)
Contributions are welcome! Please open an issue first to discuss what you'd like to change.
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is licensed under the MIT License. See LICENSE for details.
Built for developers who are tired of debugging webhooks blindly.