@peakfijn/next-sentry v0.0.0

Next Sentry - Peakfijn

Quickly integrate Sentry in Next using environment variables and a React boundary.

1. Getting started
2. Used variables

Getting started

To set up Sentry, we need to initialize the client. You can do that with this code.

import { config } from '@peakfijn/next-sentry';
// initialize sentry with variables from environment
config();
// initialize sentry with extra config
config({
	dns: '<DSN>',
	maxBreadcrumbs: 50,
	debug: true,
});
// or initialize sentry instantly with environment variables
import '@peakfijn/next-sentry/config';

After Sentry is set up, we need to "catch" React errors. You can do this by wrapping all components in src/pages/_app.tsx with the SentryBoundary component.

We recommend wrapping all components with this boundary, but you can also use this for individual components.

import React from 'react';
import NextApp from 'next/app';
import { SentryBoundary } from '@peakfijn/next-sentry';

export default class App extends NextApp {
	render() {
		const { Component, pageProps } = this.props;

		return (
			<SentryBoundary>
				<Component {...pageProps} />
			</SentryBoundary>
		);
	}
}

Used variables

This library can enable Sentry automatically if you use the provided environment variables.

License

The MIT License (MIT). Please see License File for more information.