Configuration

For all environment variable setup, see Environment Variables.

Complete guide to customize your directory platform: branding, categories, pricing, analytics, and optional services.

Setup steps

Once your environment variables are configured:

Generate and apply database schema:
```
bun db:generate
bun db:migrate
```
Start development server:
```
bun dev
```
Your platform will be available at http://localhost:3000
To test the checkout process, be sure that the Stripe CLI is running. If not, run the following:
```
stripe listen --forward-to localhost:3000/api/auth/stripe/webhook
```
At this point, you can start using the platform locally. Try to sign in with Google/GitHub and create a tool. In development mode, you can use the following card on Stripe to test the checkout process:
```
4242 4242 4242 4242
Exp: 01/2030
CVC: 123
```
It's now time to customize your platform - follow the sections below.

Site configuration

All site branding and business logic is centralized in lib/constants/config.ts. Update these values to customize your directory:

Site identity and branding

// lib/constants/config.ts
export const SITE_CONFIG = {
  title: "YourDirectory.tools",
  description: "Find the best tools for your niche",
  tagline: "Your unique value proposition",
  url: "https://yourdomain.com",
  author: "Your Name",
  keywords: ["tools", "directory", "your-niche"],
  email: "contact@yourdomain.com",
  x: "https://x.com/yourusername",
  navigation: {
    categories: CATEGORIES,
  },
};

This configuration powers:

Page titles and meta descriptions (via app/layout.tsx)
Open Graph and Twitter cards
Site navigation and contact information
SEO keywords and author information

Don't forget to also update:

The /about page content in app/(legal)/about/page.tsx
Your logo in app/[slug]/opengraph-image.tsx
The favicon in public/favicon.ico
And the og.png image in /public

Business configuration

Configure your pricing, limits, and advertisement rates in lib/constants/config.ts:

// lib/constants/config.ts

// Monthly prices in USD (automatically converted to cents for Stripe)
const PRICES_MONTHLY = {
  "starter-monthly": 5,    // $5/month - change this
  "plus-monthly": 20,      // $20/month - change this
  "max-monthly": 30,       // $30/month - change this
};

// Yearly prices in USD (automatically converted to cents for Stripe)
const PRICES_YEARLY = {
  "starter-yearly": 50,    // $50/year (save $10) - change this
  "plus-yearly": 200,      // $200/year (save $40) - change this
  "max-yearly": 300,       // $300/year (save $60) - change this
};

// Tool limits per plan - how many tools each plan can submit
const LIMITS_PER_PLAN = {
  Starter: 1,    // 1 tool maximum - change this
  Plus: 8,       // 8 tools maximum - change this
  Max: 12,       // 12 tools maximum - change this
};

// Advertisement daily rates in USD - revenue from promoted tools
const ADVERTISEMENT = {
  All: 5,        // $5/day for promotion on all pages - change this
  Homepage: 4,   // $4/day for homepage-only promotion - change this
  Discount: {
    PerDay: 1,   // 1% discount per day booked in advance - change this
    Max: 30,     // Maximum 30% discount for long bookings - change this
  },
};

What each setting controls:

PRICES_MONTHLY/YEARLY: Your subscription prices. Users pay these amounts to submit tools.
LIMITS_PER_PLAN: Maximum number of tools each plan allows. Starter = basic users, Plus = power users, Max = heavy users.
ADVERTISEMENT.All: Daily rate for tools to appear at the top of ALL category pages (premium visibility).
ADVERTISEMENT.Homepage: Daily rate for tools to appear on the homepage only (maximum visibility).
ADVERTISEMENT.Discount: Incentivizes longer advertisement bookings with progressive discounts.

Important: After creating products in Stripe Dashboard, update the prices in config.ts to match exactly with your Stripe pricing. The system automatically converts USD to cents for Stripe.

Platform customization

Badge customization

Design your badge:
- On your profile page, you will see the badge that every user with at least one tool will have
- Update the badge design using the badge generator here
- Once the design is done, download the SVG (one for dark and one for light mode)
- Put them in the public/badges folder (you can delete the old ones)
- Name the files badge-dark.svg and badge-light.svg
- Refresh the profile page to see the new badge

→ See Badge Generator for complete badge customization guide

Admin account creation

Create your admin account:
- Open database studio in a new terminal: bun db:studio
- Go to: http://local.drizzle.studio
- Find your user in the user table
- Change role from "user" to "admin" and save the change
- You can now visit /admin to access your admin dashboard
- There is also a button in the header of your profile page to access the admin dashboard

Analytics setup (Plausible)

The platform includes privacy-first Plausible Analytics:

Create account on Plausible.io and add your domain

Update domain in app/layout.tsx:

<PlausibleProvider
  domain="yourdomain.com"  // Change this to your domain
  enabled={process.env.NODE_ENV === "production"} // Only enable in production
/>

Analytics features:

Privacy-first (no cookies, GDPR compliant)
Page views and referral sources
Country-level location data
Device and browser analytics

Plausible documentation: docs.plausible.io

Other services

Discord notifications

Get instant revenue notifications by adding your Discord webhook URL to environment variables:

DISCORD_WEBHOOK_URL="https://discord.com/api/webhooks/your-webhook-id/your-webhook-token"

How to create:

Discord > Server Settings > Integrations > Webhooks
Create webhook > Copy URL
Add to your .env file

Notifications include:

New customer signups
New subscription created
Subscription updates
Advertisement purchases

Cloudflare Turnstile (Anti-spam)

Prevent spam submissions by enabling Turnstile:

Create site in Cloudflare Dashboard > Turnstile > Add site

Add keys to environment variables:

NEXT_PUBLIC_TURNSTILE_SITE_KEY="0x4AAAAAAXXXXX"
TURNSTILE_SECRET_KEY="0x4AAAAAAXXXXX"

Turnstile automatically protects:

Tool submission forms
Contact forms
Any form with the <TurnstileCaptcha /> component

Automated cron jobs (Required)

Secure your automation endpoints:

# Generate secure random key
openssl rand -hex 32

# Add to .env
CRON_SECRET="generated-hex-key-from-above"

Automated tasks (configured in vercel.json):

Daily subscription expiration checks (/api/cron/check-expired-subscriptions)
Daily advertisement expiration cleanup (/api/cron/process-expired-advertisements)

Required: Cron jobs are essential for the platform to function properly. They handle subscription expiration and advertisement cleanup automatically. The endpoints are secured with your CRON_SECRET.

Production checklist

Before deploying, verify all configurations:

All services are optional except Database, Auth, and Cron jobs. Start with core features and add revenue services when ready.

Ready to deploy your configured platform? → Deployment