Skip to main content

Sentry

アカウント作成

  • アカウント作成
    • 01_create-account.png
    • 名前: 名前を入力
    • メール: メールを入力
    • 組織名: 組織名を入力
    • 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 にエラーが表示されたことを確認