3e51ddb8af
* Run prettier over packages/**/*.js * Run prettier over packages/**/*.ts * Run prettier over examples * Remove tslint * Run prettier over examples * Run prettier over all markdown files * Run prettier over json files |
||
---|---|---|
.. | ||
pages | ||
next.config.js | ||
package.json | ||
README.md |
Sentry (Simple Example)
How To Use
Using create-next-app
Execute create-next-app
with Yarn or npx to bootstrap the example:
npx create-next-app --example with-sentry-simple with-sentry-simple
# or
yarn create next-app --example with-sentry-simple with-sentry-simple
Download Manually
Download the example:
curl https://codeload.github.com/zeit/next.js/tar.gz/canary | tar -xz --strip=2 next.js-canary/examples/with-sentry-simple
cd with-sentry-simple
Install it and run:
NPM
npm install
npm run dev
Yarn
yarn
yarn dev
Deploy it to the cloud with Now (Download)
now
About Example
This is a simple example showing how to use Sentry to catch & report errors on both client + server side.
_document.js
is server-side only and is used to change the initial server-side rendered document markup. We listen at the node process level to capture exceptions._app.js
is client-side only and is used to initialize pages. We use thecomponentDidCatch
lifecycle method to catch uncaught exceptions.
Note: Source maps will not be sent to Sentry when running locally. It's also possible you will see duplicate errors sent when testing locally due to hot reloading. For a more accurate simulation, please deploy to Now.
Configuration
You will need a Sentry DSN for your project. You can get it from the settings of your project in Client Keys (DSN). Then, copy the string labeled DSN (Public).
The Sentry DSN should then be updated in _app.js
.
Sentry.init({
dsn: 'PUT_YOUR_SENTRY_DSN_HERE',
})
Note: Committing environment variables is not secure and is done here only for demonstration purposes. See the with-dotenv
or with-now-env
for examples of how to set environment variables safely.