Getting Started with PageMon SDK

pagemon-sdk is a lightweight API/network monitoring & alert SDK that automatically tracks API calls, detects slow requests, and monitors network failures with smart throttling and instant alerts.

View the SDK on npm ↗

Installation

Install the SDK via npm:

Code
npm install pagemon-sdk

Step 1: Create Your Project

Log in to PageMon and create a new project.
Add webhook URLs for Discord, slack, or email notifications. You can update these integrations later from your project settings.

Step 2: Get Your App ID

After creating your project, copy your unique App ID from the dashboard. This ID connects your application to PageMon.

Step 3: Network Monitoring Setup

Add pagemon() at the top of any file you want to monitor for network calls:

Code
import { pagemon } from 'pagemon-sdk';

// Place this at the very top of your file
pagemon('YOUR_APP_ID');

// Your component code...
const LoginComponent = async () => {
  // All fetch calls in this file will be automatically monitored
  const response = await fetch('https://api.example.com/login');
  return response;
};

Example Usage in Different Files

login.tsx - Monitor authentication API calls:

Code
import { pagemon } from 'pagemon-sdk';

pagemon('YOUR_APP_ID');

const LoginPage = () => {
  // Monitor all login-related API calls
  const handleLogin = async () => {
    const response = await fetch('/api/auth/login', {
      method: 'POST',
      body: JSON.stringify({ email, password })
    });
    return response;
  };
};

user-profile.tsx - Monitor user data APIs:

Code
import { pagemon } from 'pagemon-sdk';

pagemon('YOUR_APP_ID');

// All API calls in this component are monitored

payment.tsx - Monitor payment processing:

Code
import { pagemon } from 'pagemon-sdk';

pagemon('YOUR_APP_ID');

// Payment API calls automatically tracked

Step 4: Configuration Options

You can configure how notifications are sent:

Code
// Send to backend only (default)
pagemon('YOUR_APP_ID');

// Send to console only (for development)
pagemon('YOUR_APP_ID', { notify: 'console' });

// Send to both console and backend
pagemon('YOUR_APP_ID', { notify: 'both' });

Features

  • Automatic Network Monitoring - Captures all API calls without code changes
  • Slow Request Detection - Alerts when requests take longer than 2 seconds
  • Service Name Mapping - Intelligently identifies services (Firebase, Stripe, OpenAI, etc.)
  • Smart Error Throttling - Prevents spam with intelligent deduplication
  • Zero Setup Required - Just add one line to any file you want to monitor