diff --git a/packages/babel-preset-gatsby/README.md b/packages/babel-preset-gatsby/README.md
index 72e0e6ce5dad0..7de679dfb9f64 100644
--- a/packages/babel-preset-gatsby/README.md
+++ b/packages/babel-preset-gatsby/README.md
@@ -13,6 +13,8 @@ For more information on how to customize the Babel configuration of your Gatsby
 - [`@babel/plugin-transform-runtime`](https://babeljs.io/docs/en/babel-plugin-transform-runtime#docsNav)
 - [`babel-plugin-macros`](https://github.com/kentcdodds/babel-plugin-macros)
 - [`babel-plugin-transform-react-remove-prop-types`](https://github.com/oliviertassinari/babel-plugin-transform-react-remove-prop-types)
+- [`@babel/plugin-proposal-nullish-coalescing-operator`](https://babeljs.io/docs/en/babel-plugin-proposal-nullish-coalescing-operator)
+- [`@babel/plugin-proposal-optional-chaining`](https://babeljs.io/docs/en/babel-plugin-proposal-optional-chaining)
 
 ## Usage
 
diff --git a/packages/babel-preset-gatsby/package.json b/packages/babel-preset-gatsby/package.json
index e0fe8659b2df0..8f592b0d5b548 100644
--- a/packages/babel-preset-gatsby/package.json
+++ b/packages/babel-preset-gatsby/package.json
@@ -10,6 +10,8 @@
   "homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/babel-preset-gatsby#readme",
   "dependencies": {
     "@babel/plugin-proposal-class-properties": "^7.7.4",
+    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.7.4",
+    "@babel/plugin-proposal-optional-chaining": "^7.7.5",
     "@babel/plugin-syntax-dynamic-import": "^7.7.4",
     "@babel/plugin-transform-runtime": "^7.7.6",
     "@babel/plugin-transform-spread": "^7.7.4",
diff --git a/packages/babel-preset-gatsby/src/__tests__/__snapshots__/index.js.snap b/packages/babel-preset-gatsby/src/__tests__/__snapshots__/index.js.snap
index 4f93c29592c6a..bf872b28d82e9 100644
--- a/packages/babel-preset-gatsby/src/__tests__/__snapshots__/index.js.snap
+++ b/packages/babel-preset-gatsby/src/__tests__/__snapshots__/index.js.snap
@@ -9,6 +9,12 @@ Object {
         "loose": true,
       },
     ],
+    Array [
+      "<PROJECT_ROOT>/node_modules/@babel/plugin-proposal-nullish-coalescing-operator/lib/index.js",
+    ],
+    Array [
+      "<PROJECT_ROOT>/node_modules/@babel/plugin-proposal-optional-chaining/lib/index.js",
+    ],
     "<PROJECT_ROOT>/node_modules/babel-plugin-macros/dist/index.js",
     "<PROJECT_ROOT>/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js",
     Array [
@@ -66,6 +72,12 @@ Object {
         "loose": true,
       },
     ],
+    Array [
+      "<PROJECT_ROOT>/node_modules/@babel/plugin-proposal-nullish-coalescing-operator/lib/index.js",
+    ],
+    Array [
+      "<PROJECT_ROOT>/node_modules/@babel/plugin-proposal-optional-chaining/lib/index.js",
+    ],
     "<PROJECT_ROOT>/node_modules/babel-plugin-macros/dist/index.js",
     "<PROJECT_ROOT>/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js",
     Array [
@@ -127,6 +139,12 @@ Object {
         "loose": true,
       },
     ],
+    Array [
+      "<PROJECT_ROOT>/node_modules/@babel/plugin-proposal-nullish-coalescing-operator/lib/index.js",
+    ],
+    Array [
+      "<PROJECT_ROOT>/node_modules/@babel/plugin-proposal-optional-chaining/lib/index.js",
+    ],
     "<PROJECT_ROOT>/node_modules/babel-plugin-macros/dist/index.js",
     "<PROJECT_ROOT>/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js",
     Array [
@@ -182,6 +200,12 @@ Object {
         "loose": true,
       },
     ],
+    Array [
+      "<PROJECT_ROOT>/node_modules/@babel/plugin-proposal-nullish-coalescing-operator/lib/index.js",
+    ],
+    Array [
+      "<PROJECT_ROOT>/node_modules/@babel/plugin-proposal-optional-chaining/lib/index.js",
+    ],
     "<PROJECT_ROOT>/node_modules/babel-plugin-macros/dist/index.js",
     "<PROJECT_ROOT>/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js",
     Array [
diff --git a/packages/babel-preset-gatsby/src/index.js b/packages/babel-preset-gatsby/src/index.js
index 686b922088165..578a8b7847ac6 100644
--- a/packages/babel-preset-gatsby/src/index.js
+++ b/packages/babel-preset-gatsby/src/index.js
@@ -76,6 +76,8 @@ module.exports = function preset(_, options = {}) {
           loose: true,
         },
       ],
+      [resolve(`@babel/plugin-proposal-nullish-coalescing-operator`)],
+      [resolve(`@babel/plugin-proposal-optional-chaining`)],
       resolve(`babel-plugin-macros`),
       resolve(`@babel/plugin-syntax-dynamic-import`),
       [