diff --git a/package-lock.json b/package-lock.json
index c65332b..7f24960 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,7 +11,10 @@
         "@brianmmdev/clerk-webhooks-handler": "^1.0.3",
         "@clerk/nextjs": "^5.0.3",
         "@hookform/resolvers": "^3.4.0",
+        "@notionhq/client": "^2.2.15",
+        "@radix-ui/react-checkbox": "^1.0.4",
         "@radix-ui/react-label": "^2.0.2",
+        "@radix-ui/react-radio-group": "^1.1.3",
         "@radix-ui/react-slot": "^1.0.2",
         "@radix-ui/react-toggle": "^1.0.3",
         "class-variance-authority": "^0.7.0",
@@ -609,6 +612,18 @@
         "node": ">= 8"
       }
     },
+    "node_modules/@notionhq/client": {
+      "version": "2.2.15",
+      "resolved": "https://registry.npmjs.org/@notionhq/client/-/client-2.2.15.tgz",
+      "integrity": "sha512-XhdSY/4B1D34tSco/GION+23GMjaS9S2zszcqYkMHo8RcWInymF6L1x+Gk7EmHdrSxNFva2WM8orhC4BwQCwgw==",
+      "dependencies": {
+        "@types/node-fetch": "^2.5.10",
+        "node-fetch": "^2.6.1"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/@pkgjs/parseargs": {
       "version": "0.11.0",
       "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
@@ -626,6 +641,62 @@
         "@babel/runtime": "^7.13.10"
       }
     },
+    "node_modules/@radix-ui/react-checkbox": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-checkbox/-/react-checkbox-1.0.4.tgz",
+      "integrity": "sha512-CBuGQa52aAYnADZVt/KBQzXrwx6TqnlwtcIPGtVt5JkkzQwMOLJjPukimhfKEr4GQNd43C+djUh5Ikopj8pSLg==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10",
+        "@radix-ui/primitive": "1.0.1",
+        "@radix-ui/react-compose-refs": "1.0.1",
+        "@radix-ui/react-context": "1.0.1",
+        "@radix-ui/react-presence": "1.0.1",
+        "@radix-ui/react-primitive": "1.0.3",
+        "@radix-ui/react-use-controllable-state": "1.0.1",
+        "@radix-ui/react-use-previous": "1.0.1",
+        "@radix-ui/react-use-size": "1.0.1"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "@types/react-dom": "*",
+        "react": "^16.8 || ^17.0 || ^18.0",
+        "react-dom": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@radix-ui/react-collection": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-collection/-/react-collection-1.0.3.tgz",
+      "integrity": "sha512-3SzW+0PW7yBBoQlT8wNcGtaxaD0XSu0uLUFgrtHY08Acx05TaHaOmVLR73c0j/cqpDy53KBMO7s0dx2wmOIDIA==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10",
+        "@radix-ui/react-compose-refs": "1.0.1",
+        "@radix-ui/react-context": "1.0.1",
+        "@radix-ui/react-primitive": "1.0.3",
+        "@radix-ui/react-slot": "1.0.2"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "@types/react-dom": "*",
+        "react": "^16.8 || ^17.0 || ^18.0",
+        "react-dom": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@radix-ui/react-compose-refs": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/@radix-ui/react-compose-refs/-/react-compose-refs-1.0.1.tgz",
@@ -643,6 +714,58 @@
         }
       }
     },
+    "node_modules/@radix-ui/react-context": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-context/-/react-context-1.0.1.tgz",
+      "integrity": "sha512-ebbrdFoYTcuZ0v4wG5tedGnp9tzcV8awzsxYph7gXUyvnNLuTIcCk1q17JEbnVhXAKG9oX3KtchwiMIAYp9NLg==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "react": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@radix-ui/react-direction": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-direction/-/react-direction-1.0.1.tgz",
+      "integrity": "sha512-RXcvnXgyvYvBEOhCBuddKecVkoMiI10Jcm5cTI7abJRAHYfFxeu+FBQs/DvdxSYucxR5mna0dNsL6QFlds5TMA==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "react": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@radix-ui/react-id": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.0.1.tgz",
+      "integrity": "sha512-tI7sT/kqYp8p96yGWY1OAnLHrqDgzHefRBKQ2YAkBS5ja7QLcZ9Z/uY7bEjPUatf8RomoXM8/1sMj1IJaE5UzQ==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10",
+        "@radix-ui/react-use-layout-effect": "1.0.1"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "react": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@radix-ui/react-label": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/@radix-ui/react-label/-/react-label-2.0.2.tgz",
@@ -666,6 +789,30 @@
         }
       }
     },
+    "node_modules/@radix-ui/react-presence": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.0.1.tgz",
+      "integrity": "sha512-UXLW4UAbIY5ZjcvzjfRFo5gxva8QirC9hF7wRE4U5gz+TP0DbRk+//qyuAQ1McDxBt1xNMBTaciFGvEmJvAZCg==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10",
+        "@radix-ui/react-compose-refs": "1.0.1",
+        "@radix-ui/react-use-layout-effect": "1.0.1"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "@types/react-dom": "*",
+        "react": "^16.8 || ^17.0 || ^18.0",
+        "react-dom": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@radix-ui/react-primitive": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-1.0.3.tgz",
@@ -689,6 +836,69 @@
         }
       }
     },
+    "node_modules/@radix-ui/react-radio-group": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-radio-group/-/react-radio-group-1.1.3.tgz",
+      "integrity": "sha512-x+yELayyefNeKeTx4fjK6j99Fs6c4qKm3aY38G3swQVTN6xMpsrbigC0uHs2L//g8q4qR7qOcww8430jJmi2ag==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10",
+        "@radix-ui/primitive": "1.0.1",
+        "@radix-ui/react-compose-refs": "1.0.1",
+        "@radix-ui/react-context": "1.0.1",
+        "@radix-ui/react-direction": "1.0.1",
+        "@radix-ui/react-presence": "1.0.1",
+        "@radix-ui/react-primitive": "1.0.3",
+        "@radix-ui/react-roving-focus": "1.0.4",
+        "@radix-ui/react-use-controllable-state": "1.0.1",
+        "@radix-ui/react-use-previous": "1.0.1",
+        "@radix-ui/react-use-size": "1.0.1"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "@types/react-dom": "*",
+        "react": "^16.8 || ^17.0 || ^18.0",
+        "react-dom": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@radix-ui/react-roving-focus": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-roving-focus/-/react-roving-focus-1.0.4.tgz",
+      "integrity": "sha512-2mUg5Mgcu001VkGy+FfzZyzbmuUWzgWkj3rvv4yu+mLw03+mTzbxZHvfcGyFp2b8EkQeMkpRQ5FiA2Vr2O6TeQ==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10",
+        "@radix-ui/primitive": "1.0.1",
+        "@radix-ui/react-collection": "1.0.3",
+        "@radix-ui/react-compose-refs": "1.0.1",
+        "@radix-ui/react-context": "1.0.1",
+        "@radix-ui/react-direction": "1.0.1",
+        "@radix-ui/react-id": "1.0.1",
+        "@radix-ui/react-primitive": "1.0.3",
+        "@radix-ui/react-use-callback-ref": "1.0.1",
+        "@radix-ui/react-use-controllable-state": "1.0.1"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "@types/react-dom": "*",
+        "react": "^16.8 || ^17.0 || ^18.0",
+        "react-dom": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@radix-ui/react-slot": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.0.2.tgz",
@@ -767,6 +977,58 @@
         }
       }
     },
+    "node_modules/@radix-ui/react-use-layout-effect": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.1.tgz",
+      "integrity": "sha512-v/5RegiJWYdoCvMnITBkNNx6bCj20fiaJnWtRkU18yITptraXjffz5Qbn05uOiQnOvi+dbkznkoaMltz1GnszQ==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "react": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@radix-ui/react-use-previous": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-use-previous/-/react-use-previous-1.0.1.tgz",
+      "integrity": "sha512-cV5La9DPwiQ7S0gf/0qiD6YgNqM5Fk97Kdrlc5yBcrF3jyEZQwm7vYFqMo4IfeHgJXsRaMvLABFtd0OVEmZhDw==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "react": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@radix-ui/react-use-size": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-use-size/-/react-use-size-1.0.1.tgz",
+      "integrity": "sha512-ibay+VqrgcaI6veAojjofPATwledXiSmX+C0KrBk/xgpX9rBzPV3OsfwlhQdUOFbh+LKQorLYT+xTXW9V8yd0g==",
+      "dependencies": {
+        "@babel/runtime": "^7.13.10",
+        "@radix-ui/react-use-layout-effect": "1.0.1"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "react": "^16.8 || ^17.0 || ^18.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@rushstack/eslint-patch": {
       "version": "1.10.2",
       "resolved": "https://registry.npmjs.org/@rushstack/eslint-patch/-/eslint-patch-1.10.2.tgz",
@@ -794,11 +1056,19 @@
       "version": "20.11.28",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-20.11.28.tgz",
       "integrity": "sha512-M/GPWVS2wLkSkNHVeLkrF2fD5Lx5UC4PxA0uZcKc6QqbIQUJyW1jVjueJYi1z8n0I5PxYrtpnPnWglE+y9A0KA==",
-      "dev": true,
       "dependencies": {
         "undici-types": "~5.26.4"
       }
     },
+    "node_modules/@types/node-fetch": {
+      "version": "2.6.11",
+      "resolved": "https://registry.npmjs.org/@types/node-fetch/-/node-fetch-2.6.11.tgz",
+      "integrity": "sha512-24xFj9R5+rfQJLRyM56qh+wnVSYhyXC2tkoBndtY0U+vubqNsYXGjufB2nn8Q6gt0LrARwL6UBtMCSVCwl4B1g==",
+      "dependencies": {
+        "@types/node": "*",
+        "form-data": "^4.0.0"
+      }
+    },
     "node_modules/@types/prop-types": {
       "version": "15.7.11",
       "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.11.tgz",
@@ -1236,6 +1506,11 @@
       "resolved": "https://registry.npmjs.org/ast-types-flow/-/ast-types-flow-0.0.8.tgz",
       "integrity": "sha512-OH/2E5Fg20h2aPrbe+QL8JZQFko0YZaF+j4mnQ7BGhfavO7OpSLa8a0y9sBwomHdSbkhTS8TQNayBfnW5DwbvQ=="
     },
+    "node_modules/asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
+    },
     "node_modules/autoprefixer": {
       "version": "10.4.18",
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.18.tgz",
@@ -1680,6 +1955,17 @@
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
       "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
     },
+    "node_modules/combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "dependencies": {
+        "delayed-stream": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/commander": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
@@ -1850,6 +2136,14 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
     "node_modules/dequal": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz",
@@ -2903,6 +3197,19 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
+    "node_modules/form-data": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
+      "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
+      "dependencies": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "mime-types": "^2.1.12"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/fraction.js": {
       "version": "4.3.7",
       "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.7.tgz",
@@ -3843,6 +4150,25 @@
         "node": ">=8.6"
       }
     },
+    "node_modules/mime-db": {
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "dependencies": {
+        "mime-db": "1.52.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/minimatch": {
       "version": "9.0.3",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
@@ -5523,8 +5849,7 @@
     "node_modules/undici-types": {
       "version": "5.26.5",
       "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
-      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
-      "dev": true
+      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA=="
     },
     "node_modules/update-browserslist-db": {
       "version": "1.0.13",
diff --git a/package.json b/package.json
index 8cfe67a..267dc49 100644
--- a/package.json
+++ b/package.json
@@ -12,7 +12,10 @@
     "@brianmmdev/clerk-webhooks-handler": "^1.0.3",
     "@clerk/nextjs": "^5.0.3",
     "@hookform/resolvers": "^3.4.0",
+    "@notionhq/client": "^2.2.15",
+    "@radix-ui/react-checkbox": "^1.0.4",
     "@radix-ui/react-label": "^2.0.2",
+    "@radix-ui/react-radio-group": "^1.1.3",
     "@radix-ui/react-slot": "^1.0.2",
     "@radix-ui/react-toggle": "^1.0.3",
     "class-variance-authority": "^0.7.0",
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index b2f1e34..a1a2492 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -23,7 +23,7 @@ export default function RootLayout({
 }>) {
   return (
     <ClerkProvider>
-      <html lang="en">
+      <html lang="en" className="dark">
         <PHProvider>
           <body
             className={`${inter.className} px-4 py-8 max-w-screen-lg xl:px-0 mx-auto`}
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 3256e73..53198e2 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,5 +1,3 @@
-"use client";
-
 import JoinButton from "./lib/components/JoinButton";
 import UiCard from "./lib/components/UiCard";
 
diff --git a/src/app/podcast/apply/actions.ts b/src/app/podcast/apply/actions.ts
new file mode 100644
index 0000000..bbe637d
--- /dev/null
+++ b/src/app/podcast/apply/actions.ts
@@ -0,0 +1,110 @@
+'use server'
+
+import { Client } from '@notionhq/client'
+import { CreatePageParameters } from '@notionhq/client/build/src/api-endpoints'
+
+export type NotionRecord = {
+  yourName: string
+  email?: string
+  twitter?: string
+  productName?: string
+  productType?: string[]
+  productUrl?: string
+  productDescription?: string
+}
+
+export async function addRecordToNotion(record: NotionRecord) {
+  const notion = new Client({
+    auth: process.env.NOTION_KEY
+  })
+
+  const databaseId = process.env.NOTION_PODAPPS_DBID
+
+  const types = []
+  if(record.productType?.includes("webapp")) {
+    types.push("Web app")
+  }
+  if(record.productType?.includes("mobileapp")) {
+    types.push("Mobile app")
+  }
+  if(record.productType?.includes("desktopapp")) {
+    types.push("Desktop app")
+  }
+  if(record.productType?.includes("devtools")) {
+    types.push("Dev tools")
+  }
+
+  const props: CreatePageParameters = {
+    parent: {
+      database_id: databaseId as string
+    },
+    properties: {
+      "Name": {
+        title: [
+          {
+            text: {
+              content: record.yourName as string
+            }
+          }
+        ]
+      },
+    }
+  }
+
+  if(record.email) {
+    props.properties["Email"] = {
+      email: record.email
+    }
+  }
+
+  if (record.twitter) {
+    props.properties["Twitter"] = {
+      rich_text: [
+        {
+          text: {
+            content: record.twitter
+          }
+        }
+      ]
+    }
+  }
+
+  if (record.productName) {
+    props.properties["Product name"] = {
+      rich_text: [
+        {
+          text: {
+            content: record.productName
+          }
+        }
+      ]
+    }
+  }
+
+  if (record.productDescription) {
+    props.properties["Product description"] = {
+      rich_text: [
+        {
+          text: {
+            content: record.productDescription
+          }
+        }
+      ]
+    }
+  }
+
+  if (record.productUrl) {
+    props.properties["Product URL"] = {
+      url: record.productUrl
+    }
+  }
+
+  if (types.length > 0) {
+    props.properties["Product type"] = {
+      multi_select: types.map(type => ({ name: type }))
+    }
+  }
+
+
+  let res = await notion.pages.create(props)
+}
\ No newline at end of file
diff --git a/src/app/podcast/apply/page.tsx b/src/app/podcast/apply/page.tsx
new file mode 100644
index 0000000..0faab7d
--- /dev/null
+++ b/src/app/podcast/apply/page.tsx
@@ -0,0 +1,150 @@
+'use client'
+import { Input } from '@/components/ui/input'
+import { Label } from '@/components/ui/label'
+import React, { FormEvent, useState } from 'react'
+import { NotionRecord, addRecordToNotion } from './actions'
+import { Button } from '@/components/ui/button'
+import { Checkbox } from '@/components/ui/checkbox'
+import { RadioGroup, RadioGroupItem } from '@radix-ui/react-radio-group'
+import { Textarea } from '@/components/ui/textarea'
+import toast from 'react-hot-toast'
+import { useRouter } from 'next/navigation'
+
+function Page() {
+  const router = useRouter()
+
+  const [isLoading, setIsLoading] = useState(false)
+
+  async function onSubmit(event: FormEvent<HTMLFormElement>) {
+    event.preventDefault()
+    try {
+      setIsLoading(true)
+      const formData = new FormData(event.currentTarget)
+      let data: NotionRecord = {
+        yourName: formData.get('name') as string,
+        email: formData.get('email') as string,
+        twitter: formData.get('twitter') as string,
+        productName: formData.get('productName') as string,
+        productUrl: formData.get('productUrl') as string,
+        productType: ['webapp', 'mobileapp', 'desktopapp', 'devtools'].filter((type) => formData.get(type) === 'on'),
+        productDescription: formData.get('productDescription') as string,
+      }
+      await addRecordToNotion(data)
+      router.push('/podcast/apply/success')
+    } catch(err) {
+      console.error(err)
+      toast.error("Something went wrong! Reach out to @brianmmdev on Twitter for help.")
+    } finally {
+      setIsLoading(false)
+    }
+  }
+
+  return (
+    <section className="space-y-8">
+      <header className="flex flex-col gap-2">
+        <h1>Apply to be on the podcast</h1>
+        <p className="lg:text-lg text-balance md:max-w-prose">
+          The goal of the fullstack.chat podcast is to share the stories of developers building amazing web, desktop, or mobile applications. We want to hear about your journey, the challenges you've faced, and the lessons you've learned along the way.
+        </p>
+      </header>
+
+      <form onSubmit={onSubmit} className='flex flex-col gap-2' >
+        <div className="grid w-full max-w-sm items-center gap-1.5">
+          <Label htmlFor="name">Your full name</Label>
+          <Input type="text" id="name" name="name" placeholder="Your full name" disabled={isLoading} />
+        </div>
+        <div className="grid w-full max-w-sm items-center gap-1.5">
+          <Label htmlFor="email">Email</Label>
+          <Input type="email" id="email" name="email" placeholder="Email" disabled={isLoading} />
+        </div>
+        <div className="grid w-full max-w-sm items-center gap-1.5">
+          <Label htmlFor="twitter">Twitter/X handle</Label>
+          <Input type="text" id="twitter" name="twitter" placeholder="@fullstackchat" disabled={isLoading} />
+        </div>
+        <div className="grid w-full max-w-sm items-center gap-1.5">
+          <Label className="mb-1">Type of product</Label>
+          <div className="items-top flex space-x-2">
+            <Checkbox disabled={isLoading} id="webapp" name='webapp' />
+            <div className="grid gap-1.5 leading-none">
+              <Label htmlFor="webapp" className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" >
+                Web
+              </Label>
+            </div>
+          </div>
+          <div className="items-top flex space-x-2">
+            <Checkbox disabled={isLoading} id="mobileapp" name='mobileapp' />
+            <div className="grid gap-1.5 leading-none">
+              <Label htmlFor="mobileapp" className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" >
+                Mobile
+              </Label>
+            </div>
+          </div>
+          <div className="items-top flex space-x-2">
+            <Checkbox disabled={isLoading} id="desktopapp" name='desktopapp' />
+            <div className="grid gap-1.5 leading-none">
+              <Label htmlFor="desktopapp" className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" >
+                Desktop
+              </Label>
+            </div>
+          </div>
+          <div className="items-top flex space-x-2">
+            <Checkbox disabled={isLoading} id="devtools" name='devtools' />
+            <div className="grid gap-1.5 leading-none">
+              <Label htmlFor="devtools" className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" >
+                Dev tools
+              </Label>
+            </div>
+          </div>
+        </div>
+
+        <div className="grid w-full max-w-sm items-center gap-1.5">
+          <Label htmlFor="productName">Product name</Label>
+          <Input type="text" id="productName" name="productName" placeholder="Product name" disabled={isLoading} />
+        </div>
+
+        <div className="grid w-full max-w-sm items-center gap-1.5">
+          <Label htmlFor="productUrl">Product URL</Label>
+          <Input type="text" id="productUrl" name="productUrl" placeholder="Product URL" disabled={isLoading} />
+        </div>
+
+        {/* <div className="grid w-full max-w-sm items-center gap-1.5">
+          <RadioGroup defaultValue="planning" name='phase'>
+            <div className="flex items-center space-x-2">
+              <RadioGroupItem value="planning" id="planning" />
+              <Label htmlFor="planning">Planing</Label>
+            </div>
+            <div className="flex items-center space-x-2">
+              <RadioGroupItem value="indev" id="indev" />
+              <Label htmlFor="indev">In development</Label>
+            </div>
+            <div className="flex items-center space-x-2">
+              <RadioGroupItem value="launched" id="launched" />
+              <Label htmlFor="launched">Launched</Label>
+            </div>
+          </RadioGroup>
+        </div> */}
+
+        {/* <div className="grid w-full max-w-sm items-center gap-1.5">
+          tech used (make this a multiselect and save to tags)
+        </div> */}
+
+        <div className="grid w-full max-w-sm items-center gap-1.5">
+          <Label htmlFor="productDescription">Product description</Label>
+          <Textarea placeholder="Product description" id="productDescription" name="productDescription" disabled={isLoading} />
+          <p className="text-sm text-muted-foreground">
+            What does your product do? What problem does it solve?
+          </p>
+
+        </div>
+
+        <div className='flex'>
+          <Button type='submit' disabled={isLoading}>
+            { isLoading ? 'Submitting...' : 'Submit'}
+          </Button>
+        </div>
+      </form>
+    </section>
+  )
+}
+
+export default Page
\ No newline at end of file
diff --git a/src/app/podcast/apply/success/page.tsx b/src/app/podcast/apply/success/page.tsx
new file mode 100644
index 0000000..466452b
--- /dev/null
+++ b/src/app/podcast/apply/success/page.tsx
@@ -0,0 +1,19 @@
+import JoinButton from '@/app/lib/components/JoinButton'
+import React from 'react'
+
+function Page() {
+  return (
+
+    <header className="flex flex-col gap-2">
+      <h1>Thanks for applying!</h1>
+      <p className="lg:text-lg text-balance md:max-w-prose">
+        If we feel you're a good fit for the show, we'll reach out to schedule! In the meantime, join the Discord if you aren't already a member and introduce yourself!
+      </p>
+      <div className='flex'>
+        <JoinButton />
+      </div>
+    </header>
+  )
+}
+
+export default Page
\ No newline at end of file
diff --git a/src/components/ui/checkbox.tsx b/src/components/ui/checkbox.tsx
new file mode 100644
index 0000000..df61a13
--- /dev/null
+++ b/src/components/ui/checkbox.tsx
@@ -0,0 +1,30 @@
+"use client"
+
+import * as React from "react"
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
+import { Check } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+const Checkbox = React.forwardRef<
+  React.ElementRef<typeof CheckboxPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>
+>(({ className, ...props }, ref) => (
+  <CheckboxPrimitive.Root
+    ref={ref}
+    className={cn(
+      "peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
+      className
+    )}
+    {...props}
+  >
+    <CheckboxPrimitive.Indicator
+      className={cn("flex items-center justify-center text-current")}
+    >
+      <Check className="h-4 w-4" />
+    </CheckboxPrimitive.Indicator>
+  </CheckboxPrimitive.Root>
+))
+Checkbox.displayName = CheckboxPrimitive.Root.displayName
+
+export { Checkbox }
diff --git a/src/components/ui/radio-group.tsx b/src/components/ui/radio-group.tsx
new file mode 100644
index 0000000..e9bde17
--- /dev/null
+++ b/src/components/ui/radio-group.tsx
@@ -0,0 +1,44 @@
+"use client"
+
+import * as React from "react"
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group"
+import { Circle } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+const RadioGroup = React.forwardRef<
+  React.ElementRef<typeof RadioGroupPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>
+>(({ className, ...props }, ref) => {
+  return (
+    <RadioGroupPrimitive.Root
+      className={cn("grid gap-2", className)}
+      {...props}
+      ref={ref}
+    />
+  )
+})
+RadioGroup.displayName = RadioGroupPrimitive.Root.displayName
+
+const RadioGroupItem = React.forwardRef<
+  React.ElementRef<typeof RadioGroupPrimitive.Item>,
+  React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>
+>(({ className, ...props }, ref) => {
+  return (
+    <RadioGroupPrimitive.Item
+      ref={ref}
+      className={cn(
+        "aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      )}
+      {...props}
+    >
+      <RadioGroupPrimitive.Indicator className="flex items-center justify-center">
+        <Circle className="h-2.5 w-2.5 fill-current text-current" />
+      </RadioGroupPrimitive.Indicator>
+    </RadioGroupPrimitive.Item>
+  )
+})
+RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName
+
+export { RadioGroup, RadioGroupItem }