Add Sentry to client for error handling (#43920)

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

api-server/src/server/index.js

@@ -18,11 +18,11 @@ const reqLogFormat = ':date[iso] :status :method :response-time ms - :url';
 // this may be brittle
 log.enabled = true;
 
-if (sentry.dns === 'dsn_from_sentry_dashboard') {
+if (sentry.dsn === 'dsn_from_sentry_dashboard') {
   log('Sentry reporting disabled unless DSN is provided.');
 } else {
   Sentry.init({
-    dsn: sentry.dns
+    dsn: sentry.dsn
   });
   log('Sentry initialized');
 }

api-server/src/server/middlewares/sentry-error-handler.js

@@ -4,14 +4,14 @@ import { isHandledError } from '../utils/create-handled-error';
 
 // sends directly to Sentry
 export function reportError(err) {
-  return sentry.dns === 'dsn_from_sentry_dashboard'
+  return sentry.dsn === 'dsn_from_sentry_dashboard'
     ? console.error(err)
     : captureException(err);
 }
 
 // determines which errors should be reported
 export default function sentryErrorHandler() {
-  return sentry.dns === 'dsn_from_sentry_dashboard'
+  return sentry.dsn === 'dsn_from_sentry_dashboard'
     ? (req, res, next) => next()
     : Handlers.errorHandler({
         shouldHandleError(err) {

api-server/src/server/middlewares/sentry-request-handler.js

@@ -2,7 +2,7 @@ import { Handlers } from '@sentry/node';
 import { sentry } from '../../../../config/secrets';
 
 export default function sentryRequestHandler() {
-  return sentry.dns === 'dsn_from_sentry_dashboard'
+  return sentry.dsn === 'dsn_from_sentry_dashboard'
     ? (req, res, next) => next()
     : Handlers.requestHandler();
 }

client/gatsby-config.js

@@ -6,7 +6,8 @@ const {
   localeChallengesRootDir
 } = require('./utils/build-challenges');
 
-const { clientLocale, curriculumLocale, homeLocation } = envData;
+const { clientLocale, curriculumLocale, homeLocation, sentryClientDSN } =
+  envData;
 
 const curriculumIntroRoot = path.resolve(__dirname, './src/pages');
 const pathPrefix =
@@ -24,6 +25,12 @@ module.exports = {
   },
   pathPrefix: pathPrefix,
   plugins: [
+    {
+      resolve: '@sentry/gatsby',
+      options: {
+        dsn: sentryClientDSN
+      }
+    },
     {
       resolve: 'gatsby-plugin-webpack-bundle-analyser-v2',
       options: {

client/package.json

@@ -49,6 +49,7 @@
     "@freecodecamp/strip-comments": "3.0.1",
     "@loadable/component": "5.15.2",
     "@reach/router": "1.3.4",
+    "@sentry/gatsby": "^6.19.6",
     "@stripe/react-stripe-js": "1.7.1",
     "@stripe/stripe-js": "1.27.0",
     "@types/react-scrollable-anchor": "0.6.1",

client/src/utils/report-error.ts

@@ -1,7 +1,15 @@
-// TODO: integrate with Sentry?
+import * as Sentry from '@sentry/gatsby';
+import envData from '../../../config/env.json';
+
+const { sentryClientDSN } = envData;
+
 export function reportClientSideError(
   e: Error,
-  message = 'Unhandled error'
-): void {
-  return console.error(`Client: ${message}`, e);
+  message = sentryClientDSN === null
+    ? 'Unhandled error'
+    : 'Error sent to Sentry'
+): string | void {
+  return sentryClientDSN === null
+    ? console.error(`Client: ${message}`, e)
+    : Sentry.captureException(e);
 }

config/read-env.js

@@ -31,6 +31,7 @@ const {
   PAYPAL_CLIENT_ID: paypalClientId,
   PATREON_CLIENT_ID: patreonClientId,
   DEPLOYMENT_ENV: deploymentEnv,
+  SENTRY_CLIENT_DSN: sentryClientDSN,
   SHOW_UPCOMING_CHANGES: showUpcomingChanges,
   SHOW_NEW_CURRICULUM: showNewCurriculum
 } = process.env;
@@ -71,6 +72,10 @@ module.exports = Object.assign(locations, {
     !patreonClientId || patreonClientId === 'id_from_patreon_dashboard'
       ? null
       : patreonClientId,
+  sentryClientDSN:
+    !sentryClientDSN || sentryClientDSN === 'dsn_from_sentry_dashboard'
+      ? null
+      : sentryClientDSN,
   showUpcomingChanges: showUpcomingChanges === 'true',
   showNewCurriculum: showNewCurriculum === 'true'
 });

config/secrets.js

@@ -92,7 +92,7 @@ module.exports = {
   },
 
   sentry: {
-    dns: SENTRY_DSN
+    dsn: SENTRY_DSN
   },
 
   stripe: {

package-lock.json

@@ -982,6 +982,7 @@
         "@freecodecamp/strip-comments": "3.0.1",
         "@loadable/component": "5.15.2",
         "@reach/router": "1.3.4",
+        "@sentry/gatsby": "^6.19.6",
         "@stripe/react-stripe-js": "1.7.1",
         "@stripe/stripe-js": "1.27.0",
         "@types/react-scrollable-anchor": "0.6.1",
@@ -6070,6 +6071,102 @@
       "integrity": "sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg==",
       "dev": true
     },
+    "node_modules/@sentry/browser": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-6.19.6.tgz",
+      "integrity": "sha512-V5QyY1cO1iuFCI78dOFbHV7vckbeQEPPq3a5dGSXlBQNYnd9Ec5xoxp5nRNpWQPOZ8/Ixt9IgRxdqVTkWib51g==",
+      "dependencies": {
+        "@sentry/core": "6.19.6",
+        "@sentry/types": "6.19.6",
+        "@sentry/utils": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/browser/node_modules/@sentry/core": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-6.19.6.tgz",
+      "integrity": "sha512-biEotGRr44/vBCOegkTfC9rwqaqRKIpFljKGyYU6/NtzMRooktqOhjmjmItNCMRknArdeaQwA8lk2jcZDXX3Og==",
+      "dependencies": {
+        "@sentry/hub": "6.19.6",
+        "@sentry/minimal": "6.19.6",
+        "@sentry/types": "6.19.6",
+        "@sentry/utils": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/browser/node_modules/@sentry/hub": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.19.6.tgz",
+      "integrity": "sha512-PuEOBZxvx3bjxcXmWWZfWXG+orojQiWzv9LQXjIgroVMKM/GG4QtZbnWl1hOckUj7WtKNl4hEGO2g/6PyCV/vA==",
+      "dependencies": {
+        "@sentry/types": "6.19.6",
+        "@sentry/utils": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/browser/node_modules/@sentry/minimal": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/minimal/-/minimal-6.19.6.tgz",
+      "integrity": "sha512-T1NKcv+HTlmd8EbzUgnGPl4ySQGHWMCyZ8a8kXVMZOPDzphN3fVIzkYzWmSftCWp0rpabXPt9aRF2mfBKU+mAQ==",
+      "dependencies": {
+        "@sentry/hub": "6.19.6",
+        "@sentry/types": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/browser/node_modules/@sentry/types": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-6.19.6.tgz",
+      "integrity": "sha512-QH34LMJidEUPZK78l+Frt3AaVFJhEmIi05Zf8WHd9/iTt+OqvCHBgq49DDr1FWFqyYWm/QgW/3bIoikFpfsXyQ==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/browser/node_modules/@sentry/utils": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-6.19.6.tgz",
+      "integrity": "sha512-fAMWcsguL0632eWrROp/vhPgI7sBj/JROWVPzpabwVkm9z3m1rQm6iLFn4qfkZL8Ozy6NVZPXOQ7EXmeU24byg==",
+      "dependencies": {
+        "@sentry/types": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/cli": {
+      "version": "1.74.3",
+      "resolved": "https://registry.npmjs.org/@sentry/cli/-/cli-1.74.3.tgz",
+      "integrity": "sha512-74NiqWTgTFDPe2S99h1ge5UMe6aAC44ebareadd1P6MdaNfYz6JUEa2QrDfMq7TKccEiRFXhXBHbUI8mxzrzuQ==",
+      "hasInstallScript": true,
+      "dependencies": {
+        "https-proxy-agent": "^5.0.0",
+        "mkdirp": "^0.5.5",
+        "node-fetch": "^2.6.7",
+        "npmlog": "^4.1.2",
+        "progress": "^2.0.3",
+        "proxy-from-env": "^1.1.0",
+        "which": "^2.0.2"
+      },
+      "bin": {
+        "sentry-cli": "bin/sentry-cli"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
     "node_modules/@sentry/core": {
       "version": "6.18.0",
       "resolved": "https://registry.npmjs.org/@sentry/core/-/core-6.18.0.tgz",
@@ -6085,6 +6182,84 @@
         "node": ">=6"
       }
     },
+    "node_modules/@sentry/gatsby": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/gatsby/-/gatsby-6.19.6.tgz",
+      "integrity": "sha512-6wgsSlAA0Lph/GIpIeim7BnillAoaa0n/86/dKqhnJ25o5SZjKNBzm6jHtC9A/9EBsDkwFpF87cQzh28lCaUJA==",
+      "dependencies": {
+        "@sentry/react": "6.19.6",
+        "@sentry/tracing": "6.19.6",
+        "@sentry/webpack-plugin": "1.18.8"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "peerDependencies": {
+        "gatsby": "^2.0.0 || ^3.0.0 || ^4.0.0",
+        "react": "15.x || 16.x || 17.x || 18.x"
+      }
+    },
+    "node_modules/@sentry/gatsby/node_modules/@sentry/hub": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.19.6.tgz",
+      "integrity": "sha512-PuEOBZxvx3bjxcXmWWZfWXG+orojQiWzv9LQXjIgroVMKM/GG4QtZbnWl1hOckUj7WtKNl4hEGO2g/6PyCV/vA==",
+      "dependencies": {
+        "@sentry/types": "6.19.6",
+        "@sentry/utils": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/gatsby/node_modules/@sentry/minimal": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/minimal/-/minimal-6.19.6.tgz",
+      "integrity": "sha512-T1NKcv+HTlmd8EbzUgnGPl4ySQGHWMCyZ8a8kXVMZOPDzphN3fVIzkYzWmSftCWp0rpabXPt9aRF2mfBKU+mAQ==",
+      "dependencies": {
+        "@sentry/hub": "6.19.6",
+        "@sentry/types": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/gatsby/node_modules/@sentry/tracing": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/tracing/-/tracing-6.19.6.tgz",
+      "integrity": "sha512-STZdlEtTBqRmPw6Vjkzi/1kGkGPgiX0zdHaSOhSeA2HXHwx7Wnfu7veMKxtKWdO+0yW9QZGYOYqp0GVf4Swujg==",
+      "dependencies": {
+        "@sentry/hub": "6.19.6",
+        "@sentry/minimal": "6.19.6",
+        "@sentry/types": "6.19.6",
+        "@sentry/utils": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/gatsby/node_modules/@sentry/types": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-6.19.6.tgz",
+      "integrity": "sha512-QH34LMJidEUPZK78l+Frt3AaVFJhEmIi05Zf8WHd9/iTt+OqvCHBgq49DDr1FWFqyYWm/QgW/3bIoikFpfsXyQ==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/gatsby/node_modules/@sentry/utils": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-6.19.6.tgz",
+      "integrity": "sha512-fAMWcsguL0632eWrROp/vhPgI7sBj/JROWVPzpabwVkm9z3m1rQm6iLFn4qfkZL8Ozy6NVZPXOQ7EXmeU24byg==",
+      "dependencies": {
+        "@sentry/types": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/@sentry/hub": {
       "version": "6.18.0",
       "resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.18.0.tgz",
@@ -6130,6 +6305,71 @@
         "node": ">=6"
       }
     },
+    "node_modules/@sentry/react": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/react/-/react-6.19.6.tgz",
+      "integrity": "sha512-RnWZ7clg1lRgf/JFNnTOs8ZPCv566E5CwFXXb6swyjPYUMcIn95XujDQU9SU4hXZ4qXd9BRvifxqyxvq0LMXNw==",
+      "dependencies": {
+        "@sentry/browser": "6.19.6",
+        "@sentry/minimal": "6.19.6",
+        "@sentry/types": "6.19.6",
+        "@sentry/utils": "6.19.6",
+        "hoist-non-react-statics": "^3.3.2",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "peerDependencies": {
+        "react": "15.x || 16.x || 17.x || 18.x"
+      }
+    },
+    "node_modules/@sentry/react/node_modules/@sentry/hub": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.19.6.tgz",
+      "integrity": "sha512-PuEOBZxvx3bjxcXmWWZfWXG+orojQiWzv9LQXjIgroVMKM/GG4QtZbnWl1hOckUj7WtKNl4hEGO2g/6PyCV/vA==",
+      "dependencies": {
+        "@sentry/types": "6.19.6",
+        "@sentry/utils": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/react/node_modules/@sentry/minimal": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/minimal/-/minimal-6.19.6.tgz",
+      "integrity": "sha512-T1NKcv+HTlmd8EbzUgnGPl4ySQGHWMCyZ8a8kXVMZOPDzphN3fVIzkYzWmSftCWp0rpabXPt9aRF2mfBKU+mAQ==",
+      "dependencies": {
+        "@sentry/hub": "6.19.6",
+        "@sentry/types": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/react/node_modules/@sentry/types": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-6.19.6.tgz",
+      "integrity": "sha512-QH34LMJidEUPZK78l+Frt3AaVFJhEmIi05Zf8WHd9/iTt+OqvCHBgq49DDr1FWFqyYWm/QgW/3bIoikFpfsXyQ==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@sentry/react/node_modules/@sentry/utils": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-6.19.6.tgz",
+      "integrity": "sha512-fAMWcsguL0632eWrROp/vhPgI7sBj/JROWVPzpabwVkm9z3m1rQm6iLFn4qfkZL8Ozy6NVZPXOQ7EXmeU24byg==",
+      "dependencies": {
+        "@sentry/types": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/@sentry/tracing": {
       "version": "6.18.0",
       "resolved": "https://registry.npmjs.org/@sentry/tracing/-/tracing-6.18.0.tgz",
@@ -6165,6 +6405,17 @@
         "node": ">=6"
       }
     },
+    "node_modules/@sentry/webpack-plugin": {
+      "version": "1.18.8",
+      "resolved": "https://registry.npmjs.org/@sentry/webpack-plugin/-/webpack-plugin-1.18.8.tgz",
+      "integrity": "sha512-PtKr0NL62b5L3kPFGjwSNbIUwwcW5E5G6bQxAYZGpkgL1MFPnS4ND0SAsySuX0byQJRFFium5A19LpzyvQZSlQ==",
+      "dependencies": {
+        "@sentry/cli": "^1.73.0"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
     "node_modules/@sideway/address": {
       "version": "4.1.3",
       "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.3.tgz",
@@ -42895,8 +43146,7 @@
     "node_modules/proxy-from-env": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
-      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
-      "dev": true
+      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
     },
     "node_modules/proxy-middleware": {
       "version": "0.15.0",
@@ -56428,6 +56678,7 @@
         "@freecodecamp/strip-comments": "3.0.1",
         "@loadable/component": "5.15.2",
         "@reach/router": "1.3.4",
+        "@sentry/gatsby": "^6.19.6",
         "@stripe/react-stripe-js": "1.7.1",
         "@stripe/stripe-js": "1.27.0",
         "@testing-library/jest-dom": "5.16.4",
@@ -58681,6 +58932,79 @@
         }
       }
     },
+    "@sentry/browser": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-6.19.6.tgz",
+      "integrity": "sha512-V5QyY1cO1iuFCI78dOFbHV7vckbeQEPPq3a5dGSXlBQNYnd9Ec5xoxp5nRNpWQPOZ8/Ixt9IgRxdqVTkWib51g==",
+      "requires": {
+        "@sentry/core": "6.19.6",
+        "@sentry/types": "6.19.6",
+        "@sentry/utils": "6.19.6",
+        "tslib": "^1.9.3"
+      },
+      "dependencies": {
+        "@sentry/core": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/core/-/core-6.19.6.tgz",
+          "integrity": "sha512-biEotGRr44/vBCOegkTfC9rwqaqRKIpFljKGyYU6/NtzMRooktqOhjmjmItNCMRknArdeaQwA8lk2jcZDXX3Og==",
+          "requires": {
+            "@sentry/hub": "6.19.6",
+            "@sentry/minimal": "6.19.6",
+            "@sentry/types": "6.19.6",
+            "@sentry/utils": "6.19.6",
+            "tslib": "^1.9.3"
+          }
+        },
+        "@sentry/hub": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.19.6.tgz",
+          "integrity": "sha512-PuEOBZxvx3bjxcXmWWZfWXG+orojQiWzv9LQXjIgroVMKM/GG4QtZbnWl1hOckUj7WtKNl4hEGO2g/6PyCV/vA==",
+          "requires": {
+            "@sentry/types": "6.19.6",
+            "@sentry/utils": "6.19.6",
+            "tslib": "^1.9.3"
+          }
+        },
+        "@sentry/minimal": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/minimal/-/minimal-6.19.6.tgz",
+          "integrity": "sha512-T1NKcv+HTlmd8EbzUgnGPl4ySQGHWMCyZ8a8kXVMZOPDzphN3fVIzkYzWmSftCWp0rpabXPt9aRF2mfBKU+mAQ==",
+          "requires": {
+            "@sentry/hub": "6.19.6",
+            "@sentry/types": "6.19.6",
+            "tslib": "^1.9.3"
+          }
+        },
+        "@sentry/types": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/types/-/types-6.19.6.tgz",
+          "integrity": "sha512-QH34LMJidEUPZK78l+Frt3AaVFJhEmIi05Zf8WHd9/iTt+OqvCHBgq49DDr1FWFqyYWm/QgW/3bIoikFpfsXyQ=="
+        },
+        "@sentry/utils": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-6.19.6.tgz",
+          "integrity": "sha512-fAMWcsguL0632eWrROp/vhPgI7sBj/JROWVPzpabwVkm9z3m1rQm6iLFn4qfkZL8Ozy6NVZPXOQ7EXmeU24byg==",
+          "requires": {
+            "@sentry/types": "6.19.6",
+            "tslib": "^1.9.3"
+          }
+        }
+      }
+    },
+    "@sentry/cli": {
+      "version": "1.74.3",
+      "resolved": "https://registry.npmjs.org/@sentry/cli/-/cli-1.74.3.tgz",
+      "integrity": "sha512-74NiqWTgTFDPe2S99h1ge5UMe6aAC44ebareadd1P6MdaNfYz6JUEa2QrDfMq7TKccEiRFXhXBHbUI8mxzrzuQ==",
+      "requires": {
+        "https-proxy-agent": "^5.0.0",
+        "mkdirp": "^0.5.5",
+        "node-fetch": "^2.6.7",
+        "npmlog": "^4.1.2",
+        "progress": "^2.0.3",
+        "proxy-from-env": "^1.1.0",
+        "which": "^2.0.2"
+      }
+    },
     "@sentry/core": {
       "version": "6.18.0",
       "resolved": "https://registry.npmjs.org/@sentry/core/-/core-6.18.0.tgz",
@@ -58693,6 +59017,64 @@
         "tslib": "^1.9.3"
       }
     },
+    "@sentry/gatsby": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/gatsby/-/gatsby-6.19.6.tgz",
+      "integrity": "sha512-6wgsSlAA0Lph/GIpIeim7BnillAoaa0n/86/dKqhnJ25o5SZjKNBzm6jHtC9A/9EBsDkwFpF87cQzh28lCaUJA==",
+      "requires": {
+        "@sentry/react": "6.19.6",
+        "@sentry/tracing": "6.19.6",
+        "@sentry/webpack-plugin": "1.18.8"
+      },
+      "dependencies": {
+        "@sentry/hub": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.19.6.tgz",
+          "integrity": "sha512-PuEOBZxvx3bjxcXmWWZfWXG+orojQiWzv9LQXjIgroVMKM/GG4QtZbnWl1hOckUj7WtKNl4hEGO2g/6PyCV/vA==",
+          "requires": {
+            "@sentry/types": "6.19.6",
+            "@sentry/utils": "6.19.6",
+            "tslib": "^1.9.3"
+          }
+        },
+        "@sentry/minimal": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/minimal/-/minimal-6.19.6.tgz",
+          "integrity": "sha512-T1NKcv+HTlmd8EbzUgnGPl4ySQGHWMCyZ8a8kXVMZOPDzphN3fVIzkYzWmSftCWp0rpabXPt9aRF2mfBKU+mAQ==",
+          "requires": {
+            "@sentry/hub": "6.19.6",
+            "@sentry/types": "6.19.6",
+            "tslib": "^1.9.3"
+          }
+        },
+        "@sentry/tracing": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/tracing/-/tracing-6.19.6.tgz",
+          "integrity": "sha512-STZdlEtTBqRmPw6Vjkzi/1kGkGPgiX0zdHaSOhSeA2HXHwx7Wnfu7veMKxtKWdO+0yW9QZGYOYqp0GVf4Swujg==",
+          "requires": {
+            "@sentry/hub": "6.19.6",
+            "@sentry/minimal": "6.19.6",
+            "@sentry/types": "6.19.6",
+            "@sentry/utils": "6.19.6",
+            "tslib": "^1.9.3"
+          }
+        },
+        "@sentry/types": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/types/-/types-6.19.6.tgz",
+          "integrity": "sha512-QH34LMJidEUPZK78l+Frt3AaVFJhEmIi05Zf8WHd9/iTt+OqvCHBgq49DDr1FWFqyYWm/QgW/3bIoikFpfsXyQ=="
+        },
+        "@sentry/utils": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-6.19.6.tgz",
+          "integrity": "sha512-fAMWcsguL0632eWrROp/vhPgI7sBj/JROWVPzpabwVkm9z3m1rQm6iLFn4qfkZL8Ozy6NVZPXOQ7EXmeU24byg==",
+          "requires": {
+            "@sentry/types": "6.19.6",
+            "tslib": "^1.9.3"
+          }
+        }
+      }
+    },
     "@sentry/hub": {
       "version": "6.18.0",
       "resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.18.0.tgz",
@@ -58729,6 +59111,55 @@
         "tslib": "^1.9.3"
       }
     },
+    "@sentry/react": {
+      "version": "6.19.6",
+      "resolved": "https://registry.npmjs.org/@sentry/react/-/react-6.19.6.tgz",
+      "integrity": "sha512-RnWZ7clg1lRgf/JFNnTOs8ZPCv566E5CwFXXb6swyjPYUMcIn95XujDQU9SU4hXZ4qXd9BRvifxqyxvq0LMXNw==",
+      "requires": {
+        "@sentry/browser": "6.19.6",
+        "@sentry/minimal": "6.19.6",
+        "@sentry/types": "6.19.6",
+        "@sentry/utils": "6.19.6",
+        "hoist-non-react-statics": "^3.3.2",
+        "tslib": "^1.9.3"
+      },
+      "dependencies": {
+        "@sentry/hub": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/hub/-/hub-6.19.6.tgz",
+          "integrity": "sha512-PuEOBZxvx3bjxcXmWWZfWXG+orojQiWzv9LQXjIgroVMKM/GG4QtZbnWl1hOckUj7WtKNl4hEGO2g/6PyCV/vA==",
+          "requires": {
+            "@sentry/types": "6.19.6",
+            "@sentry/utils": "6.19.6",
+            "tslib": "^1.9.3"
+          }
+        },
+        "@sentry/minimal": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/minimal/-/minimal-6.19.6.tgz",
+          "integrity": "sha512-T1NKcv+HTlmd8EbzUgnGPl4ySQGHWMCyZ8a8kXVMZOPDzphN3fVIzkYzWmSftCWp0rpabXPt9aRF2mfBKU+mAQ==",
+          "requires": {
+            "@sentry/hub": "6.19.6",
+            "@sentry/types": "6.19.6",
+            "tslib": "^1.9.3"
+          }
+        },
+        "@sentry/types": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/types/-/types-6.19.6.tgz",
+          "integrity": "sha512-QH34LMJidEUPZK78l+Frt3AaVFJhEmIi05Zf8WHd9/iTt+OqvCHBgq49DDr1FWFqyYWm/QgW/3bIoikFpfsXyQ=="
+        },
+        "@sentry/utils": {
+          "version": "6.19.6",
+          "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-6.19.6.tgz",
+          "integrity": "sha512-fAMWcsguL0632eWrROp/vhPgI7sBj/JROWVPzpabwVkm9z3m1rQm6iLFn4qfkZL8Ozy6NVZPXOQ7EXmeU24byg==",
+          "requires": {
+            "@sentry/types": "6.19.6",
+            "tslib": "^1.9.3"
+          }
+        }
+      }
+    },
     "@sentry/tracing": {
       "version": "6.18.0",
       "resolved": "https://registry.npmjs.org/@sentry/tracing/-/tracing-6.18.0.tgz",
@@ -58755,6 +59186,14 @@
         "tslib": "^1.9.3"
       }
     },
+    "@sentry/webpack-plugin": {
+      "version": "1.18.8",
+      "resolved": "https://registry.npmjs.org/@sentry/webpack-plugin/-/webpack-plugin-1.18.8.tgz",
+      "integrity": "sha512-PtKr0NL62b5L3kPFGjwSNbIUwwcW5E5G6bQxAYZGpkgL1MFPnS4ND0SAsySuX0byQJRFFium5A19LpzyvQZSlQ==",
+      "requires": {
+        "@sentry/cli": "^1.73.0"
+      }
+    },
     "@sideway/address": {
       "version": "4.1.3",
       "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.3.tgz",
@@ -87056,8 +87495,7 @@
     "proxy-from-env": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
-      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
-      "dev": true
+      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
     },
     "proxy-middleware": {
       "version": "0.15.0",

sample.env

@@ -7,6 +7,7 @@ MONGOHQ_URL=mongodb://localhost:27017/freecodecamp
 
 # Logging
 SENTRY_DSN=dsn_from_sentry_dashboard
+SENTRY_CLIENT_DSN=dsn_from_sentry_dashboard
 SENTRY_ENVIRONMENT=staging
 
 # Auth0 - OAuth 2.0 Credentials

tools/scripts/build/ensure-env.ts

@@ -53,11 +53,13 @@ if (FREECODECAMP_NODE_ENV !== 'development') {
   ];
   const searchKeys = ['algoliaAppId', 'algoliaAPIKey'];
   const donationKeys = ['stripePublicKey', 'paypalClientId', 'patreonClientId'];
+  const loggingKeys = ['sentryClientDSN'];
 
   const expectedVariables = locationKeys.concat(
     deploymentKeys,
     searchKeys,
-    donationKeys
+    donationKeys,
+    loggingKeys
   );
   const receivedvariables = Object.keys(env as Record<string, unknown>);
   expectedVariables.sort();