Installation

Install the Apperio SDK and configure it for your project.

Package Managers

Apperio is published as apperio on npm. Install it with your preferred package manager:

npm

Bash

npm install apperio

Yarn

Bash

yarn add apperio

pnpm

Bash

pnpm add apperio

The package includes TypeScript declarations out of the box. No separate @types package is needed.

CDN Usage

You can also load Apperio directly via a script tag for quick prototyping or non-bundled environments:

HTML

<script src="https://unpkg.com/apperio@latest/dist/index.js"></script>
<script>
  // Apperio is available as a global
  Apperio.init({
    projectId: "YOUR_PROJECT_ID",
    apiKey: "YOUR_API_KEY",
  });
</script>

Warning

The CDN version is best for prototyping. For production use, install via a package manager to benefit from tree-shaking and proper bundling.

Environment Setup

Store your project credentials as environment variables to keep them out of source code:

.env

APPERIO_PROJECT_ID=your_project_id_here
APPERIO_API_KEY=your_api_key_here

Then reference them during initialization:

src/monitoring.ts

import Apperio from class="syntax-string">"apperio";

Apperio.init({
  projectId: process.env.APPERIO_PROJECT_ID,
  apiKey: process.env.APPERIO_API_KEY,
  environment: process.env.NODE_ENV || class="syntax-string">"development",
});

Variable	Required	Description
`APPERIO_PROJECT_ID`	Yes	Your project ID from the Apperio dashboard
`APPERIO_API_KEY`	Yes	API key for authenticating SDK requests
`NODE_ENV`	No	Environment tag (development, staging, production)

Framework-Specific Notes

React (Create React App)

Prefix environment variables with REACT_APP_:

.env

REACT_APP_APPERIO_PROJECT_ID=your_project_id
REACT_APP_APPERIO_API_KEY=your_api_key

Next.js

For client-side usage, prefix with NEXT_PUBLIC_:

.env.local

NEXT_PUBLIC_APPERIO_PROJECT_ID=your_project_id
NEXT_PUBLIC_APPERIO_API_KEY=your_api_key

Vite

Prefix with VITE_ and access via import.meta.env:

.env

VITE_APPERIO_PROJECT_ID=your_project_id
VITE_APPERIO_API_KEY=your_api_key

TypeScript Support

The SDK ships with full TypeScript declarations. All configuration options, log methods, and event types are strongly typed:

TypeScript

import Apperio from class="syntax-string">"apperio";
import type { LoggerConfig, LogLevel } from class="syntax-string">"apperio";

const config: LoggerConfig = {
  projectId: class="syntax-string">"my-project",
  apiKey: class="syntax-string">"my-key",
  environment: class="syntax-string">"production",
  logLevel: class="syntax-string">"info" as LogLevel,
};

Apperio.init(config);

Verifying Installation

After installation, verify everything is working by sending a test log:

TypeScript

import Apperio from class="syntax-string">"apperio";

Apperio.init({
  projectId: class="syntax-string">"YOUR_PROJECT_ID",
  apiKey: class="syntax-string">"YOUR_API_KEY",
});

class="syntax-comment">// Send a test log
Apperio.info(class="syntax-string">"Apperio SDK installed successfully", {
  timestamp: new Date().toISOString(),
  version: class="syntax-string">"class="syntax-number">1.0.class="syntax-number">4",
});

class="syntax-comment">// Check your Apperio dashboard - the log should appear
class="syntax-comment">// within a few seconds.

Tip

If logs do not appear in the dashboard, check the browser console for any SDK error messages. Common issues include incorrect API keys or network connectivity problems.