N8N Logger

N8N Logger is an Expo + Supabase app for collecting n8n workflow error events in one dashboard. Each user gets a unique webhook URL, connects it to an n8n Error Trigger workflow, and then monitors recent errors, workflow folders, execution details, stack traces, and optional push notifications.

Features

• Expo app for web, Android, and iOS.
• Supabase Auth with anonymous guest access and email/password accounts.
• Per-user webhook IDs so each user has a private n8n logging endpoint.
• Supabase Edge Function that accepts n8n error payloads.
• Realtime dashboard updates for new errors.
• Workflow grouping, recent error history, and error detail pages.
• Optional Expo push notifications on native builds.
• SQL migration included for public self-hosted setup.

Screenshots

Tech Stack

• Expo SDK 54
• React Native / React Native Web
• Expo Router
• Supabase Auth, Postgres, Realtime, and Edge Functions
• Zustand
• date-fns

Prerequisites

• Node.js 20 or newer
• npm
• A Supabase cloud project
• Supabase CLI access through npx supabase
• Optional: Expo account and EAS CLI for native production builds

Quick Start

Install dependencies:

npm install

Create a local environment file:

cp .env.example .env.local

Fill in your Supabase project values:

EXPO_PUBLIC_SUPABASE_URL=https://your-project-ref.supabase.co
EXPO_PUBLIC_SUPABASE_ANON_KEY=your-public-anon-key

Start the web app:

npm run web

If another Expo project already owns port 8081, use a clean port:

npx expo start --web --port 8083

Supabase Setup

Create a new Supabase project, then enable these Auth settings in the Supabase dashboard:

• Authentication -> Providers -> Anonymous sign-ins: enabled
• Authentication -> Providers -> Email: enabled
• Authentication -> URL Configuration: set your production site URL when deploying

Link the local project to Supabase:

npx supabase login
npx supabase link --project-ref your-project-ref

Apply the database migration:

npx supabase db push

The migration creates:

• public.profiles
• public.errors
• row-level security policies
• auth triggers for profile creation and anonymous account upgrades
• indexes for workflow/error queries
• realtime publication for errors

Deploy the Edge Function:

npx supabase functions deploy webhook --no-verify-jwt

The function must be public because n8n posts directly to it without a Supabase user JWT. Access is still scoped by each user's generated webhook_id, but webhook URLs should be treated like private URLs.

Environment Variables

Only public Expo variables belong in .env.local:

EXPO_PUBLIC_SUPABASE_URL=https://your-project-ref.supabase.co
EXPO_PUBLIC_SUPABASE_ANON_KEY=your-public-anon-key

Do not commit:

• Supabase service-role keys
• Supabase personal access tokens
• .env.local
• local AI-agent files such as .gemini/, .claude/, .cursor/, or AGENTS.md

Connect n8n

1. Run the app and sign in or start as a guest.
2. Open the Setup tab.
3. Copy your webhook URL.
4. In n8n, create a workflow with an Error Trigger node.
5. Add an HTTP Request node.
6. POST JSON to the copied webhook URL.

Use this body expression in the HTTP Request node:

={{ JSON.stringify({
  workflow: {
    id: $json.workflow.id,
    name: $json.workflow.name,
  },
  execution: {
    id: $json.execution.id,
    mode: $json.execution.mode,
    url: $json.execution.url,
    lastNodeExecuted: $json.execution.lastNodeExecuted,
    error: {
      name: $json.execution.error.name,
      message: $json.execution.error.message,
      stack: $json.execution.error.stack,
      level: $json.execution.error.level,
      timestamp: new Date($json.execution.error.timestamp).toISOString(),
    },
  },
}) }}

Set the request content type to application/json.

Verify the Webhook

Use the included PowerShell script:

.\verify_webhook.ps1

Or send a minimal test payload:

curl -X POST "https://your-project-ref.supabase.co/functions/v1/webhook/your-webhook-id" \
  -H "Content-Type: application/json" \
  -d '[{
    "workflow": { "id": "demo-workflow", "name": "Demo Workflow" },
    "execution": {
      "id": "demo-execution-1",
      "url": "https://n8n.example.com/execution/1",
      "mode": "manual",
      "lastNodeExecuted": "HTTP Request",
      "error": {
        "name": "DemoError",
        "message": "This is a test error from n8n.",
        "level": "error",
        "timestamp": "2026-01-01T00:00:00.000Z",
        "stack": "Error: This is a test error"
      }
    }
  }]'

After the request succeeds, the dashboard should update with the new error.

Development Scripts

npm run web        # Start Expo for web
npm run start      # Start Expo dev server
npm run android    # Run Android development build
npm run ios        # Run iOS development build
npm run build      # Export static web build
npm run lint       # Run Expo lint
npm run test:e2e   # Run Playwright tests

Native Builds and Push Notifications

Push notifications require a real Expo/EAS project ID on native builds. This public template intentionally does not include a personal EAS owner or project ID.

To enable push notifications:

1. Create or log in to an Expo account.

2. Configure EAS for your fork:

   npx eas init

3. Confirm extra.eas.projectId exists in app.json.

4. Build a development or production app with EAS.

5. Test push notifications on a physical device.

Expo Go on recent SDKs may not support all push notification behavior. Use a development build for reliable testing.

Web Deployment

Build the static web app:

npm run build

The vercel.json file is configured for Expo static output in dist and includes rewrites for dynamic error/workflow routes.

Set these environment variables in your hosting provider:

EXPO_PUBLIC_SUPABASE_URL
EXPO_PUBLIC_SUPABASE_ANON_KEY

Security Notes

• The anon key is public by design, but the service-role key is secret.
• Keep webhook URLs private. Anyone with a user's webhook URL can submit log events for that user.
• The Edge Function uses SUPABASE_SERVICE_ROLE_KEY server-side so it can insert errors while RLS stays enabled for clients.
• Never commit .env.local, Supabase service-role keys, personal access tokens, or local agent settings.
• If a key is ever committed or pasted into an untrusted place, rotate it in Supabase.

Project Structure

app/                         Expo Router screens
components/                  Shared native/web UI components
components/web/              Desktop web dashboard components
lib/                         Supabase, auth, storage, notification helpers
store/                       Zustand app store and selectors
supabase/functions/webhook/  Public n8n webhook Edge Function
supabase/migrations/         Reproducible database schema
docs/screenshots/            README screenshots

License

MIT. See LICENSE.