@designli/logger
v0.1.0
Published
Agnostic logging system for Next.js applications with adapter-based backends
Downloads
25
Readme
@designli/logger
Agnostic logging system for Next.js applications with adapter-based backends.
Installation
pnpm add @designli/loggerOptional Integrations
# React provider & useLogger hook
pnpm add @designli/logger react
# Sentry adapter
pnpm add @designli/logger @sentry/nextjsQuick Start
import { logger } from '@designli/logger';
logger.debug('Debug info', { data: someData });
logger.info('User logged in', { userId: '123' });
logger.warn('Rate limit approaching');
logger.error('Failed to fetch', error, { component: 'UserList' });
logger.fatal('Critical failure', error);
// Capture exceptions directly
logger.captureException(error, { action: 'checkout' });
// User-scoped logging
logger.setUser({ id: '123', email: '[email protected]' });
logger.clearUser(); // on logoutNext.js Setup
Server-side (instrumentation.ts)
export async function register() {
if (process.env.NEXT_RUNTIME === 'nodejs') {
await import('../sentry.server.config');
const { logger, createLoggerConfig } = await import('@designli/logger');
const { SentryAdapter } = await import('@designli/logger/sentry');
const config = createLoggerConfig();
config.adapters.push(new SentryAdapter());
logger.configure(config);
}
}Client-side (layout.tsx)
import { LoggerProvider } from '@designli/logger/react';
import { SentryAdapter } from '@designli/logger/sentry';
export default function RootLayout({ children }) {
return (
<html>
<body>
<LoggerProvider adapters={[new SentryAdapter()]}>
{children}
</LoggerProvider>
</body>
</html>
);
}React Hook
import { useLogger } from '@designli/logger/react';
function MyComponent() {
const log = useLogger({ component: 'MyComponent' });
const handleClick = () => {
log.info('Button clicked', { action: 'click' });
};
return <button onClick={handleClick}>Click</button>;
}Adapters
Console (built-in)
import { ConsoleAdapter } from '@designli/logger';
new ConsoleAdapter({
colorize: true,
showTimestamp: true,
showContext: true,
});Sentry
import { SentryAdapter } from '@designli/logger/sentry';
new SentryAdapter({
minLevel: 'warn', // Only capture warn/error/fatal
captureBreadcrumbs: true, // Add debug/info as breadcrumbs
});Custom Adapter
Implement the LoggerAdapter interface:
import type { LoggerAdapter, LogEntry, LogContext, LoggerUser } from '@designli/logger';
export class DatadogAdapter implements LoggerAdapter {
readonly name = 'datadog';
log(entry: LogEntry): void { /* send to Datadog */ }
captureException(error: Error, context?: LogContext): void { /* ... */ }
setUser(user: LoggerUser): void { /* ... */ }
clearUser(): void { /* ... */ }
async flush(): Promise<void> { /* ... */ }
}Log Levels
| Level | Priority | Sentry Default |
|---------|----------|----------------|
| debug | 0 | Breadcrumb |
| info | 1 | Breadcrumb |
| warn | 2 | ✅ Captured |
| error | 3 | ✅ Captured |
| fatal | 4 | ✅ Captured |
API
createLoggerConfig(options?)
| Option | Type | Default |
|-----------------|-----------|----------------------------|
| minLevel | LogLevel| 'debug' (dev) / 'warn' (prod) |
| enableConsole | boolean | true (dev) / false (prod) |
LoggerProvider (React)
| Prop | Type | Description |
|------------|-----------------------------|----------------------------------|
| adapters | LoggerAdapter[] | Additional adapters to register |
| config | Partial<CreateLoggerConfigOptions> | Config overrides |
License
Private - Designli