Sentry
アカウント作成
- アカウント作成

- 名前: 名前を入力
- メール: メールを入力
- 組織名: 組織名を入力
- Data Storage Location を選択. ここでは、United States of America(US) を選択
- I agree to the Terms of Service and the Privacy Policy にチェックを入れる
- 続ける
プロジェクト作成
- Projects を選択
- Create Project を選択
- NEXT.JS を選択
- Project name を入力
- Team を選択(新たに作成してもよい)
- Create Project を選択
Sentry ファイルの修正
- AUTH TOKEN を取得
- 左側の Settings を選択
- Auth Tokens→Create New Auth Token を選択
- 任意の Name を入力
- Create Auth Token を選択
- Token が表示されるので、コピーして保存
- SENTRY_AUTH_TOKEN を GitHub の Secrets に登録
- GitHub のリポジトリに移動
- Settings を選択
- Secrets and variables を選択
- Actions を選択
- New repository secret を選択
- Name に SENTRY_AUTH_TOKEN を入力
- Value に Sentry の AUTH_TOKEN を入力
- SENTRY_ORG と SENTRY_PROJECT を GitHub の Variables に登録
- Settings を選択
- Variables を選択
- Actions を選択
- New repository variable を選択
- Name に SENTRY_ORG を入力
- Value に Sentry の ORG を入力 (ORG は、xxx.sentry.io の xxx の部分. 例: memoft)
- New repository variable を選択
- Name に SENTRY_PROJECT を入力
- Value に Sentry の PROJECT を入力 (PROJECT は、プロジェクト名. 例: bdash-sources)
- Sentry のファイルを修正
- next.config.mjs を修正
- org と project を登録した値に修正
- 例:
org: 'memoft',
project: 'bdash-sources',
- 例:
- DSN の修正
- Sentry プロジェクトを表示 → 右上の歯車アイコンを選択 → Client Keys(DSN)に移動
- DSN をコピー
- 以下 3 つのファイルの dsn を置換
- sentry.client.config.ts
- sentry.edge.config.ts
- sentry.server.config.ts
テスト
- http://localhost:3000/sentry-example-page にアクセス
- ボタンを押してエラーが発生したことを確認
- ブラウザのコンソールにエラーが表示されたことを確認
- Sentry の Issues にエラーが表示されたことを確認