Quickstart

npx create-notifykit-app my-app
cd my-app
cp .env.example .env.local
node -e "console.log(require('crypto').randomBytes(32).toString('hex'))"
# paste the output as NOTIFYKIT_SECRET in .env.local
npm install
npm run dev

my-app/
├── app/
│   ├── api/
│   │   └── notifykit/
│   │       └── [...notifykit]/
│   │           └── route.ts        ← Handler: auth + all REST endpoints
│   ├── layout.tsx                  ← Wraps app in <NotifyKitProvider>
│   ├── page.tsx                    ← Demo page with "Send test" button
│   └── settings/
│       └── notifications/
│           └── page.tsx            ← Preferences UI (channel toggles)
├── components/
│   └── inbox.tsx                   ← Notification bell + item list
├── lib/
│   ├── notifykit.ts                ← START HERE: definitions + config
│   └── auth.ts                     ← identify() wiring (stub in scaffold)
├── .env.example
├── .env.local                      ← Your NOTIFYKIT_SECRET
└── package.json

import { notify } from "@/lib/notifykit"

await notify.upsertRecipient({
  id: user.id,
  email: user.email,
  name: user.name,
})

const result = await notify.send({
  recipientId: user.id,
  notificationId: "welcome",
  payload: { name: user.name },
})

console.log(result.inboxItems) // inbox row created
console.log(result.deliveries) // email delivery record

"use client"
import { useInbox, useUnreadCount } from "@notifykitjs/react"

function NotificationBell() {
  const { unreadCount } = useUnreadCount()
  const { items, markAsRead, archive } = useInbox()

  return (
    <div>
      <button>
        🔔 {unreadCount > 0 && <span>{unreadCount}</span>}
      </button>

      <ul>
        {items.map((item) => (
          <li key={item.id} style={{ opacity: item.readAt ? 0.6 : 1 }}>
            <strong>{item.title}</strong>
            <p>{item.body}</p>
            {!item.readAt && (
              <button onClick={() => markAsRead(item.id)}>Mark read</button>
            )}
            <button onClick={() => archive(item.id)}>Archive</button>
          </li>
        ))}
      </ul>
    </div>
  )
}

// lib/notifykit.ts — add below existing definitions:
export const taskAssigned = notification({
  id: "task_assigned",
  payload: {
    assignerName: "string",
    taskTitle: "string",
    taskUrl: "string",
  },
  channels: [
    inbox({
      title: "{{assignerName}} assigned you a task",
      body: "{{taskTitle}}",
      actionUrl: "{{taskUrl}}",
    }),
    email({
      subject: "New task: {{taskTitle}}",
      body: "{{assignerName}} assigned you '{{taskTitle}}'.\n\nOpen it: {{taskUrl}}\n\nUnsubscribe: {{_unsubscribeUrl}}",
    }),
  ],
})

// Register it:
export const notify = createNotifyKit({
  notifications: [commentMentioned, taskAssigned] as const,
  //                                 ^^^^^^^^^^^ add here
  ...
})

// Anywhere on the server — send it:
import { notify } from "@/lib/notifykit"

await notify.send({
  recipientId: assignee.id,
  notificationId: "task_assigned",
  //              ^^^^^^^^^^^^^^^ autocomplete shows your registered IDs
  payload: {
    assignerName: currentUser.name,
    taskTitle: "Fix auth bug",
    taskUrl: "/tasks/42",
  },
})
// TypeScript error if you misspell a field or miss one

// BEFORE (dev — in-memory, fake email):
import {
  createNotifyKit, memoryAdapter, fakeEmailProvider, channel, notification,
} from "@notifykitjs/core"

export const notify = createNotifyKit({
  notifications: [commentMentioned] as const,
  database: memoryAdapter(),
  providers: { email: fakeEmailProvider() },
  unsubscribe: { secret: process.env.NOTIFYKIT_SECRET!, baseUrl: "http://localhost:3000/api/notifykit" },
})

// AFTER (production — Drizzle + Resend):
import { createNotifyKit, channel, notification } from "@notifykitjs/core"
import { drizzlePostgresAdapter } from "@notifykitjs/drizzle"
import { resendProvider } from "@notifykitjs/resend"
import { db } from "@/lib/db"

export const notify = createNotifyKit({
  notifications: [commentMentioned] as const,
  database: drizzlePostgresAdapter(db),
  providers: { email: resendProvider({ apiKey: process.env.RESEND_API_KEY!, from: "notifications@yourapp.com" }) },
  unsubscribe: { secret: process.env.NOTIFYKIT_SECRET!, baseUrl: "https://yourapp.com/api/notifykit" },
})