Mail

[{"_1":2,"_1506":-5,"_1507":-5},"loaderData",{"_3":4,"_91":92},"root",{"_5":6,"_34":35,"_64":65},"ctx",{"_7":8,"_23":-5,"_24":25,"_26":27,"_28":22,"_29":22,"_30":22,"_31":32,"_33":22},"auth",{"_9":10,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5,"_18":-5,"_19":-5,"_20":-5,"_21":22},"tokenType","session_token","sessionClaims","sessionId","sessionStatus","userId","actor","orgId","orgRole","orgSlug","orgPermissions","factorVerificationAge","isAuthenticated",false,"user","preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","notificationCount",0,"flagDenols","ENV",{"_36":37,"_38":39,"_40":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":51,"_52":53,"_54":55,"_56":57,"_58":59,"_60":61,"_62":63},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","VAL_RUNTIME_NAME","prod","RENDER_GIT_COMMIT","230fbbe1911b69d46be82b6db4e617b331d282a6","RENDER_GIT_BRANCH","main","CLERK_PUBLISHABLE_KEY","pk_live_Y2xlcmsudmFsLnRvd24k","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","API_URL","https://api.val.town","clerkState",{"_66":67},"__internal_clerk_state",{"_68":69,"_70":45,"_71":72,"_73":72,"_74":22,"_75":72,"_76":72,"_77":72,"_78":72,"_79":80,"_89":22,"_90":22},"__clerk_ssr_state",{"_9":10,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5,"_18":-5,"_19":-5,"_20":-5,"_21":22},"__publishableKey","__proxyUrl","","__domain","__isSatellite","__signInUrl","__signUpUrl","__afterSignInUrl","__afterSignUpUrl","__clerk_debug",{"_81":22,"_21":22,"_82":72,"_83":84,"_85":72,"_86":45,"_87":22,"_88":72},"isSignedIn","proxyUrl","reason","session-token-and-uat-missing","message","publishableKey","isSatellite","domain","__telemetryDisabled","__telemetryDebug","routes/_app.search",{"_93":22,"_94":32,"_95":96,"_97":98,"_99":100,"_101":102,"_205":206,"_243":244,"_261":262,"_1489":1490,"_1491":225,"_1492":1274,"_1493":1494,"_1495":225,"_1496":1497,"_1498":1499,"_1500":1501},"error","page","query","aoc","apiURL","https://codesearch.val.run/?q=aoc&format=json&page=1&type=users","type","users","fileResults",[103,146,161,176,190],{"_104":105,"_106":107,"_108":109,"_110":111,"_112":113,"_114":115,"_116":117,"_118":119,"_120":121,"_122":-5,"_123":-5,"_124":125,"_144":145},"id","7876485c-a50c-11f0-915a-0224a6c84d84","url","https://www.val.town/x/xusers/untitled-20/code/main.ts","project_id","7873b308-a50c-11f0-915a-0224a6c84d84","name","main.ts","content","export default function (req: Request) {\n return new Response(\n `\n \n \n\t\n\t\n\t\n\t\n Mail \n\n\t\n\n\n\n \n\n

$\"\"$

\n\n

\n $\"\"$ \n

\n \n\t\t\tPlease wait\n

\n\n

\n \n\t\t\tMail\n

\n\n\t\t\n \n\t\t \n

\n\t\n\t\n\t\n \n\t \n \n\n\t `,\n {\n headers: {\n \"Content-Type\": \"text/html\",\n },\n },\n );\n}","updated_at","2025-10-09T12:36:47.019Z","project_name","untitled-20","project_url","https://www.val.town/x/xusers/untitled-20/code/","username","xusers","description","image_url","matchedLines",[126,132,135,139,141],{"_127":128,"_129":130,"_131":22},"lineNumber",12,"lineContent"," Mail ","isMatch",{"_127":133,"_129":134,"_131":22},13,"","totalMatches",1,{"_104":147,"_106":148,"_108":149,"_110":111,"_112":150,"_114":151,"_116":152,"_118":153,"_120":154,"_122":-5,"_123":-5,"_124":155,"_144":145},"a0f59340-a454-11f0-9e4b-0224a6c84d84","https://www.val.town/x/genbox/gov/code/main.ts","a0f29afa-a454-11f0-9e4b-0224a6c84d84","export default function (req: Request) {\n return new Response(\n `\n \n \n\t\n\t\n\t\n\t\n Mail \n\n\t\n\n\n\n \n\n

$\"\"$

\n\n

\n $\"\"$ \n

\n \n\t\t\tPlease wait\n

\n\n

\n \n\t\t\tMail\n

\n\n\t\t\n \n\t\t \n

\n\t\n\t\n\t\n \n\t \n \n\n\t `,\n {\n headers: {\n \"Content-Type\": \"text/html\",\n },\n },\n );\n}","2025-10-08T14:42:09.018Z","gov","https://www.val.town/x/genbox/gov/code/","genbox",[156,157,158,159,160],{"_127":128,"_129":130,"_131":22},{"_127":133,"_129":134,"_131":22},{"_127":136,"_129":137,"_131":138},{"_127":140,"_129":72,"_131":22},{"_127":142,"_129":143,"_131":22},{"_104":162,"_106":163,"_108":164,"_110":111,"_112":165,"_114":166,"_116":167,"_118":168,"_120":154,"_122":-5,"_123":-5,"_124":169,"_144":145},"9b4f8e38-a42b-11f0-a9c3-0224a6c84d84","https://www.val.town/x/genbox/untitled-4809/code/main.ts","9b4c5f06-a42b-11f0-a9c3-0224a6c84d84","export default function (req: Request) {\n return new Response(\n `\n \n \n \n\t\n\t\n\t\n\t\n Mail \n\n\t\n\n\n\n \n\n

$\"\"$

\n\n

\n $\"\"$ \n

\n \n\t\t\tPlease wait\n

\n\n

\n \n\t\t\tMail\n

\n\n\t\t\n \n\t\t \n

\n\t\n\t\n\t \n\n\t `,\n {\n headers: {\n \"Content-Type\": \"text/html\",\n },\n },\n );\n}","2025-10-08T09:47:06.489Z","untitled-4809","https://www.val.town/x/genbox/untitled-4809/code/",[170,171,172,173,174],{"_127":133,"_129":130,"_131":22},{"_127":136,"_129":134,"_131":22},{"_127":140,"_129":137,"_131":138},{"_127":142,"_129":72,"_131":22},{"_127":175,"_129":143,"_131":22},17,{"_104":177,"_106":178,"_108":179,"_110":111,"_112":180,"_114":181,"_116":182,"_118":183,"_120":121,"_122":-5,"_123":-5,"_124":184,"_144":145},"724cc74c-a36f-11f0-8591-0224a6c84d84","https://www.val.town/x/xusers/untitled-373/code/main.ts","7249f8f0-a36f-11f0-8591-0224a6c84d84","export default function (req: Request) {\n return new Response(\n `\n \n \n\t\n\t\n\t\n\t\n Mail \n\n\t\n\n\n\n \n\n

$\"\"$

\n\n

\n $\"\"$ \n

\n \n\t\t\tPlease wait\n

\n\n

\n \n\t\t\tMail\n

\n\n\t\t\n \n\t\t \n

\n\t\n\t\n\t\n \n\n\t `,\n {\n headers: {\n \"Content-Type\": \"text/html\",\n },\n },\n );\n}","2025-10-07T11:26:11.454Z","untitled-373","https://www.val.town/x/xusers/untitled-373/code/",[185,186,187,188,189],{"_127":128,"_129":130,"_131":22},{"_127":133,"_129":134,"_131":22},{"_127":136,"_129":137,"_131":138},{"_127":140,"_129":72,"_131":22},{"_127":142,"_129":143,"_131":22},{"_104":191,"_106":192,"_108":193,"_110":111,"_112":194,"_114":195,"_116":196,"_118":197,"_120":198,"_122":-5,"_123":-5,"_124":199,"_144":145},"72170938-a2dc-11f0-8b11-0224a6c84d84","https://www.val.town/x/webm/aligen/code/main.ts","7213f20c-a2dc-11f0-8b11-0224a6c84d84","export default function (req: Request) {\n return new Response(\n `\n \n \n\t\n\t\n\t\n\t\n Mail \n\n\t\n\n\n\n \n\n

$\"\"$

\n\n

\n $\"\"$ \n

\n \n\t\t\tPlease wait\n

\n\n

\n \n\t\t\tMail\n

\n\n\t\t\n \n\t\t \n

\n\t\n\t\n\t\n \n\t \n \n\n\t \n\t `,\n {\n headers: {\n \"Content-Type\": \"text/html\",\n },\n },\n );\n}","2025-10-06T17:47:51.374Z","aligen","https://www.val.town/x/webm/aligen/code/","webm",[200,201,202,203,204],{"_127":128,"_129":130,"_131":22},{"_127":133,"_129":134,"_131":22},{"_127":136,"_129":137,"_131":138},{"_127":140,"_129":72,"_131":22},{"_127":142,"_129":143,"_131":22},"projectResults",[207,217,226,232,238],{"_104":208,"_106":209,"_110":210,"_120":211,"_122":-5,"_123":-5,"_212":-5,"_114":213,"_214":215,"_216":32},"6972032c-fc6b-11ef-987f-569c3dd06744","https://www.val.town/x/OmMousa/memorableMagentaOce/code/","memorableMagentaOce","OmMousa","forked_branch_id","2025-03-08T22:19:33.252Z","user_id","38a8ee20-f53d-11ef-804e-cd1503a70b22","matchCount",{"_104":218,"_106":219,"_110":220,"_120":221,"_122":-5,"_123":-5,"_212":222,"_114":223,"_214":224,"_216":225},"513ddf1c-278e-11f0-a822-569c3dd06744","https://www.val.town/x/robsimmons/aoc_2023_21_1/code/","aoc_2023_21_1","robsimmons","5157f6b8-278e-11f0-a822-569c3dd06744","2024-03-08T03:01:30.566Z","9df63109-b7cd-4c5f-af88-a0b5ae6371f9",2,{"_104":227,"_106":228,"_110":229,"_120":221,"_122":-5,"_123":-5,"_212":230,"_114":231,"_214":224,"_216":225},"5052d062-278e-11f0-a822-569c3dd06744","https://www.val.town/x/robsimmons/aoc_2023_15_2/code/","aoc_2023_15_2","5181dc94-278e-11f0-a822-569c3dd06744","2023-12-16T01:41:33.346Z",{"_104":233,"_106":234,"_110":235,"_120":221,"_122":-5,"_123":-5,"_212":236,"_114":237,"_214":224,"_216":225},"51808934-278e-11f0-a822-569c3dd06744","https://www.val.town/x/robsimmons/aoc_2023_15_1/code/","aoc_2023_15_1","5077d024-278e-11f0-a822-569c3dd06744","2023-12-16T01:35:49.385Z",{"_104":239,"_106":240,"_110":241,"_120":221,"_122":-5,"_123":-5,"_212":236,"_114":242,"_214":224,"_216":225},"50a7347c-278e-11f0-a822-569c3dd06744","https://www.val.town/x/robsimmons/aoc_2023_14_feasible/code/","aoc_2023_14_feasible","2023-12-15T18:38:47.401Z","userResults",[245,254],{"_104":246,"_120":247,"_248":-5,"_249":250,"_106":251,"_114":252,"_216":253},"db8c40b0-3679-11f0-8fa1-55b6765ef200","jessicaocean","bio","profile_image_url","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yeFExeUQyU0VlRHI3UGZ6NTE5RWJwak55S1IifQ","https://www.val.town/u/jessicaocean","2025-09-17T19:30:27.107Z",9,{"_104":255,"_120":256,"_248":-5,"_249":257,"_106":258,"_114":259,"_216":260},"98704e00-413e-11f0-ac26-6f9aa82eb942","AnthoniaOchai","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yeTJqbUNwbktvekdXeWlrUVEwS0NDeHN4bTYifQ","https://www.val.town/u/AnthoniaOchai","2025-08-12T21:24:56.200Z",3,"docResults",[263,331,623,736,891,933,1016,1182,1257,1339],{"_106":264,"_112":265,"_266":267,"_268":269,"_272":273,"_284":285,"_304":305,"_306":265,"_307":308,"_309":310,"_311":312},"https://docs.val.town/guides/creating-a-webhook/","Creating a webhook. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. Webhooks are for realtime server-to-server communication. Many apps – like GitHub, Discord, and Stripe – let you configure webhooks so that you can get programmatic notifications. When the event happens, they will send an HTTP request to a URL you specify. For example, we registered this val to receive webhooks from Stripe when we get a new subscriber to Val Town Pro. It sends new subscribers a thank you email and notifies our team in our internal Discord channel. Creating a webhook. Section titled “Creating a webhook” While the specifics vary by service, the general steps are: Create an HTTP handler to receive the webhook. Register the webhook with the service. Handle the incoming webhook. Secure the webhook by validating the request came from the service. We have examples for receiving webhooks from Github, Telegram, Stripe, and Supabase. Let us know if there are other integrations you’d like us to document!","word_count",182,"meta",{"_270":271},"title","Creating a webhook","anchors",[274,280],{"_275":276,"_104":277,"_278":271,"_279":32},"element","h1","_top","text","location",{"_275":281,"_104":282,"_278":271,"_279":283},"h2","creating-a-webhook",110,"weighted_locations",[286,291,294,296,298,302],{"_287":288,"_289":290,"_279":145},"weight",7,"balanced_score",14365.4375,{"_287":145,"_289":292,"_279":293},293.17218,68,{"_287":145,"_289":292,"_279":295},86,{"_287":145,"_289":292,"_279":297},97,{"_287":299,"_289":300,"_279":301},6,10554.199,111,{"_287":145,"_289":292,"_279":303},116,"locations",[145,293,295,297,301,303],"raw_content","raw_url","/guides/creating-a-webhook/","excerpt","Creating a webhook. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this","sub_results",[313,323],{"_270":271,"_106":314,"_315":316,"_284":317,"_304":322,"_309":310},"https://docs.val.town/guides/creating-a-webhook/#_top","anchor",{"_275":276,"_104":277,"_278":271,"_279":32},[318,319,320,321],{"_287":288,"_289":290,"_279":145},{"_287":145,"_289":292,"_279":293},{"_287":145,"_289":292,"_279":295},{"_287":145,"_289":292,"_279":297},[145,293,295,297],{"_270":271,"_106":324,"_315":325,"_284":326,"_304":329,"_309":330},"https://docs.val.town/guides/creating-a-webhook/#creating-a-webhook",{"_275":281,"_104":282,"_278":271,"_279":283},[327,328],{"_287":299,"_289":300,"_279":301},{"_287":145,"_289":292,"_279":303},[301,303],"Creating a webhook. Section titled “Creating a webhook” While the specifics vary by service, the general steps are: Create an HTTP handler to receive the webhook. Register the webhook with",{"_106":332,"_112":333,"_266":334,"_268":335,"_272":341,"_284":409,"_304":502,"_306":503,"_307":504,"_309":505,"_311":506},"https://docs.val.town/guides/google-sheets/","Store data in a Google Sheet. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. You can send data to Google Sheets from a val. You can collect data from incoming HTTP requests or from an HTTP endpoint on a schedule. You have two options for authenticating with the Google Sheets API: Use Pipedream’s Accounts API to fetch a fresh OAuth access token at runtime. Use your own Google Cloud service account. Use Pipedream’s Accounts API. Section titled “Use Pipedream’s Accounts API” Pipedream provides a workflow automation product for developers. Workflows are built as a sequence of steps — pre-built actions for thousands of APIs or custom code — triggered by an event (HTTP request, timer, when a new row is added to a Google Sheets, and more). Pipedream also manages the OAuth token refresh process for apps like Google Sheets, exposing a fresh access token in the workflow runtime and the Accounts API. If you connect your Google Sheets account to Pipedream, you can use the Accounts API to fetch a fresh token within your val and use that token to authenticate requests to the Google Sheets API. 1. Sign up for Pipedream and retrieve your API key. Section titled “1. Sign up for Pipedream and retrieve your API key” Sign up for Pipedream and visit https://pipedream.com/settings/user. Find the API Key section and copy your key: You’ll use this key to authenticate requests to the Accounts API, letting you fetch Google Sheets access tokens in your val. 2. Add that key as a Val Town environment variable. Section titled “2. Add that key as a Val Town environment variable” Add the API key as an environment variable in Val Town. In this example, we’ve named the environment variable pipedream_api_key: 3. Connect your Google Sheets account in Pipedream. Section titled “3. Connect your Google Sheets account in Pipedream” Visit https://pipedream.com/accounts. Click the Connect an app button at the top-right: You’ll be directed through the OAuth authorization process to connect your Google Sheets account to Pipedream. Once you’ve connected your account, you’ll see it listed on the Accounts page. 4. Copy the account ID. Section titled “4. Copy the account ID” Click the … to the right of the account and Copy Account ID: All account IDs are prefixed with apn_, so yours should look something like apn_abc123. 5. Note your sheet ID. Section titled “5. Note your sheet ID” In the Google Sheet you’d like to access, copy the sheet ID from the URL bar. It’s the long string of characters between /d/ and /edit. 6. Fetch a Google Sheets access token and use it in your val. Section titled “6. Fetch a Google Sheets access token and use it in your val” In your val, fetch a fresh Google Sheets access token from Pipedream and use it to authenticate requests: ExampleRun in Val Town ↗ import { fetchJSON } from \"https://esm.town/v/stevekrouse/fetchJSON?v=41\"; const accountID = \"\"; const sheetID = \"\"; const baseURL = `https://sheets.googleapis.com/v4/spreadsheets/${sheetID}/values`; async function fetchAccessToken() { const response = await fetch( `https://api.pipedream.com/v1/accounts/${accountID}?include_credentials=1`, { headers: { Authorization: `Bearer ${Deno.env.get(\"pipedream_api_key\")}`, }, } ); if (!response.ok) { throw new Error(`Error fetching access token: ${response.statusText}`); } const { data } = await response.json(); return data.credentials.oauth_access_token; } async function makeSheetsRequest(url, method, body = null) { const accessToken = await fetchAccessToken(); const options: RequestInit = { method, headers: { Authorization: `Bearer ${accessToken}`, }, }; if (body) { options.body = JSON.stringify(body); } return fetchJSON(url, options); } // Write data to a sheet. await makeSheetsRequest( `${baseURL}/A1:C1:append?valueInputOption=RAW`, \"POST\", { values: [[Date(), Math.random(), 1]] } ); // Read data from a sheet. const data = await makeSheetsRequest( `${baseURL}/A1:C1?majorDimension=ROWS`, \"GET\". ); console.log(data.values[0]); Use your own Google Cloud service account. Section titled “Use your own Google Cloud service account” Authenticating with the Google Sheets API is a bit tricky, but we walk you through it below. It should only take a few minutes, and only needs to be done once. Google recommends OAuth2 server to server authentication for bot-based applications. We will walk you through creating a Google Cloud service account, giving it access to one of your Google Sheets, and using its key to make authenticated requests to the Google Sheets API. 1. Create a Google Cloud service account. Section titled “1. Create a Google Cloud service account” Creating a Google Cloud service account is the recommended way to authenticate to the Google Sheets API. a. Create a Google Cloud project. Section titled “a. Create a Google Cloud project” Open the Google Cloud console and click on the Select a project dropdown in the top left. In the dialog that pops up, click on the New project button. Choose any name for the project name, then click Create. b. Enable the Google Sheets API. Section titled “b. Enable the Google Sheets API” Open the Google Sheets API page, then double check if the correct project is selected. Once you have made sure that you are using the correct project, click Enable. c. Create a service account. Section titled “c. Create a service account” On the left of the screen, click on Credentials. On the bar at the top, click on the Create credentials button, then select Service account. Enter any name for the Service account name. You may also enter a description, as you see fit. Save the email address for later, as it will be required to add the service account to a Google Sheet. Click Done, as granting permissions to this service account is not required. d. Create a service account key. Section titled “d. Create a service account key” To the right of the screen, open the menu on the newly created service account, and click Manage keys. Click Add key, then Create new key. Click Create key. Leave the type as JSON. You will get a JSON file in your downloads directory. e. Import the key into Val Town. Section titled “e. Import the key into Val Town” Open the service account key JSON file in a text editor, and copy the full contents. Open the Environment Variables page, then click New env variable. Set the key to a name like google_service_account, then paste the entire JSON data into the value. Once you are finished, click Add. 2. Create a sheet and grant access. Section titled “2. Create a sheet and grant access” Open Google Sheets and create a new empty sheet or open an existing one. Click the Share button, then paste your service account’s email into the dialog. Make sure it is added as an editor, and optionally disable “Notify people”. Lastly, copy the sheet ID from the URL bar. It’s the long string of characters between /d/ and /edit. 3. Create a val to send data. Section titled “3. Create a val to send data” To interact with the Google Sheets API, use the @mattx.gsheet_call wrapper. This automates requesting an access token from Google to access the Google Sheets API. It requires 4 arguments: The contents of your service account JSON file: in almost all cases, this should be retrieved from environment variables using - for example, Deno.env.get(\"google_service_account\"). The sheet ID. The action to perform: This parameter is the part of the URL that comes after https://sheets.googleapis.com/v4/spreadsheets/{spreadsheetId}/, along with any URL parameters that might be required (often this is valueInputOption). For example, for spreadsheets.values.append, this will be values/{range}:append?valueInputOption=RAW, where {range} needs to be substituted for a range like A1:C3. You can find a list of available actions in the Google Sheets API reference. The request body: In the same example as above, the request body could be {values: [[1, 2, 3]]}. Notice that this is an array of arrays, in line with the API documentation. Here is an example of what the above looks like when put together: ExampleRun in Val Town ↗ import { gsheet_call } from \"https://esm.town/v/mattx/gsheet_call\"; // Appending to a sheet. await gsheet_call( Deno.env.get(\"google_sa\"), \"1LDgOhO6Fxg2wt5rGFH29t6XYbmKe6fXI7fLSFaqZkDA\", \"POST\", \"values/A1:C1:append?valueInputOption=RAW\", { values: [[Date(), Math.random(), 1]] } ); // Reading from the top of the sheet. const data = await gsheet_call( Deno.env.get(\"google_sa\"), \"1LDgOhO6Fxg2wt5rGFH29t6XYbmKe6fXI7fLSFaqZkDA\", \"GET\", \"values/A1:C1?majorDimension=ROWS\", {} ); console.log(data[\"values\"][0]);",1360,{"_336":337,"_338":339,"_270":340},"image","/_astro/pipedream-api-key.BzovfhSL_ZCJnN9.webp","image_alt","API Key","Store data in a Google Sheet",[342,343,347,352,356,360,364,368,372,376,380,385,389,393,397,401,405],{"_275":276,"_104":277,"_278":340,"_279":32},{"_275":281,"_104":344,"_278":345,"_279":346},"use-pipedreams-accounts-api","Use Pipedream’s Accounts API",91,{"_275":348,"_104":349,"_278":350,"_279":351},"h3","1-sign-up-for-pipedream-and-retrieve-your-api-key","1. Sign up for Pipedream and retrieve your API key",208,{"_275":348,"_104":353,"_278":354,"_279":355},"2-add-that-key-as-a-val-town-environment-variable","2. Add that key as a Val Town environment variable",267,{"_275":348,"_104":357,"_278":358,"_279":359},"3-connect-your-google-sheets-account-in-pipedream","3. Connect your Google Sheets account in Pipedream",309,{"_275":348,"_104":361,"_278":362,"_279":363},"4-copy-the-account-id","4. Copy the account ID",367,{"_275":348,"_104":365,"_278":366,"_279":367},"5-note-your-sheet-id","5. Note your sheet ID",406,{"_275":348,"_104":369,"_278":370,"_279":371},"6-fetch-a-google-sheets-access-token-and-use-it-in-your-val","6. Fetch a Google Sheets access token and use it in your val",444,{"_275":281,"_104":373,"_278":374,"_279":375},"use-your-own-google-cloud-service-account","Use your own Google Cloud service account",628,{"_275":348,"_104":377,"_278":378,"_279":379},"1-create-a-google-cloud-service-account","1. Create a Google Cloud service account",718,{"_275":381,"_104":382,"_278":383,"_279":384},"h4","a-create-a-google-cloud-project","a. Create a Google Cloud project",751,{"_275":381,"_104":386,"_278":387,"_279":388},"b-enable-the-google-sheets-api","b. Enable the Google Sheets API",804,{"_275":381,"_104":390,"_278":391,"_279":392},"c-create-a-service-account","c. Create a service account",847,{"_275":381,"_104":394,"_278":395,"_279":396},"d-create-a-service-account-key","d. Create a service account key",934,{"_275":381,"_104":398,"_278":399,"_279":400},"e-import-the-key-into-val-town","e. Import the key into Val Town",992,{"_275":348,"_104":402,"_278":403,"_279":404},"2-create-a-sheet-and-grant-access","2. Create a sheet and grant access",1057,{"_275":348,"_104":406,"_278":407,"_279":408},"3-create-a-val-to-send-data","3. Create a val to send data",1132,[410,411,413,415,417,419,421,423,425,427,429,433,435,437,439,441,443,445,447,449,451,453,455,457,460,462,464,466,468,470,472,474,476,478,480,482,484,486,488,490,492,494,496,498,500],{"_287":288,"_289":290,"_279":260},{"_287":145,"_289":292,"_279":412},42,{"_287":145,"_289":292,"_279":414},58,{"_287":145,"_289":292,"_279":416},77,{"_287":145,"_289":292,"_279":418},103,{"_287":145,"_289":292,"_279":420},113,{"_287":145,"_289":292,"_279":422},136,{"_287":145,"_289":292,"_279":424},142,{"_287":145,"_289":292,"_279":426},161,{"_287":145,"_289":292,"_279":428},190,{"_287":430,"_289":431,"_279":432},5,7329.3047,272,{"_287":145,"_289":292,"_279":434},284,{"_287":430,"_289":431,"_279":436},446,{"_287":145,"_289":292,"_279":438},461,{"_287":145,"_289":292,"_279":440},476,{"_287":145,"_289":292,"_279":442},600,{"_287":145,"_289":292,"_279":444},617,{"_287":145,"_289":292,"_279":446},651,{"_287":145,"_289":292,"_279":448},665,{"_287":145,"_289":292,"_279":450},691,{"_287":430,"_289":431,"_279":452},720,{"_287":145,"_289":292,"_279":454},729,{"_287":145,"_289":292,"_279":456},735,{"_287":458,"_289":459,"_279":384},4,4690.755,{"_287":458,"_289":459,"_279":461},753,{"_287":145,"_289":292,"_279":463},759,{"_287":145,"_289":292,"_279":465},761,{"_287":145,"_289":292,"_279":467},775,{"_287":458,"_289":459,"_279":469},849,{"_287":145,"_289":292,"_279":471},856,{"_287":145,"_289":292,"_279":473},896,{"_287":145,"_289":292,"_279":475},919,{"_287":458,"_289":459,"_279":477},936,{"_287":145,"_289":292,"_279":479},944,{"_287":145,"_289":292,"_279":481},985,{"_287":145,"_289":292,"_279":483},1016,{"_287":145,"_289":292,"_279":485},1038,{"_287":430,"_289":431,"_279":487},1059,{"_287":145,"_289":292,"_279":489},1068,{"_287":145,"_289":292,"_279":491},1078,{"_287":430,"_289":431,"_279":493},1134,{"_287":145,"_289":292,"_279":495},1143,{"_287":145,"_289":292,"_279":497},1248,{"_287":145,"_289":292,"_279":499},1255,{"_287":145,"_289":292,"_279":501},1325,[260,412,414,416,418,420,422,424,426,428,432,434,436,438,440,442,444,446,448,450,452,454,456,384,461,463,465,467,469,471,473,475,477,479,481,483,485,487,489,491,493,495,497,499,501],"Store data in a Google Sheet. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. You can send data to Google Sheets from a val. You can collect data from incoming HTTP requests or from an HTTP endpoint on a schedule. You have two options for authenticating with the Google Sheets API: Use Pipedream’s Accounts API to fetch a fresh OAuth access token at runtime. Use your own Google Cloud service account. Use Pipedream’s Accounts API. Section titled “Use Pipedream’s Accounts API” Pipedream provides a workflow automation product for developers. Workflows are built as a sequence of steps — pre-built actions for thousands of APIs or custom code — triggered by an event (HTTP request, timer, when a new row is added to a Google Sheets, and more). Pipedream also manages the OAuth token refresh process for apps like Google Sheets, exposing a fresh access token in the workflow runtime and the Accounts API. If you connect your Google Sheets account to Pipedream, you can use the Accounts API to fetch a fresh token within your val and use that token to authenticate requests to the Google Sheets API. 1. Sign up for Pipedream and retrieve your API key. Section titled “1. Sign up for Pipedream and retrieve your API key” Sign up for Pipedream and visit https://pipedream.com/settings/user. Find the API Key section and copy your key: You’ll use this key to authenticate requests to the Accounts API, letting you fetch Google Sheets access tokens in your val. 2. Add that key as a Val Town environment variable. Section titled “2. Add that key as a Val Town environment variable” Add the API key as an environment variable in Val Town. In this example, we’ve named the environment variable pipedream_api_key: 3. Connect your Google Sheets account in Pipedream. Section titled “3. Connect your Google Sheets account in Pipedream” Visit https://pipedream.com/accounts. Click the Connect an app button at the top-right: You’ll be directed through the OAuth authorization process to connect your Google Sheets account to Pipedream. Once you’ve connected your account, you’ll see it listed on the Accounts page. 4. Copy the account ID. Section titled “4. Copy the account ID” Click the … to the right of the account and Copy Account ID: All account IDs are prefixed with apn_, so yours should look something like apn_abc123. 5. Note your sheet ID. Section titled “5. Note your sheet ID” In the Google Sheet you’d like to access, copy the sheet ID from the URL bar. It’s the long string of characters between /d/ and /edit. 6. Fetch a Google Sheets access token and use it in your val. Section titled “6. Fetch a Google Sheets access token and use it in your val” In your val, fetch a fresh Google Sheets access token from Pipedream and use it to authenticate requests: ExampleRun in Val Town ↗ import { fetchJSON } from \"https://esm.town/v/stevekrouse/fetchJSON?v=41\"; const accountID = \"<YOUR ACCOUNT ID HERE>\"; const sheetID = \"<YOUR SHEET ID HERE>\"; const baseURL = `https://sheets.googleapis.com/v4/spreadsheets/${sheetID}/values`; async function fetchAccessToken() { const response = await fetch( `https://api.pipedream.com/v1/accounts/${accountID}?include_credentials=1`, { headers: { Authorization: `Bearer ${Deno.env.get(\"pipedream_api_key\")}`, }, } ); if (!response.ok) { throw new Error(`Error fetching access token: ${response.statusText}`); } const { data } = await response.json(); return data.credentials.oauth_access_token; } async function makeSheetsRequest(url, method, body = null) { const accessToken = await fetchAccessToken(); const options: RequestInit = { method, headers: { Authorization: `Bearer ${accessToken}`, }, }; if (body) { options.body = JSON.stringify(body); } return fetchJSON(url, options); } // Write data to a sheet. await makeSheetsRequest( `${baseURL}/A1:C1:append?valueInputOption=RAW`, \"POST\", { values: [[Date(), Math.random(), 1]] } ); // Read data from a sheet. const data = await makeSheetsRequest( `${baseURL}/A1:C1?majorDimension=ROWS`, \"GET\". ); console.log(data.values[0]); Use your own Google Cloud service account. Section titled “Use your own Google Cloud service account” Authenticating with the Google Sheets API is a bit tricky, but we walk you through it below. It should only take a few minutes, and only needs to be done once. Google recommends OAuth2 server to server authentication for bot-based applications. We will walk you through creating a Google Cloud service account, giving it access to one of your Google Sheets, and using its key to make authenticated requests to the Google Sheets API. 1. Create a Google Cloud service account. Section titled “1. Create a Google Cloud service account” Creating a Google Cloud service account is the recommended way to authenticate to the Google Sheets API. a. Create a Google Cloud project. Section titled “a. Create a Google Cloud project” Open the Google Cloud console and click on the Select a project dropdown in the top left. In the dialog that pops up, click on the New project button. Choose any name for the project name, then click Create. b. Enable the Google Sheets API. Section titled “b. Enable the Google Sheets API” Open the Google Sheets API page, then double check if the correct project is selected. Once you have made sure that you are using the correct project, click Enable. c. Create a service account. Section titled “c. Create a service account” On the left of the screen, click on Credentials. On the bar at the top, click on the Create credentials button, then select Service account. Enter any name for the Service account name. You may also enter a description, as you see fit. Save the email address for later, as it will be required to add the service account to a Google Sheet. Click Done, as granting permissions to this service account is not required. d. Create a service account key. Section titled “d. Create a service account key” To the right of the screen, open the menu on the newly created service account, and click Manage keys. Click Add key, then Create new key. Click Create key. Leave the type as JSON. You will get a JSON file in your downloads directory. e. Import the key into Val Town. Section titled “e. Import the key into Val Town” Open the service account key JSON file in a text editor, and copy the full contents. Open the Environment Variables page, then click New env variable. Set the key to a name like google_service_account, then paste the entire JSON data into the value. Once you are finished, click Add. 2. Create a sheet and grant access. Section titled “2. Create a sheet and grant access” Open Google Sheets and create a new empty sheet or open an existing one. Click the Share button, then paste your service account’s email into the dialog. Make sure it is added as an editor, and optionally disable “Notify people”. Lastly, copy the sheet ID from the URL bar. It’s the long string of characters between /d/ and /edit. 3. Create a val to send data. Section titled “3. Create a val to send data” To interact with the Google Sheets API, use the @mattx.gsheet_call wrapper. This automates requesting an access token from Google to access the Google Sheets API. It requires 4 arguments: The contents of your service account JSON file: in almost all cases, this should be retrieved from environment variables using - for example, Deno.env.get(\"google_service_account\"). The sheet ID. The action to perform: This parameter is the part of the URL that comes after https://sheets.googleapis.com/v4/spreadsheets/{spreadsheetId}/, along with any URL parameters that might be required (often this is valueInputOption). For example, for spreadsheets.values.append, this will be values/{range}:append?valueInputOption=RAW, where {range} needs to be substituted for a range like A1:C3. You can find a list of available actions in the Google Sheets API reference. The request body: In the same example as above, the request body could be {values: [[1, 2, 3]]}. Notice that this is an array of arrays, in line with the API documentation. Here is an example of what the above looks like when put together: ExampleRun in Val Town ↗ import { gsheet_call } from \"https://esm.town/v/mattx/gsheet_call\"; // Appending to a sheet. await gsheet_call( Deno.env.get(\"google_sa\"), \"1LDgOhO6Fxg2wt5rGFH29t6XYbmKe6fXI7fLSFaqZkDA\", \"POST\", \"values/A1:C1:append?valueInputOption=RAW\", { values: [[Date(), Math.random(), 1]] } ); // Reading from the top of the sheet. const data = await gsheet_call( Deno.env.get(\"google_sa\"), \"1LDgOhO6Fxg2wt5rGFH29t6XYbmKe6fXI7fLSFaqZkDA\", \"GET\", \"values/A1:C1?majorDimension=ROWS\", {} ); console.log(data[\"values\"][0]);","/guides/google-sheets/","data in a Google Sheet. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions",[507,516,528,536,547,556,565,576,586,595,603,612],{"_270":340,"_106":508,"_315":509,"_284":510,"_304":515,"_309":505},"https://docs.val.town/guides/google-sheets/#_top",{"_275":276,"_104":277,"_278":340,"_279":32},[511,512,513,514],{"_287":288,"_289":290,"_279":260},{"_287":145,"_289":292,"_279":412},{"_287":145,"_289":292,"_279":414},{"_287":145,"_289":292,"_279":416},[260,412,414,416],{"_270":345,"_106":517,"_315":518,"_284":519,"_304":526,"_309":527},"https://docs.val.town/guides/google-sheets/#use-pipedreams-accounts-api",{"_275":281,"_104":344,"_278":345,"_279":346},[520,521,522,523,524,525],{"_287":145,"_289":292,"_279":418},{"_287":145,"_289":292,"_279":420},{"_287":145,"_289":292,"_279":422},{"_287":145,"_289":292,"_279":424},{"_287":145,"_289":292,"_279":426},{"_287":145,"_289":292,"_279":428},[418,420,422,424,426,428],"as a sequence of steps — pre-built actions for thousands of APIs or custom code — triggered by an event (HTTP request, timer, when a new row is added to",{"_270":354,"_106":529,"_315":530,"_284":531,"_304":534,"_309":535},"https://docs.val.town/guides/google-sheets/#2-add-that-key-as-a-val-town-environment-variable",{"_275":348,"_104":353,"_278":354,"_279":355},[532,533],{"_287":430,"_289":431,"_279":432},{"_287":145,"_289":292,"_279":434},[432,434],"2. Add that key as a Val Town environment variable. Section titled “2. Add that key as a Val Town environment variable” Add the API key as an environment variable",{"_270":370,"_106":537,"_315":538,"_284":539,"_304":545,"_309":546},"https://docs.val.town/guides/google-sheets/#6-fetch-a-google-sheets-access-token-and-use-it-in-your-val",{"_275":348,"_104":369,"_278":370,"_279":371},[540,541,542,543,544],{"_287":430,"_289":431,"_279":436},{"_287":145,"_289":292,"_279":438},{"_287":145,"_289":292,"_279":440},{"_287":145,"_289":292,"_279":442},{"_287":145,"_289":292,"_279":444},[436,438,440,442,444],"Fetch a Google Sheets access token and use it in your val. Section titled “6. Fetch a Google Sheets access token and use it in your val” In your val,",{"_270":374,"_106":548,"_315":549,"_284":550,"_304":554,"_309":555},"https://docs.val.town/guides/google-sheets/#use-your-own-google-cloud-service-account",{"_275":281,"_104":373,"_278":374,"_279":375},[551,552,553],{"_287":145,"_289":292,"_279":446},{"_287":145,"_289":292,"_279":448},{"_287":145,"_289":292,"_279":450},[446,448,450],"account” Authenticating with the Google Sheets API is a bit tricky, but we walk you through it below. It should only take a few minutes, and only needs to be",{"_270":378,"_106":557,"_315":558,"_284":559,"_304":563,"_309":564},"https://docs.val.town/guides/google-sheets/#1-create-a-google-cloud-service-account",{"_275":348,"_104":377,"_278":378,"_279":379},[560,561,562],{"_287":430,"_289":431,"_279":452},{"_287":145,"_289":292,"_279":454},{"_287":145,"_289":292,"_279":456},[452,454,456],"1. Create a Google Cloud service account. Section titled “1. Create a Google Cloud service account” Creating a Google Cloud service account is the recommended way to authenticate to the",{"_270":383,"_106":566,"_315":567,"_284":568,"_304":574,"_309":575},"https://docs.val.town/guides/google-sheets/#a-create-a-google-cloud-project",{"_275":381,"_104":382,"_278":383,"_279":384},[569,570,571,572,573],{"_287":458,"_289":459,"_279":384},{"_287":458,"_289":459,"_279":461},{"_287":145,"_289":292,"_279":463},{"_287":145,"_289":292,"_279":465},{"_287":145,"_289":292,"_279":467},[384,461,463,465,467],"a. Create a Google Cloud project. Section titled “a. Create a Google Cloud project” Open the Google Cloud console and click on the Select a project dropdown in the top",{"_270":391,"_106":577,"_315":578,"_284":579,"_304":584,"_309":585},"https://docs.val.town/guides/google-sheets/#c-create-a-service-account",{"_275":381,"_104":390,"_278":391,"_279":392},[580,581,582,583],{"_287":458,"_289":459,"_279":469},{"_287":145,"_289":292,"_279":471},{"_287":145,"_289":292,"_279":473},{"_287":145,"_289":292,"_279":475},[469,471,473,475],"Create a service account. Section titled “c. Create a service account” On the left of the screen, click on Credentials. On the bar at the top, click on the Create",{"_270":395,"_106":587,"_315":588,"_284":589,"_304":593,"_309":594},"https://docs.val.town/guides/google-sheets/#d-create-a-service-account-key",{"_275":381,"_104":394,"_278":395,"_279":396},[590,591,592],{"_287":458,"_289":459,"_279":477},{"_287":145,"_289":292,"_279":479},{"_287":145,"_289":292,"_279":481},[477,479,481],"Create a service account key. Section titled “d. Create a service account key” To the right of the screen, open the menu on the newly created service account, and click",{"_270":399,"_106":596,"_315":597,"_284":598,"_304":601,"_309":602},"https://docs.val.town/guides/google-sheets/#e-import-the-key-into-val-town",{"_275":381,"_104":398,"_278":399,"_279":400},[599,600],{"_287":145,"_289":292,"_279":483},{"_287":145,"_289":292,"_279":485},[483,485],"key JSON file in a text editor, and copy the full contents. Open the Environment Variables page, then click New env variable. Set the key to a name like google_service_account,",{"_270":403,"_106":604,"_315":605,"_284":606,"_304":610,"_309":611},"https://docs.val.town/guides/google-sheets/#2-create-a-sheet-and-grant-access",{"_275":348,"_104":402,"_278":403,"_279":404},[607,608,609],{"_287":430,"_289":431,"_279":487},{"_287":145,"_289":292,"_279":489},{"_287":145,"_289":292,"_279":491},[487,489,491],"2. Create a sheet and grant access. Section titled “2. Create a sheet and grant access” Open Google Sheets and create a new empty sheet or open an existing one.",{"_270":407,"_106":613,"_315":614,"_284":615,"_304":621,"_309":622},"https://docs.val.town/guides/google-sheets/#3-create-a-val-to-send-data",{"_275":348,"_104":406,"_278":407,"_279":408},[616,617,618,619,620],{"_287":430,"_289":431,"_279":493},{"_287":145,"_289":292,"_279":495},{"_287":145,"_289":292,"_279":497},{"_287":145,"_289":292,"_279":499},{"_287":145,"_289":292,"_279":501},[493,495,497,499,501],"Create a val to send data. Section titled “3. Create a val to send data” To interact with the Google Sheets API, use the @mattx.gsheet_call wrapper. This automates requesting an",{"_106":624,"_112":625,"_266":626,"_268":627,"_272":629,"_284":646,"_304":682,"_306":683,"_307":684,"_309":685,"_311":686},"https://docs.val.town/guides/save-html-form-data/","Save HTML form data. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. You can submit forms to Val Town using an HTTP trigger. You can place these forms on any page on the internet - or host the form directly on Val Town. These examples show how to accept and store email addresses on Val Town. The email addresses are saved into a val, and you also get sent an email notification for each new signup. Add a form to your website. Section titled “Add a form to your website” Create an HTTP trigger. Section titled “Create an HTTP trigger” Write a val function that accepts a Request and returns a Response. Add the form to your webpage. Section titled “Add the form to your webpage” Copy your val’s Web endpoint URL using the menu (Endpoints > Copy web endpoint) and set it as the form’s action (this tells the form where to send its data when it’s submitted). Below is a full HTML page example. If you are adding a form to an existing page just copy and paste the block. Email Form Host your form on Val Town. Section titled “Host your form on Val Town” There are two ways to do this. You can write a val function that serves a webpage, and a separate val that accepts the form data - or you can write a single val that does both like the example below. When a form is submitted, it sends a HTTP request with the POST method. When a user visits a webpage in their web browser, the server (your val function) gets sent a GET request. You can check the HTTP method using req.method and change how your val function responds. See Web forms — Working with user data on the MDN Web Docs site for more help with forms. Forms are a basic part of the web - you don’t need a lot of front-end JavaScript to make them work.",386,{"_270":628},"Save HTML form data",[630,631,635,638,642],{"_275":276,"_104":277,"_278":628,"_279":32},{"_275":281,"_104":632,"_278":633,"_279":634},"add-a-form-to-your-website","Add a form to your website",96,{"_275":348,"_104":636,"_278":637,"_279":283},"create-an-http-trigger","Create an HTTP trigger",{"_275":348,"_104":639,"_278":640,"_279":641},"add-the-form-to-your-webpage","Add the form to your webpage",132,{"_275":281,"_104":643,"_278":644,"_279":645},"host-your-form-on-val-town","Host your form on Val Town",242,[647,649,650,652,654,656,658,660,661,663,665,667,669,671,673,675,677,679,680],{"_287":145,"_289":292,"_279":648},82,{"_287":299,"_289":300,"_279":297},{"_287":145,"_289":292,"_279":651},105,{"_287":145,"_289":292,"_279":653},121,{"_287":145,"_289":292,"_279":655},126,{"_287":145,"_289":292,"_279":657},130,{"_287":145,"_289":292,"_279":659},181,{"_287":145,"_289":292,"_279":428},{"_287":145,"_289":292,"_279":662},266,{"_287":145,"_289":292,"_279":664},271,{"_287":145,"_289":292,"_279":666},274,{"_287":145,"_289":292,"_279":668},287,{"_287":145,"_289":292,"_279":670},298,{"_287":145,"_289":292,"_279":672},304,{"_287":145,"_289":292,"_279":674},312,{"_287":145,"_289":292,"_279":676},315,{"_287":145,"_289":292,"_279":678},328,{"_287":145,"_289":292,"_279":363},{"_287":145,"_289":292,"_279":681},377,[648,297,651,653,655,657,659,428,662,664,666,668,670,672,674,676,678,363,681],"Save HTML form data. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. You can submit forms to Val Town using an HTTP trigger. You can place these forms on any page on the internet - or host the form directly on Val Town. These examples show how to accept and store email addresses on Val Town. The email addresses are saved into a val, and you also get sent an email notification for each new signup. Add a form to your website. Section titled “Add a form to your website” Create an HTTP trigger. Section titled “Create an HTTP trigger” Write a val function that accepts a Request and returns a Response. Add the form to your webpage. Section titled “Add the form to your webpage” Copy your val’s Web endpoint URL using the menu (Endpoints > Copy web endpoint) and set it as the form’s action (this tells the form where to send its data when it’s submitted). Below is a full HTML page example. If you are adding a form to an existing page just copy and paste the <form></form> block. <!DOCTYPE html> <html> <head> <title>Email Form</title> </head> <body>  <form action=\"https://user-saveFormData.web.val.run\" method=\"post\"> <label for=\"email\">Email:</label> <input type=\"email\" id=\"email\" name=\"email\" required /> <br /> <input type=\"submit\" value=\"Submit\" /> </form> </body> </html> Host your form on Val Town. Section titled “Host your form on Val Town” There are two ways to do this. You can write a val function that serves a webpage, and a separate val that accepts the form data - or you can write a single val that does both like the example below. When a form is submitted, it sends a HTTP request with the POST method. When a user visits a webpage in their web browser, the server (your val function) gets sent a GET request. You can check the HTTP method using req.method and change how your val function responds. See Web forms — Working with user data on the MDN Web Docs site for more help with forms. Forms are a basic part of the web - you don’t need a lot of front-end JavaScript to make them work.","/guides/save-html-form-data/","Add a form to your website. Section titled “Add a form to your website” Create an HTTP trigger. Section titled “Create an HTTP trigger” Write a val function that accepts",[687,694,702,711,719],{"_270":628,"_106":688,"_315":689,"_284":690,"_304":692,"_309":693},"https://docs.val.town/guides/save-html-form-data/#_top",{"_275":276,"_104":277,"_278":628,"_279":32},[691],{"_287":145,"_289":292,"_279":648},[648],"to accept and store email addresses on Val Town. The email addresses are saved into a val, and you also get sent an email notification for each new signup.",{"_270":633,"_106":695,"_315":696,"_284":697,"_304":700,"_309":701},"https://docs.val.town/guides/save-html-form-data/#add-a-form-to-your-website",{"_275":281,"_104":632,"_278":633,"_279":634},[698,699],{"_287":299,"_289":300,"_279":297},{"_287":145,"_289":292,"_279":651},[297,651],"Add a form to your website. Section titled “Add a form to your website”",{"_270":637,"_106":703,"_315":704,"_284":705,"_304":709,"_309":710},"https://docs.val.town/guides/save-html-form-data/#create-an-http-trigger",{"_275":348,"_104":636,"_278":637,"_279":283},[706,707,708],{"_287":145,"_289":292,"_279":653},{"_287":145,"_289":292,"_279":655},{"_287":145,"_289":292,"_279":657},[653,655,657],"Create an HTTP trigger. Section titled “Create an HTTP trigger” Write a val function that accepts a Request and returns a Response.",{"_270":640,"_106":712,"_315":713,"_284":714,"_304":717,"_309":718},"https://docs.val.town/guides/save-html-form-data/#add-the-form-to-your-webpage",{"_275":348,"_104":639,"_278":640,"_279":641},[715,716],{"_287":145,"_289":292,"_279":659},{"_287":145,"_289":292,"_279":428},[659,428],"form where to send its data when it’s submitted). Below is a full HTML page example. If you are adding a form to an existing page just copy and paste",{"_270":644,"_106":720,"_315":721,"_284":722,"_304":734,"_309":735},"https://docs.val.town/guides/save-html-form-data/#host-your-form-on-val-town",{"_275":281,"_104":643,"_278":644,"_279":645},[723,724,725,726,727,728,729,730,731,732,733],{"_287":145,"_289":292,"_279":662},{"_287":145,"_289":292,"_279":664},{"_287":145,"_289":292,"_279":666},{"_287":145,"_289":292,"_279":668},{"_287":145,"_289":292,"_279":670},{"_287":145,"_289":292,"_279":672},{"_287":145,"_289":292,"_279":674},{"_287":145,"_289":292,"_279":676},{"_287":145,"_289":292,"_279":678},{"_287":145,"_289":292,"_279":363},{"_287":145,"_289":292,"_279":681},[662,664,666,668,670,672,674,676,678,363,681],"write a single val that does both like the example below. When a form is submitted, it sends a HTTP request with the POST method. When a user visits a",{"_106":737,"_112":738,"_266":739,"_268":740,"_272":744,"_284":780,"_304":815,"_306":738,"_307":816,"_309":817,"_311":818},"https://docs.val.town/guides/discord/bot/","Discord welcome bot. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. You can create a Discord welcome bot using scheduled vals. In this example, a scheduled val gets the most recent members for your server and sends a DM to new users from a bot that you’ll create. It avoids messaging users who joined the server before the bot was added. When users reply to the bot, the message is forwarded as a DM. Create a new Discord application. Section titled “Create a new Discord application” Visit https://discord.com/developers/applications: Enable the server members intent. Section titled “Enable the server members intent” Since the bot will be requesting a list of guild members, you need to enable the SERVER MEMBERS INTENT on the Bot tab. Get your bot’s token. Section titled “Get your bot’s token” On the Bot tab, copy the TOKEN, and save it as a Val Town environment variable as discordBot. Create a link via the URL Generator. Section titled “Create a link via the URL Generator” On the OAuth2 tab, under URL Generator, select the bot scope, and give it permission to Send Messages, and then copy the GENERATED URL at the bottom of the page. Click on the generated link. Section titled “Click on the generated link” Choose the server you want to invite the bot to and press Continue. Get your Server ID. Section titled “Get your Server ID” Save your server id as a Val Town environment variable as discordServerId. (See: Where can I find my User/Server/Message ID?). Setup your welcome message scheduled val. Section titled “Setup your welcome message scheduled val” Remix this scheduled val that will send a welcome message to new users. This val stores state in three other vals. @me.discordWelcomeBotStartedAt stores the timestamp of the bot’s creation so that everyone who’s already on the server doesn’t get a welcome message when the bot is added. @me.discordWelcomedMembers stores the ids of everyone that has been messaged so that they don’t receive another message. @me.discordDMs stores the channel ids (each time the bot DMs a user it creates a channel) so that we can check for replies to the bot. These vals will be automatically created if they don’t already exist. Get your User ID. Section titled “Get your User ID” Save your user id as a Val Town environment variable as discordUserId. (See: Where can I find my User/Server/Message ID?). This is so the bot knows where to forward user replies. Set up your message forwarder scheduled val. Section titled “Set up your message forwarder scheduled val” Remix this scheduled val that will forward user replies to your Discord user. This val loops through all of the DMs between the bot and new users. It checks for any new replies and then forwards these messages as a new DM (from the bot, to your Discord user).",493,{"_336":741,"_338":742,"_270":743},"/_astro/create-an-app.CJ6V-7L5_Z5IxEi.webp","create-an-app.png","Discord welcome bot",[745,746,750,754,758,762,766,769,772,776],{"_275":276,"_104":277,"_278":743,"_279":32},{"_275":281,"_104":747,"_278":748,"_279":749},"create-a-new-discord-application","Create a new Discord application",94,{"_275":281,"_104":751,"_278":752,"_279":753},"enable-the-server-members-intent","Enable the server members intent",108,{"_275":281,"_104":755,"_278":756,"_279":757},"get-your-bots-token","Get your bot’s token",143,{"_275":281,"_104":759,"_278":760,"_279":761},"create-a-link-via-the-url-generator","Create a link via the URL Generator",171,{"_275":281,"_104":763,"_278":764,"_279":765},"click-on-the-generated-link","Click on the generated link",217,{"_275":281,"_104":767,"_278":768,"_279":645},"get-your-server-id","Get your Server ID",{"_275":281,"_104":770,"_278":771,"_279":432},"setup-your-welcome-message-scheduled-val","Setup your welcome message scheduled val",{"_275":281,"_104":773,"_278":774,"_279":775},"get-your-user-id","Get your User ID",387,{"_275":281,"_104":777,"_278":778,"_279":779},"set-up-your-message-forwarder-scheduled-val","Set up your message forwarder scheduled val",428,[781,783,785,787,789,791,793,795,796,798,800,801,803,805,807,809,811,813],{"_287":145,"_289":292,"_279":782},34,{"_287":145,"_289":292,"_279":784},44,{"_287":145,"_289":292,"_279":786},57,{"_287":145,"_289":292,"_279":788},63,{"_287":145,"_289":292,"_279":790},92,{"_287":299,"_289":300,"_279":792},95,{"_287":145,"_289":292,"_279":794},102,{"_287":145,"_289":292,"_279":655},{"_287":145,"_289":292,"_279":797},164,{"_287":299,"_289":300,"_279":799},172,{"_287":145,"_289":292,"_279":659},{"_287":145,"_289":292,"_279":802},257,{"_287":145,"_289":292,"_279":804},293,{"_287":145,"_289":292,"_279":806},325,{"_287":145,"_289":292,"_279":808},360,{"_287":145,"_289":292,"_279":810},364,{"_287":145,"_289":292,"_279":812},402,{"_287":145,"_289":292,"_279":814},483,[782,784,786,788,790,792,794,655,797,799,659,802,804,806,808,810,812,814],"/guides/discord/bot/","users reply to the bot, the message is forwarded as a DM. Create a new Discord application. Section titled “Create a new Discord application” Visit https://discord.com/developers/applications: Enable the server members",[819,830,838,845,852,860,867,877,884],{"_270":743,"_106":820,"_315":821,"_284":822,"_304":828,"_309":829},"https://docs.val.town/guides/discord/bot/#_top",{"_275":276,"_104":277,"_278":743,"_279":32},[823,824,825,826,827],{"_287":145,"_289":292,"_279":782},{"_287":145,"_289":292,"_279":784},{"_287":145,"_289":292,"_279":786},{"_287":145,"_289":292,"_279":788},{"_287":145,"_289":292,"_279":790},[782,784,786,788,790],"create a Discord welcome bot using scheduled vals. In this example, a scheduled val gets the most recent members for your server and sends a DM to new users from",{"_270":748,"_106":831,"_315":832,"_284":833,"_304":836,"_309":837},"https://docs.val.town/guides/discord/bot/#create-a-new-discord-application",{"_275":281,"_104":747,"_278":748,"_279":749},[834,835],{"_287":299,"_289":300,"_279":792},{"_287":145,"_289":292,"_279":794},[792,794],"Create a new Discord application. Section titled “Create a new Discord application” Visit https://discord.com/developers/applications:",{"_270":752,"_106":839,"_315":840,"_284":841,"_304":843,"_309":844},"https://docs.val.town/guides/discord/bot/#enable-the-server-members-intent",{"_275":281,"_104":751,"_278":752,"_279":753},[842],{"_287":145,"_289":292,"_279":655},[655],"Enable the server members intent. Section titled “Enable the server members intent” Since the bot will be requesting a list of guild members, you need to enable the SERVER MEMBERS",{"_270":756,"_106":846,"_315":847,"_284":848,"_304":850,"_309":851},"https://docs.val.town/guides/discord/bot/#get-your-bots-token",{"_275":281,"_104":755,"_278":756,"_279":757},[849],{"_287":145,"_289":292,"_279":797},[797],"Get your bot’s token. Section titled “Get your bot’s token” On the Bot tab, copy the TOKEN, and save it as a Val Town environment variable as discordBot.",{"_270":760,"_106":853,"_315":854,"_284":855,"_304":858,"_309":859},"https://docs.val.town/guides/discord/bot/#create-a-link-via-the-url-generator",{"_275":281,"_104":759,"_278":760,"_279":761},[856,857],{"_287":299,"_289":300,"_279":799},{"_287":145,"_289":292,"_279":659},[799,659],"Create a link via the URL Generator. Section titled “Create a link via the URL Generator” On the OAuth2 tab, under URL Generator, select the bot scope, and give it",{"_270":768,"_106":861,"_315":862,"_284":863,"_304":865,"_309":866},"https://docs.val.town/guides/discord/bot/#get-your-server-id",{"_275":281,"_104":767,"_278":768,"_279":645},[864],{"_287":145,"_289":292,"_279":802},[802],"Get your Server ID. Section titled “Get your Server ID” Save your server id as a Val Town environment variable as discordServerId. (See: Where can I find my User/Server/Message ID?).",{"_270":771,"_106":868,"_315":869,"_284":870,"_304":875,"_309":876},"https://docs.val.town/guides/discord/bot/#setup-your-welcome-message-scheduled-val",{"_275":281,"_104":770,"_278":771,"_279":432},[871,872,873,874],{"_287":145,"_289":292,"_279":804},{"_287":145,"_289":292,"_279":806},{"_287":145,"_289":292,"_279":808},{"_287":145,"_289":292,"_279":810},[804,806,808,810],"receive another message. @me.discordDMs stores the channel ids (each time the bot DMs a user it creates a channel) so that we can check for replies to the bot. These",{"_270":774,"_106":878,"_315":879,"_284":880,"_304":882,"_309":883},"https://docs.val.town/guides/discord/bot/#get-your-user-id",{"_275":281,"_104":773,"_278":774,"_279":775},[881],{"_287":145,"_289":292,"_279":812},[812],"Get your User ID. Section titled “Get your User ID” Save your user id as a Val Town environment variable as discordUserId. (See: Where can I find my User/Server/Message ID?).",{"_270":778,"_106":885,"_315":886,"_284":887,"_304":889,"_309":890},"https://docs.val.town/guides/discord/bot/#set-up-your-message-forwarder-scheduled-val",{"_275":281,"_104":777,"_278":778,"_279":779},[888],{"_287":145,"_289":292,"_279":814},[814],"the DMs between the bot and new users. It checks for any new replies and then forwards these messages as a new DM (from the bot, to your Discord user).",{"_106":892,"_112":893,"_266":894,"_268":895,"_272":899,"_284":901,"_304":915,"_306":916,"_307":917,"_309":918,"_311":919},"https://docs.val.town/guides/github/get-a-github-user/","Get a Github user. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. For example, we can get a user without passing an authentication token. GitHub API endpoints have a cURL command that you can manually translate into a fetchJSON call (e.g. see Get a user). Here’s a Val that returns a GitHub user object for a given username: @vtdocs/getGithubUserRun in Val Town ↗ import { fetchJSON } from \"https://esm.town/v/stevekrouse/fetchJSON?v=41\"; export const getGithubUser = async (username: string) => { const user = await fetchJSON( `https://api.github.com/users/${username}`, ); return user; }; You can alter it, or just call it directly like this: Usage of @vtdocs/getGithubUserRun in Val Town ↗ import { getGithubUser } from \"https://esm.town/v/vtdocs/getGithubUser\"; console.log(await getGithubUser(\"stevekrouse\")); You can also do this with octokit.js. Reminder: import npm packages by prepending the package name with npm:. Usage of npm:@octokit/coreRun in Val Town ↗ import { Octokit } from \"npm:@octokit/core\"; export const getGithubUserViaOctokit = async (username: string) => { const octokit = new Octokit(); const user = await octokit.request(\"GET /users/{username}\", { username, headers: { \"X-GitHub-Api-Version\": \"2022-11-28\", }, }); return user; };",196,{"_336":896,"_338":897,"_270":898},"/_astro/screenshot_2023-06-13_at_003949.BqmkiaHv_Z2wFQBF.webp","GitHub API endpoints have a cURL command that you can manually translate into a fetchJSON call (e.g. see Get a user). ","Get a Github user",[900],{"_275":276,"_104":277,"_278":898,"_279":32},[902,903,905,907,908,909,911,913],{"_287":288,"_289":290,"_279":145},{"_287":145,"_289":292,"_279":904},37,{"_287":145,"_289":292,"_279":906},48,{"_287":145,"_289":292,"_279":786},{"_287":145,"_289":292,"_279":788},{"_287":145,"_289":292,"_279":910},66,{"_287":145,"_289":292,"_279":912},70,{"_287":145,"_289":292,"_279":914},75,[145,904,906,786,788,910,912,914],"Get a Github user. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. For example, we can get a user without passing an authentication token. GitHub API endpoints have a cURL command that you can manually translate into a fetchJSON call (e.g. see Get a user). Here’s a Val that returns a GitHub user object for a given username: @vtdocs/getGithubUserRun in Val Town ↗ import { fetchJSON } from \"https://esm.town/v/stevekrouse/fetchJSON?v=41\"; export const getGithubUser = async (username: string) => { const user = await fetchJSON( `https://api.github.com/users/${username}`, ); return user; }; You can alter it, or just call it directly like this: Usage of @vtdocs/getGithubUserRun in Val Town ↗ import { getGithubUser } from \"https://esm.town/v/vtdocs/getGithubUser\"; console.log(await getGithubUser(\"stevekrouse\")); You can also do this with octokit.js. Reminder: import npm packages by prepending the package name with npm:. Usage of npm:@octokit/coreRun in Val Town ↗ import { Octokit } from \"npm:@octokit/core\"; export const getGithubUserViaOctokit = async (username: string) => { const octokit = new Octokit(); const user = await octokit.request(\"GET /users/{username}\", { username, headers: { \"X-GitHub-Api-Version\": \"2022-11-28\", }, }); return user; };","/guides/github/get-a-github-user/","Get a Github user. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about",[920],{"_270":898,"_106":921,"_315":922,"_284":923,"_304":932,"_309":918},"https://docs.val.town/guides/github/get-a-github-user/#_top",{"_275":276,"_104":277,"_278":898,"_279":32},[924,925,926,927,928,929,930,931],{"_287":288,"_289":290,"_279":145},{"_287":145,"_289":292,"_279":904},{"_287":145,"_289":292,"_279":906},{"_287":145,"_289":292,"_279":786},{"_287":145,"_289":292,"_279":788},{"_287":145,"_289":292,"_279":910},{"_287":145,"_289":292,"_279":912},{"_287":145,"_289":292,"_279":914},[145,904,906,786,788,910,912,914],{"_106":934,"_112":935,"_266":936,"_268":937,"_272":941,"_284":958,"_304":973,"_306":974,"_307":975,"_309":976,"_311":977},"https://docs.val.town/guides/slack/send-messages-to-slack/","Sending Slack messages. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. Time to complete: 5 minutes. This guide walks you through sending your first Slack message from Val Town. This guide uses Slack’s incoming webhooks to send messages to a Slack channel. For more complex interactions, like responding to user messages or handling buttons, check out our Slack bot guide. 1. Create a Slack app & webhook. Section titled “1. Create a Slack app & webhook” Click here to create a new Slack app. Click From Scratch. Type an App Name. Select your Slack workspace. Click Incoming Webhooks in the left sidebar of your app (under Features). Toggle Activate Incoming Webhooks to On. Click Add New Webhook at the bottom of the page. Select your target channel. Copy the Webhook URL from Slack. (Bonus) Customize the App icon under Basic Information in the left sidebar (Val Town icons). 2. Add the webhook URL to Val Town. Section titled “2. Add the webhook URL to Val Town” Click Environment Variables in your val’s left sidebar. Add a new env variable with key: SLACK_WEBHOOK_URL. Paste the webhook URL you copied from Slack as the value. 3. Send a message. Section titled “3. Send a message” Now you’re ready to send your first message to Slack! Send messageRun in Val Town ↗ import { IncomingWebhook } from \"npm:@slack/webhook\"; const slack = new IncomingWebhook(Deno.env.get(\"SLACK_WEBHOOK_URL\")); const EDIT = `<${import.meta.url.replace(\"esm\", \"val\")}|(edit val)>`; await slack.send(`🥳 Hi from Val Town! ${EDIT}`); We recommend including this link to the edit val, so everyone on your team is one click away from making changes. What’s next? Section titled “What’s next?” Learn how to make your message fancy with advanced formatting. Take this a step further by responding to mentions, slash commands, buttons, and other user interactions with our full Slack bot guide! You can find more Slack examples on our Templates page.",332,{"_336":938,"_338":939,"_270":940},"/_astro/app.B3GwB_87_Z2inKHC.webp","Create Slack app","Sending Slack messages",[942,943,947,951,955],{"_275":276,"_104":277,"_278":940,"_279":32},{"_275":281,"_104":944,"_278":945,"_279":946},"1-create-a-slack-app--webhook","1. Create a Slack app & webhook",80,{"_275":281,"_104":948,"_278":949,"_279":950},"2-add-the-webhook-url-to-val-town","2. Add the webhook URL to Val Town",168,{"_275":281,"_104":952,"_278":953,"_279":954},"3-send-a-message","3. Send a message",213,{"_275":281,"_104":956,"_278":957,"_279":434},"whats-next","What’s next?",[959,961,962,963,965,967,969,971],{"_287":145,"_289":292,"_279":960},59,{"_287":299,"_289":300,"_279":648},{"_287":145,"_289":292,"_279":346},{"_287":145,"_289":292,"_279":964},100,{"_287":145,"_289":292,"_279":966},195,{"_287":299,"_289":300,"_279":968},215,{"_287":145,"_289":292,"_279":970},221,{"_287":145,"_289":292,"_279":972},302,[960,648,346,964,966,968,970,972],"Sending Slack messages. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. Time to complete: 5 minutes. This guide walks you through sending your first Slack message from Val Town. This guide uses Slack’s incoming webhooks to send messages to a Slack channel. For more complex interactions, like responding to user messages or handling buttons, check out our Slack bot guide. 1. Create a Slack app & webhook. Section titled “1. Create a Slack app & webhook” Click here to create a new Slack app. Click From Scratch. Type an App Name. Select your Slack workspace. Click Incoming Webhooks in the left sidebar of your app (under Features). Toggle Activate Incoming Webhooks to On. Click Add New Webhook at the bottom of the page. Select your target channel. Copy the Webhook URL from Slack. (Bonus) Customize the App icon under Basic Information in the left sidebar (Val Town icons). 2. Add the webhook URL to Val Town. Section titled “2. Add the webhook URL to Val Town” Click Environment Variables in your val’s left sidebar. Add a new env variable with key: SLACK_WEBHOOK_URL. Paste the webhook URL you copied from Slack as the value. 3. Send a message. Section titled “3. Send a message” Now you’re ready to send your first message to Slack! Send messageRun in Val Town ↗ import { IncomingWebhook } from \"npm:@slack/webhook\"; const slack = new IncomingWebhook(Deno.env.get(\"SLACK_WEBHOOK_URL\")); const EDIT = `<${import.meta.url.replace(\"esm\", \"val\")}|(edit val)>`; await slack.send(`🥳 Hi from Val Town! ${EDIT}`); We recommend including this link to the edit val, so everyone on your team is one click away from making changes. What’s next? Section titled “What’s next?” Learn how to make your message fancy with advanced formatting. Take this a step further by responding to mentions, slash commands, buttons, and other user interactions with our full Slack bot guide! You can find more Slack examples on our Templates page.","/guides/slack/send-messages-to-slack/","our Slack bot guide. 1. Create a Slack app & webhook. Section titled “1. Create a Slack app & webhook” Click here to create a new Slack app. Click From",[978,985,994,1001,1009],{"_270":940,"_106":979,"_315":980,"_284":981,"_304":983,"_309":984},"https://docs.val.town/guides/slack/send-messages-to-slack/#_top",{"_275":276,"_104":277,"_278":940,"_279":32},[982],{"_287":145,"_289":292,"_279":960},[960],"Slack message from Val Town. This guide uses Slack’s incoming webhooks to send messages to a Slack channel. For more complex interactions, like responding to user messages or handling buttons,",{"_270":945,"_106":986,"_315":987,"_284":988,"_304":992,"_309":993},"https://docs.val.town/guides/slack/send-messages-to-slack/#1-create-a-slack-app--webhook",{"_275":281,"_104":944,"_278":945,"_279":946},[989,990,991],{"_287":299,"_289":300,"_279":648},{"_287":145,"_289":292,"_279":346},{"_287":145,"_289":292,"_279":964},[648,346,964],"1. Create a Slack app & webhook. Section titled “1. Create a Slack app & webhook” Click here to create a new Slack app. Click From Scratch. Type an App",{"_270":949,"_106":995,"_315":996,"_284":997,"_304":999,"_309":1000},"https://docs.val.town/guides/slack/send-messages-to-slack/#2-add-the-webhook-url-to-val-town",{"_275":281,"_104":948,"_278":949,"_279":950},[998],{"_287":145,"_289":292,"_279":966},[966],"2. Add the webhook URL to Val Town. Section titled “2. Add the webhook URL to Val Town” Click Environment Variables in your val’s left sidebar. Add a new env",{"_270":953,"_106":1002,"_315":1003,"_284":1004,"_304":1007,"_309":1008},"https://docs.val.town/guides/slack/send-messages-to-slack/#3-send-a-message",{"_275":281,"_104":952,"_278":953,"_279":954},[1005,1006],{"_287":299,"_289":300,"_279":968},{"_287":145,"_289":292,"_279":970},[968,970],"3. Send a message. Section titled “3. Send a message” Now you’re ready to send your first message to Slack! Send messageRun in Val Town ↗ import { IncomingWebhook }",{"_270":957,"_106":1010,"_315":1011,"_284":1012,"_304":1014,"_309":1015},"https://docs.val.town/guides/slack/send-messages-to-slack/#whats-next",{"_275":281,"_104":956,"_278":957,"_279":434},[1013],{"_287":145,"_289":292,"_279":972},[972],"What’s next? Section titled “What’s next?” Learn how to make your message fancy with advanced formatting. Take this a step further by responding to mentions, slash commands, buttons, and other",{"_106":1017,"_112":1018,"_266":1019,"_268":1020,"_272":1024,"_284":1084,"_304":1113,"_306":1018,"_307":1114,"_309":1115,"_311":1116},"https://docs.val.town/guides/databases/supabase/","Supabase. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. Supabase provide a hosted Postgres database with 500MB of storage in the free tier. You can query and create data inside your vals using either Supabase’s JavaScript SDK, or a Postgres client. Using the SDK. Section titled “Using the SDK” 1. Sign up to Supabase. Section titled “1. Sign up to Supabase” Visit https://supabase.com/dashboard/sign-up. 2. Create a project. Section titled “2. Create a project” On Supabase’s dashboard, create a new project. 3. Get your API URL and service role key. Section titled “3. Get your API URL and service role key” Go to your project’s Settings via the sidebar. Inside API, scroll down and copy the Project URL, and then, inside Project API Keys, copy the service role secret. Save these as two separate Val Town environment variables as supabaseURL and supabaseKey respectively. 4. Create your first table. Section titled “4. Create your first table” Head to the Table editor in the sidebar. Create a new table called my_first_table with the following schema. 5. Insert some data. Section titled “5. Insert some data” Copy and paste the following val to insert some data. Data insertionRun in Val Town ↗ import { createClient } from \"https://esm.sh/@supabase/supabase-js@2\"; const supabase = createClient( Deno.env.get(\"supabaseURL\"), Deno.env.get(\"supabaseKey\"). ); const { data, error } = await supabase. .from(\"my_first_table\"). .insert({ name: \"Alice\", data: { job: \"software engineer\" } }); console.log(data, error); 6. Query back that data. Section titled “6. Query back that data” Get back the data you just inserted by using eq() (like SQL’s WHERE). Data queryRun in Val Town ↗ import { createClient } from \"https://esm.sh/@supabase/supabase-js@2\"; const supabase = createClient( Deno.env.get(\"supabaseURL\"), Deno.env.get(\"supabaseKey\"). ); const { data, error } = await supabase. .from(\"my_first_table\"). .select(\"name, data\"). .eq(\"name\", \"Alice\"). .limit(1); if (error) { throw error; } console.log(data); 7. Keep going! Section titled “7. Keep going!” Use Supabase’s JavaScript Client library documentation to write more queries! Using a Postgres client. Section titled “Using a Postgres client” 1. Sign up to Supabase. Section titled “1. Sign up to Supabase” Visit https://supabase.com/dashboard/sign-up. 2. Create a project. Section titled “2. Create a project” On Supabase’s dashboard, create a new project. Keep a note of your database password, you’ll need this to create a database connection string. 3. Get your database’s connection string. Section titled “3. Get your database’s connection string” Go to your project’s Settings via the sidebar. Inside Database, scroll down and copy the Connection string for Nodejs. Replace [YOUR-PASSWORD] (removing the square brackets) with your database password (alternatively, reset your database password to create a new one). Save this connection string as a Val Town environment variable as supabasePostgres. 4. Create your first table. Section titled “4. Create your first table” Copy and paste this val to create a table with the given schema. Table creationRun in Val Town ↗ import { supaBaseQuery } from \"https://esm.town/v/vtdocs/supaBaseQuery\"; await supaBaseQuery( Deno.env.get(\"supabasePostgres\"), `create table my_first_table ( id bigint generated by default as identity primary key, inserted_at timestamp with time zone default timezone('utc'::text, now()) not null, updated_at timestamp with time zone default timezone('utc'::text, now()) not null, data jsonb, name text. );` ); 5. Insert some data. Section titled “5. Insert some data” Use a prepared statement like below to prevent SQL injection. Data insertionRun in Val Town ↗ import { supaBaseQuery } from \"https://esm.town/v/vtdocs/supaBaseQuery\"; await supaBaseQuery( Deno.env.get(\"supabasePostgres\"), `INSERT INTO MY_FIRST_TABLE (NAME, DATA) VALUES ($1, $2);`, [\"Alice\", '{\"job\": \"software engineer\"}'] ); 6. Query back that data. Section titled “6. Query back that data” Usually, you’ll just want the rows property from the response. Data queryRun in Val Town ↗ import { supaBaseQuery } from \"https://esm.town/v/vtdocs/supaBaseQuery\"; const data = await supaBaseQuery( Deno.env.get(\"supabasePostgres\"), `SELECT NAME, DATA FROM MY_FIRST_TABLE WHERE NAME = $1;`, [\"Alice\"] ); console.log(data); 7. More resources. Section titled “7. More resources” Learn more about the Deno Postgres client used in this guide, view the Supabase Database documentation, or get help on Val Town’s Discord.",667,{"_336":1021,"_338":1022,"_270":1023},"/_astro/screenshot_2023-07-02_at_131928.sOxtJuic_1zqghw.webp","Screenshot 2023-07-02 at 13.19.28.png","Supabase",[1025,1026,1030,1034,1038,1041,1045,1049,1053,1057,1061,1064,1067,1071,1074,1077,1080],{"_275":276,"_104":277,"_278":1023,"_279":32},{"_275":281,"_104":1027,"_278":1028,"_279":1029},"using-the-sdk","Using the SDK",61,{"_275":348,"_104":1031,"_278":1032,"_279":1033},"1-sign-up-to-supabase","1. Sign up to Supabase",69,{"_275":348,"_104":1035,"_278":1036,"_279":1037},"2-create-a-project","2. Create a project",83,{"_275":348,"_104":1039,"_278":1040,"_279":964},"3-get-your-api-url-and-service-role-key","3. Get your API URL and service role key",{"_275":348,"_104":1042,"_278":1043,"_279":1044},"4-create-your-first-table","4. Create your first table",162,{"_275":348,"_104":1046,"_278":1047,"_279":1048},"5-insert-some-data","5. Insert some data",192,{"_275":348,"_104":1050,"_278":1051,"_279":1052},"6-query-back-that-data","6. Query back that data",252,{"_275":348,"_104":1054,"_278":1055,"_279":1056},"7-keep-going","7. Keep going!",317,{"_275":281,"_104":1058,"_278":1059,"_279":1060},"using-a-postgres-client","Using a Postgres client",335,{"_275":348,"_104":1062,"_278":1032,"_279":1063},"1-sign-up-to-supabase-1",345,{"_275":348,"_104":1065,"_278":1036,"_279":1066},"2-create-a-project-1",359,{"_275":348,"_104":1068,"_278":1069,"_279":1070},"3-get-your-databases-connection-string","3. Get your database’s connection string",392,{"_275":348,"_104":1072,"_278":1043,"_279":1073},"4-create-your-first-table-1",457,{"_275":348,"_104":1075,"_278":1047,"_279":1076},"5-insert-some-data-1",536,{"_275":348,"_104":1078,"_278":1051,"_279":1079},"6-query-back-that-data-1",584,{"_275":348,"_104":1081,"_278":1082,"_279":1083},"7-more-resources","7. More resources",636,[1085,1087,1088,1090,1091,1092,1094,1096,1098,1100,1101,1103,1104,1106,1108,1110,1111],{"_287":145,"_289":292,"_279":1086},31,{"_287":145,"_289":292,"_279":414},{"_287":430,"_289":431,"_279":1089},85,{"_287":145,"_289":292,"_279":346},{"_287":145,"_289":292,"_279":297},{"_287":145,"_289":292,"_279":1093},183,{"_287":299,"_289":300,"_279":1095},336,{"_287":145,"_289":292,"_279":1097},342,{"_287":430,"_289":431,"_279":1099},361,{"_287":145,"_289":292,"_279":363},{"_287":145,"_289":292,"_279":1102},373,{"_287":145,"_289":292,"_279":681},{"_287":145,"_289":292,"_279":1105},388,{"_287":145,"_289":292,"_279":1107},442,{"_287":145,"_289":292,"_279":1109},450,{"_287":145,"_289":292,"_279":440},{"_287":145,"_289":292,"_279":1112},547,[1086,414,1089,346,297,1093,1095,1097,1099,363,1102,681,1105,1107,1109,440,1112],"/guides/databases/supabase/","more queries! Using a Postgres client. Section titled “Using a Postgres client” 1. Sign up to Supabase. Section titled “1. Sign up to Supabase” Visit https://supabase.com/dashboard/sign-up. 2. Create a project.",[1117,1125,1134,1141,1149,1160,1168,1175],{"_270":1023,"_106":1118,"_315":1119,"_284":1120,"_304":1123,"_309":1124},"https://docs.val.town/guides/databases/supabase/#_top",{"_275":276,"_104":277,"_278":1023,"_279":32},[1121,1122],{"_287":145,"_289":292,"_279":1086},{"_287":145,"_289":292,"_279":414},[1086,414],"Supabase provide a hosted Postgres database with 500MB of storage in the free tier. You can query and create data inside your vals using either Supabase’s JavaScript SDK, or a",{"_270":1036,"_106":1126,"_315":1127,"_284":1128,"_304":1132,"_309":1133},"https://docs.val.town/guides/databases/supabase/#2-create-a-project",{"_275":348,"_104":1035,"_278":1036,"_279":1037},[1129,1130,1131],{"_287":430,"_289":431,"_279":1089},{"_287":145,"_289":292,"_279":346},{"_287":145,"_289":292,"_279":297},[1089,346,297],"2. Create a project. Section titled “2. Create a project” On Supabase’s dashboard, create a new project.",{"_270":1043,"_106":1135,"_315":1136,"_284":1137,"_304":1139,"_309":1140},"https://docs.val.town/guides/databases/supabase/#4-create-your-first-table",{"_275":348,"_104":1042,"_278":1043,"_279":1044},[1138],{"_287":145,"_289":292,"_279":1093},[1093],"4. Create your first table. Section titled “4. Create your first table” Head to the Table editor in the sidebar. Create a new table called my_first_table with the following schema.",{"_270":1059,"_106":1142,"_315":1143,"_284":1144,"_304":1147,"_309":1148},"https://docs.val.town/guides/databases/supabase/#using-a-postgres-client",{"_275":281,"_104":1058,"_278":1059,"_279":1060},[1145,1146],{"_287":299,"_289":300,"_279":1095},{"_287":145,"_289":292,"_279":1097},[1095,1097],"Using a Postgres client. Section titled “Using a Postgres client”",{"_270":1036,"_106":1150,"_315":1151,"_284":1152,"_304":1158,"_309":1159},"https://docs.val.town/guides/databases/supabase/#2-create-a-project-1",{"_275":348,"_104":1065,"_278":1036,"_279":1066},[1153,1154,1155,1156,1157],{"_287":430,"_289":431,"_279":1099},{"_287":145,"_289":292,"_279":363},{"_287":145,"_289":292,"_279":1102},{"_287":145,"_289":292,"_279":681},{"_287":145,"_289":292,"_279":1105},[1099,363,1102,681,1105],"2. Create a project. Section titled “2. Create a project” On Supabase’s dashboard, create a new project. Keep a note of your database password, you’ll need this to create a",{"_270":1069,"_106":1161,"_315":1162,"_284":1163,"_304":1166,"_309":1167},"https://docs.val.town/guides/databases/supabase/#3-get-your-databases-connection-string",{"_275":348,"_104":1068,"_278":1069,"_279":1070},[1164,1165],{"_287":145,"_289":292,"_279":1107},{"_287":145,"_289":292,"_279":1109},[1107,1109],"with your database password (alternatively, reset your database password to create a new one). Save this connection string as a Val Town environment variable as supabasePostgres.",{"_270":1043,"_106":1169,"_315":1170,"_284":1171,"_304":1173,"_309":1174},"https://docs.val.town/guides/databases/supabase/#4-create-your-first-table-1",{"_275":348,"_104":1072,"_278":1043,"_279":1073},[1172],{"_287":145,"_289":292,"_279":440},[440],"4. Create your first table. Section titled “4. Create your first table” Copy and paste this val to create a table with the given schema. Table creationRun in Val Town",{"_270":1047,"_106":1176,"_315":1177,"_284":1178,"_304":1180,"_309":1181},"https://docs.val.town/guides/databases/supabase/#5-insert-some-data-1",{"_275":348,"_104":1075,"_278":1047,"_279":1076},[1179],{"_287":145,"_289":292,"_279":1112},[1112],"5. Insert some data. Section titled “5. Insert some data” Use a prepared statement like below to prevent SQL injection. Data insertionRun in Val Town ↗ import { supaBaseQuery }",{"_106":1183,"_112":1184,"_266":1095,"_268":1185,"_272":1187,"_284":1219,"_304":1230,"_306":1184,"_307":1231,"_309":1232,"_311":1233},"https://docs.val.town/guides/slack/bot/","Build a Slack bot. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. Time to complete: 10 minutes. This guide walks you through building a Slack bot that responds to mentions in channels. If you just want to send simple Slack messages without interactivity, check out our Slack webhook guide. Step 1: Remix the bot template. Section titled “Step 1: Remix the bot template” Remix this val to get started: Copy the HTTP endpoint URL (via the … menu for main.tsx) - this is where Slack will send events to your Val Town bot. Step 2: Create a Slack app. Section titled “Step 2: Create a Slack app” Go to Slack API and create a new app From Scratch. Name your app and select your workspace. Step 3: Add environment variables. Section titled “Step 3: Add environment variables” In your val’s sidebar, add these Environment Variables: slackVerificationToken: From Settings → Basic Information → Verification Token. slackToken: Leave empty (you’ll fill this after installing). Step 4: Set up events. Section titled “Step 4: Set up events” Go to Features → Event Subscriptions. Enable events and paste your val’s HTTP endpoint in Request URL. Subscribe to app_mention under Subscribe to bot events. Step 5: Set bot permissions. Section titled “Step 5: Set bot permissions” In OAuth & Permissions → Scopes, add: app_mentions:read (should already be there). chat:write. Step 6: Install your app. Section titled “Step 6: Install your app” Go to Settings → Install App and install to your workspace. Step 7: Add OAuth token. Section titled “Step 7: Add OAuth token” Copy the Bot User OAuth Token from OAuth & Permissions. Update your val’s slackToken environment variable. Step 8: Test your bot. Section titled “Step 8: Test your bot” Invite the bot to a channel Mention the bot - it will reply! What’s next? Section titled “What’s next?” You can find more Slack examples on our Templates page.",{"_336":938,"_338":939,"_270":1186},"Build a Slack bot",[1188,1189,1192,1195,1199,1202,1206,1210,1213,1217],{"_275":276,"_104":277,"_278":1186,"_279":32},{"_275":281,"_104":1190,"_278":1191,"_279":1033},"step-1-remix-the-bot-template","Step 1: Remix the bot template",{"_275":281,"_104":1193,"_278":1194,"_279":420},"step-2-create-a-slack-app","Step 2: Create a Slack app",{"_275":281,"_104":1196,"_278":1197,"_279":1198},"step-3-add-environment-variables","Step 3: Add environment variables",145,{"_275":281,"_104":1200,"_278":1201,"_279":267},"step-4-set-up-events","Step 4: Set up events",{"_275":281,"_104":1203,"_278":1204,"_279":1205},"step-5-set-bot-permissions","Step 5: Set bot permissions",219,{"_275":281,"_104":1207,"_278":1208,"_279":1209},"step-6-install-your-app","Step 6: Install your app",244,{"_275":281,"_104":1211,"_278":1212,"_279":355},"step-7-add-oauth-token","Step 7: Add OAuth token",{"_275":281,"_104":1214,"_278":1215,"_279":1216},"step-8-test-your-bot","Step 8: Test your bot",295,{"_275":281,"_104":956,"_278":957,"_279":1218},320,[1220,1221,1223,1224,1226,1228],{"_287":288,"_289":290,"_279":145},{"_287":145,"_289":292,"_279":1222},43,{"_287":299,"_289":300,"_279":303},{"_287":145,"_289":292,"_279":1225},124,{"_287":145,"_289":292,"_279":1227},133,{"_287":145,"_289":292,"_279":1229},311,[145,1222,303,1225,1227,1229],"/guides/slack/bot/","Build a Slack bot. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about",[1234,1241,1250],{"_270":1186,"_106":1235,"_315":1236,"_284":1237,"_304":1240,"_309":1232},"https://docs.val.town/guides/slack/bot/#_top",{"_275":276,"_104":277,"_278":1186,"_279":32},[1238,1239],{"_287":288,"_289":290,"_279":145},{"_287":145,"_289":292,"_279":1222},[145,1222],{"_270":1194,"_106":1242,"_315":1243,"_284":1244,"_304":1248,"_309":1249},"https://docs.val.town/guides/slack/bot/#step-2-create-a-slack-app",{"_275":281,"_104":1193,"_278":1194,"_279":420},[1245,1246,1247],{"_287":299,"_289":300,"_279":303},{"_287":145,"_289":292,"_279":1225},{"_287":145,"_289":292,"_279":1227},[303,1225,1227],"Step 2: Create a Slack app. Section titled “Step 2: Create a Slack app” Go to Slack API and create a new app From Scratch. Name your app and select",{"_270":1215,"_106":1251,"_315":1252,"_284":1253,"_304":1255,"_309":1256},"https://docs.val.town/guides/slack/bot/#step-8-test-your-bot",{"_275":281,"_104":1214,"_278":1215,"_279":1216},[1254],{"_287":145,"_289":292,"_279":1229},[1229],"Step 8: Test your bot. Section titled “Step 8: Test your bot” Invite the bot to a channel Mention the bot - it will reply!",{"_106":1258,"_112":1259,"_266":1260,"_268":1261,"_272":1265,"_284":1292,"_304":1305,"_306":1259,"_307":1306,"_309":1307,"_311":1308},"https://docs.val.town/guides/databases/planetscale/","PlanetScale. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. PlanetScale once provided a hosted MySQL database with 5GB of storage included in the free tier. On April 8, 2024, the free plan was retired and the cheapest plan starts at $39 with 10GB storage. 1. Sign up to PlanetScale. Section titled “1. Sign up to PlanetScale” Go to https://auth.planetscale.com/sign-up. 2. Create a new database. Section titled “2. Create a new database” Select New database on the dashboard. Create a database. 3. Create a password. Section titled “3. Create a password” Go to Settings → Passwords and click New password. Save the host, username, and password values as Val Town environment variables - use planetScaleHost, planetScaleUsername, and planetScalePassword respectively. 4. Create your first table. Section titled “4. Create your first table” Copy and paste this val to create a table with the given schema. Table creationRun in Val Town ↗ import { queryPlanetScale } from \"https://esm.town/v/vtdocs/queryPlanetScale\"; await queryPlanetScale( { host: Deno.env.get(\"planetScaleHost\"), username: Deno.env.get(\"planetScaleUsername\"), password: Deno.env.get(\"planetScalePassword\"), }, `CREATE TABLE stock ( id int NOT NULL AUTO_INCREMENT PRIMARY KEY, name varchar(255) NOT NULL, price varchar(255) NOT NULL. );` ); 5. Insert an item. Section titled “5. Insert an item” Insert one or more items. Data insertionRun in Val Town ↗ import { queryPlanetScale } from \"https://esm.town/v/vtdocs/queryPlanetScale\"; await queryPlanetScale( { host: Deno.env.get(\"planetScaleHost\"), username: Deno.env.get(\"planetScaleUsername\"), password: Deno.env.get(\"planetScalePassword\"), }, `INSERT INTO stock (name, price) VALUES (?, ?);`, [\"banana\", 15] ); 6. Query an item. Section titled “6. Query an item” Use the rows property to get your query results - or log the entire results object to see what other data is available. Query stock tableRun in Val Town ↗ import { queryPlanetScale } from \"https://esm.town/v/vtdocs/queryPlanetScale\"; const results = await queryPlanetScale( { host: Deno.env.get(\"planetScaleHost\"), username: Deno.env.get(\"planetScaleUsername\"), password: Deno.env.get(\"planetScalePassword\"), }, `SELECT id, name, price FROM stock WHERE name=?`, [\"banana\"] ); console.log(results.rows[0]); 7. Do more than queries! Section titled “7. Do more than queries!” Read the source of the @vtdocs/queryPlanetScale helper, see how it uses the @planetscale/database SDK, refer to the driver’s documentation, and extend it!",358,{"_336":1262,"_338":1263,"_270":1264},"/_astro/screenshot_2023-06-25_at_214325.BmyNOcz0_25EgO.webp","Screenshot 2023-06-25 at 21.43.25.png","PlanetScale",[1266,1267,1271,1275,1278,1280,1284,1288],{"_275":276,"_104":277,"_278":1264,"_279":32},{"_275":281,"_104":1268,"_278":1269,"_279":1270},"1-sign-up-to-planetscale","1. Sign up to PlanetScale",64,{"_275":281,"_104":1272,"_278":1273,"_279":1274},"2-create-a-new-database","2. Create a new database",79,{"_275":281,"_104":1276,"_278":1277,"_279":964},"3-create-a-password","3. Create a password",{"_275":281,"_104":1042,"_278":1043,"_279":1279},138,{"_275":281,"_104":1281,"_278":1282,"_279":1283},"5-insert-an-item","5. Insert an item",206,{"_275":281,"_104":1285,"_278":1286,"_279":1287},"6-query-an-item","6. Query an item",254,{"_275":281,"_104":1289,"_278":1290,"_279":1291},"7-do-more-than-queries","7. Do more than queries!",324,[1293,1295,1297,1299,1301,1302,1303],{"_287":145,"_289":292,"_279":1294},32,{"_287":299,"_289":300,"_279":1296},81,{"_287":145,"_289":292,"_279":1298},88,{"_287":145,"_289":292,"_279":1300},98,{"_287":299,"_289":300,"_279":794},{"_287":145,"_289":292,"_279":753},{"_287":145,"_289":292,"_279":1304},157,[1294,1296,1298,1300,794,753,1304],"/guides/databases/planetscale/","2. Create a new database. Section titled “2. Create a new database” Select New database on the dashboard. Create a database. 3. Create a password. Section titled “3. Create a",[1309,1316,1325,1333],{"_270":1264,"_106":1310,"_315":1311,"_284":1312,"_304":1314,"_309":1315},"https://docs.val.town/guides/databases/planetscale/#_top",{"_275":276,"_104":277,"_278":1264,"_279":32},[1313],{"_287":145,"_289":292,"_279":1294},[1294],"page as plain text. Open in ChatGPT Ask questions about this page. PlanetScale once provided a hosted MySQL database with 5GB of storage included in the free tier. On April",{"_270":1273,"_106":1317,"_315":1318,"_284":1319,"_304":1323,"_309":1324},"https://docs.val.town/guides/databases/planetscale/#2-create-a-new-database",{"_275":281,"_104":1272,"_278":1273,"_279":1274},[1320,1321,1322],{"_287":299,"_289":300,"_279":1296},{"_287":145,"_289":292,"_279":1298},{"_287":145,"_289":292,"_279":1300},[1296,1298,1300],"2. Create a new database. Section titled “2. Create a new database” Select New database on the dashboard. Create a database.",{"_270":1277,"_106":1326,"_315":1327,"_284":1328,"_304":1331,"_309":1332},"https://docs.val.town/guides/databases/planetscale/#3-create-a-password",{"_275":281,"_104":1276,"_278":1277,"_279":964},[1329,1330],{"_287":299,"_289":300,"_279":794},{"_287":145,"_289":292,"_279":753},[794,753],"3. Create a password. Section titled “3. Create a password” Go to Settings → Passwords and click New password. Save the host, username, and password values as Val Town environment",{"_270":1043,"_106":1334,"_315":1335,"_284":1336,"_304":1338,"_309":1174},"https://docs.val.town/guides/databases/planetscale/#4-create-your-first-table",{"_275":281,"_104":1042,"_278":1043,"_279":1279},[1337],{"_287":145,"_289":292,"_279":1304},[1304],{"_106":1340,"_112":1341,"_266":1342,"_268":1343,"_272":1346,"_284":1386,"_304":1419,"_306":1420,"_307":1421,"_309":1422,"_311":1423},"https://docs.val.town/guides/discord/how-to-make-a-discord-bot-hosted-24-7-for-free-in-/","Discord bot. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. Introduction. Section titled “Introduction” By the end of this tutorial you will have a Discord bot hosted 24/7, for free, forever, on Val Town, that responds to a basic /ping Slash Command. Val Town is a social website to write, and deploy JavaScript from the browser. No prior coding experience required. The vast majority of this tutorial is creating the bot on Discord and pasting your keys into Val Town. The actual coding parts are just clicking Run two times to remix two pieces of code to your Val Town account. Note. 💡 If you get stuck, come join us in the Val Town Discord! Video Tutorial. Section titled “Video Tutorial” If you prefer videos, here’s this same tutorial in a 3-minute YouTube video. https://youtu.be/yYXmInPSSfg. Step 1: Create a Discord app. Section titled “Step 1: Create a Discord app” Go to the Discord Developer Portal and select “New Application” in the top right. Enter a name for your Bot, accept the terms and press Create. Step 2: Add the bot to your server. Section titled “Step 2: Add the bot to your server” To invite your new bot to your server, you need to generate a link to click on. Head to the Oauth2 > URL Generator page. Select the bot scope, then the Send Messages permission. Copy the URL at the bottom of the page and paste it into a new browser tab. Click through the steps until you’re prompted to choose your server and press Continue. Press Authorize. 🎉 Your bot is now a member of your server! Now let’s get it to respond to Slash Commands. Step 3: Login to Val Town. Section titled “Step 3: Login to Val Town” Val Town is a social website to write, run, and host JavaScript. You can create APIs, scheduled functions, email yourself, and persist small pieces of data — all from the browser and instantly deployed. There is a generous free plan, and no credit card required. Login or create an account. Step 4: Save bot secrets. Section titled “Step 4: Save bot secrets” Go to the “General Information” page. Copy your Application ID. Go to val.town/settings/environment-variables. Create a new environment variable called discordAppId and paste in the value. Copy your Public Key, saving it as discordPublicKey. Go to the Bot page. Click Reset Token and accept the warning. Copy and paste it in val.town/settings/environment-variables as discordBotToken. Step 5: Register a new Slash Command. Section titled “Step 5: Register a new Slash Command” The embedded code below should have your name in the top-left corner. If you see anonymous, refresh this page. If you still see anonymous, ensure you’re logged into Val Town. Press Run to add the /ping command to your bot. Register /ping commandRun in Val Town ↗ import { registerDiscordSlashCommand } from \"https://esm.town/v/neverstew/registerDiscordSlashCommand\"; const result = await registerDiscordSlashCommand( Deno.env.get(\"discordAppId\"), Deno.env.get(\"discordBotToken\"), { name: \"ping\", description: \"Say hi to your bot\", }, ); export const registerDiscordCommand = result.json(); Step 6: Listen for Slash Commands. Section titled “Step 6: Listen for Slash Commands” Press Run to listen for Slash Commands and reply. Next to your val’s name, click 🔒 > Unlisted. In the val above, in the bottom-left corner of the val, click Script and change it to HTTP. Click on the URL at the bottom of that val that looks like https://username-handleDiscordInteraction.web.val.run. Visit the General Information page for your bot and paste your copied endpoint into INTERACTIONS ENDPOINT URL and click Save Changes. 💬 Try it out. Section titled “💬 Try it out” Refresh Discord and try out your bot using /ping. Further Directions. Section titled “Further Directions” Now that you have a basic Discord Bot setup, you’ll want to customize it to do exactly what you want. You’ll probably want to: Register a new Slash Command. Connect your bot to APIs like OpenAI’s GPT or Dall-E. Come join us in the Val Town Discord if you get stuck, have questions, or want to show off your cool new bot!",692,{"_336":1344,"_338":1344,"_270":1345},"https://i.postimg.cc/bw5Xj8Rd/ping.gif","Discord bot",[1347,1348,1352,1356,1360,1363,1367,1371,1374,1378,1382],{"_275":276,"_104":277,"_278":1345,"_279":32},{"_275":281,"_104":1349,"_278":1350,"_279":1351},"introduction","Introduction",30,{"_275":281,"_104":1353,"_278":1354,"_279":1355},"video-tutorial","Video Tutorial",135,{"_275":281,"_104":1357,"_278":1358,"_279":1359},"step-1-create-a-discord-app","Step 1: Create a Discord app",155,{"_275":281,"_104":1361,"_278":1362,"_279":966},"step-2-add-the-bot-to-your-server","Step 2: Add the bot to your server",{"_275":281,"_104":1364,"_278":1365,"_279":1366},"step-3-login-to-val-town","Step 3: Login to Val Town",299,{"_275":281,"_104":1368,"_278":1369,"_279":1370},"step-4-save-bot-secrets","Step 4: Save bot secrets",363,{"_275":281,"_104":1372,"_278":1373,"_279":779},"step-5-register-a-new-slash-command","Step 5: Register a new Slash Command",{"_275":281,"_104":1375,"_278":1376,"_279":1377},"step-6-listen-for-slash-commands","Step 6: Listen for Slash Commands",520,{"_275":281,"_104":1379,"_278":1380,"_279":1381},"-try-it-out","💬 Try it out",605,{"_275":281,"_104":1383,"_278":1384,"_279":1385},"further-directions","Further Directions",624,[1387,1388,1389,1391,1393,1395,1397,1399,1401,1403,1405,1407,1409,1411,1413,1415,1417],{"_287":145,"_289":292,"_279":1222},{"_287":145,"_289":292,"_279":786},{"_287":145,"_289":292,"_279":1390},65,{"_287":145,"_289":292,"_279":1392},150,{"_287":299,"_289":300,"_279":1394},158,{"_287":145,"_289":292,"_279":1396},166,{"_287":145,"_289":292,"_279":1398},184,{"_287":145,"_289":292,"_279":1400},225,{"_287":145,"_289":292,"_279":1402},260,{"_287":145,"_289":292,"_279":1404},285,{"_287":145,"_289":292,"_279":1406},316,{"_287":145,"_289":292,"_279":1408},349,{"_287":145,"_289":292,"_279":1410},389,{"_287":299,"_289":300,"_279":1412},431,{"_287":145,"_289":292,"_279":1414},440,{"_287":145,"_289":292,"_279":1416},634,{"_287":145,"_289":292,"_279":1418},655,[1222,786,1390,1392,1394,1396,1398,1400,1402,1404,1406,1408,1410,1412,1414,1416,1418],"Discord bot. Copy page Copy page. Copy this page as Markdown for LLMs. View as Markdown View this page as plain text. Open in ChatGPT Ask questions about this page. Introduction. Section titled “Introduction” By the end of this tutorial you will have a Discord bot hosted 24/7, for free, forever, on Val Town, that responds to a basic /ping Slash Command. Val Town is a social website to write, and deploy JavaScript from the browser. No prior coding experience required. The vast majority of this tutorial is creating the bot on Discord and pasting your keys into Val Town. The actual coding parts are just clicking Run two times to remix two pieces of code to your Val Town account. Note. 💡 If you get stuck, come join us in the Val Town Discord! Video Tutorial. Section titled “Video Tutorial” If you prefer videos, here’s this same tutorial in a 3-minute YouTube video. https://youtu.be/yYXmInPSSfg. Step 1: Create a Discord app. Section titled “Step 1: Create a Discord app” Go to the Discord Developer Portal and select “New Application” in the top right. Enter a name for your Bot, accept the terms and press Create. Step 2: Add the bot to your server. Section titled “Step 2: Add the bot to your server” To invite your new bot to your server, you need to generate a link to click on. Head to the Oauth2 > URL Generator page. Select the bot scope, then the Send Messages permission. Copy the URL at the bottom of the page and paste it into a new browser tab. Click through the steps until you’re prompted to choose your server and press Continue. Press Authorize. 🎉 Your bot is now a member of your server! Now let’s get it to respond to Slash Commands. Step 3: Login to Val Town. Section titled “Step 3: Login to Val Town” Val Town is a social website to write, run, and host JavaScript. You can create APIs, scheduled functions, email yourself, and persist small pieces of data — all from the browser and instantly deployed. There is a generous free plan, and no credit card required. Login or create an account. Step 4: Save bot secrets. Section titled “Step 4: Save bot secrets” Go to the “General Information” page. Copy your Application ID. Go to val.town/settings/environment-variables. Create a new environment variable called discordAppId and paste in the value. Copy your Public Key, saving it as discordPublicKey. Go to the Bot page. Click Reset Token and accept the warning. Copy and paste it in val.town/settings/environment-variables as discordBotToken. Step 5: Register a new Slash Command. Section titled “Step 5: Register a new Slash Command” The embedded code below should have your name in the top-left corner. If you see anonymous, refresh this page. If you still see anonymous, ensure you’re logged into Val Town. Press Run to add the /ping command to your bot. Register /ping commandRun in Val Town ↗ import { registerDiscordSlashCommand } from \"https://esm.town/v/neverstew/registerDiscordSlashCommand\"; const result = await registerDiscordSlashCommand( Deno.env.get(\"discordAppId\"), Deno.env.get(\"discordBotToken\"), { name: \"ping\", description: \"Say hi to your bot\", }, ); export const registerDiscordCommand = result.json(); Step 6: Listen for Slash Commands. Section titled “Step 6: Listen for Slash Commands” Press Run to listen for Slash Commands and reply. Next to your val’s name, click 🔒 > Unlisted. In the val above, in the bottom-left corner of the val, click Script and change it to HTTP. Click on the URL at the bottom of that val that looks like https://username-handleDiscordInteraction.web.val.run. Visit the General Information page for your bot and paste your copied endpoint into INTERACTIONS ENDPOINT URL and click Save Changes. 💬 Try it out. Section titled “💬 Try it out” Refresh Discord and try out your bot using /ping. Further Directions. Section titled “Further Directions” Now that you have a basic Discord Bot setup, you’ll want to customize it to do exactly what you want. You’ll probably want to: Register a new Slash Command. Connect your bot to APIs like OpenAI’s GPT or Dall-E. Come join us in the Val Town Discord if you get stuck, have questions, or want to show off your cool new bot!","/guides/discord/how-to-make-a-discord-bot-hosted-24-7-for-free-in-/","prefer videos, here’s this same tutorial in a 3-minute YouTube video. https://youtu.be/yYXmInPSSfg. Step 1: Create a Discord app. Section titled “Step 1: Create a Discord app” Go to the Discord",[1424,1433,1440,1449,1458,1466,1473,1481],{"_270":1350,"_106":1425,"_315":1426,"_284":1427,"_304":1431,"_309":1432},"https://docs.val.town/guides/discord/how-to-make-a-discord-bot-hosted-24-7-for-free-in-/#introduction",{"_275":281,"_104":1349,"_278":1350,"_279":1351},[1428,1429,1430],{"_287":145,"_289":292,"_279":1222},{"_287":145,"_289":292,"_279":786},{"_287":145,"_289":292,"_279":1390},[1222,786,1390],"tutorial you will have a Discord bot hosted 24/7, for free, forever, on Val Town, that responds to a basic /ping Slash Command. Val Town is a social website to",{"_270":1354,"_106":1434,"_315":1435,"_284":1436,"_304":1438,"_309":1439},"https://docs.val.town/guides/discord/how-to-make-a-discord-bot-hosted-24-7-for-free-in-/#video-tutorial",{"_275":281,"_104":1353,"_278":1354,"_279":1355},[1437],{"_287":145,"_289":292,"_279":1392},[1392],"Video Tutorial. Section titled “Video Tutorial” If you prefer videos, here’s this same tutorial in a 3-minute YouTube video. https://youtu.be/yYXmInPSSfg.",{"_270":1358,"_106":1441,"_315":1442,"_284":1443,"_304":1447,"_309":1448},"https://docs.val.town/guides/discord/how-to-make-a-discord-bot-hosted-24-7-for-free-in-/#step-1-create-a-discord-app",{"_275":281,"_104":1357,"_278":1358,"_279":1359},[1444,1445,1446],{"_287":299,"_289":300,"_279":1394},{"_287":145,"_289":292,"_279":1396},{"_287":145,"_289":292,"_279":1398},[1394,1396,1398],"Step 1: Create a Discord app. Section titled “Step 1: Create a Discord app” Go to the Discord Developer Portal and select “New Application” in the top right. Enter a",{"_270":1362,"_106":1450,"_315":1451,"_284":1452,"_304":1456,"_309":1457},"https://docs.val.town/guides/discord/how-to-make-a-discord-bot-hosted-24-7-for-free-in-/#step-2-add-the-bot-to-your-server",{"_275":281,"_104":1361,"_278":1362,"_279":966},[1453,1454,1455],{"_287":145,"_289":292,"_279":1400},{"_287":145,"_289":292,"_279":1402},{"_287":145,"_289":292,"_279":1404},[1400,1402,1404],"paste it into a new browser tab. Click through the steps until you’re prompted to choose your server and press Continue. Press Authorize. 🎉 Your bot is now a member",{"_270":1365,"_106":1459,"_315":1460,"_284":1461,"_304":1464,"_309":1465},"https://docs.val.town/guides/discord/how-to-make-a-discord-bot-hosted-24-7-for-free-in-/#step-3-login-to-val-town",{"_275":281,"_104":1364,"_278":1365,"_279":1366},[1462,1463],{"_287":145,"_289":292,"_279":1406},{"_287":145,"_289":292,"_279":1408},[1406,1408],"“Step 3: Login to Val Town” Val Town is a social website to write, run, and host JavaScript. You can create APIs, scheduled functions, email yourself, and persist small pieces",{"_270":1369,"_106":1467,"_315":1468,"_284":1469,"_304":1471,"_309":1472},"https://docs.val.town/guides/discord/how-to-make-a-discord-bot-hosted-24-7-for-free-in-/#step-4-save-bot-secrets",{"_275":281,"_104":1368,"_278":1369,"_279":1370},[1470],{"_287":145,"_289":292,"_279":1410},[1410],"Step 4: Save bot secrets. Section titled “Step 4: Save bot secrets” Go to the “General Information” page. Copy your Application ID. Go to val.town/settings/environment-variables. Create a new environment variable",{"_270":1373,"_106":1474,"_315":1475,"_284":1476,"_304":1479,"_309":1480},"https://docs.val.town/guides/discord/how-to-make-a-discord-bot-hosted-24-7-for-free-in-/#step-5-register-a-new-slash-command",{"_275":281,"_104":1372,"_278":1373,"_279":779},[1477,1478],{"_287":299,"_289":300,"_279":1412},{"_287":145,"_289":292,"_279":1414},[1412,1414],"Step 5: Register a new Slash Command. Section titled “Step 5: Register a new Slash Command” The embedded code below should have your name in the top-left corner. If you",{"_270":1384,"_106":1482,"_315":1483,"_284":1484,"_304":1487,"_309":1488},"https://docs.val.town/guides/discord/how-to-make-a-discord-bot-hosted-24-7-for-free-in-/#further-directions",{"_275":281,"_104":1383,"_278":1384,"_279":1385},[1485,1486],{"_287":145,"_289":292,"_279":1416},{"_287":145,"_289":292,"_279":1418},[1416,1418],"Directions” Now that you have a basic Discord Bot setup, you’ll want to customize it to do exactly what you want. You’ll probably want to: Register a new Slash Command.","totalCount",193,"paginationCount","totalFileResults","totalProjectResults",22,"totalUserResults","totalDocResults",90,"executionTimeMs",1279,"results",{"_101":102,"_205":206,"_243":244,"_261":262,"_1492":1274,"_1493":1494,"_1495":225,"_1496":1497,"_94":145,"_1502":1503,"_1504":145,"_1505":100,"_1498":1499},"pageSize",10,"totalPages","resultType","actionData","errors"]

Search

Users2

Users
2