update readme with ngrok instructions

2026-03-18 21:40:27 +01:00 · 2022-04-04 10:32:24 -07:00
parent 1ea58eac8c
commit b4b0a2ce75
1 changed files with 67 additions and 8 deletions
--- a/README.md
+++ b/README.md
@@ -1,8 +1,8 @@
-# Getting started app for Discord
+# Getting Started app for Discord

-This project contains a basic Rock-Paper-Scissors-style Discord app built for the [getting started guide](TODO).
+This project contains a basic rock-paper-scissors-style Discord app written in JavaScript, built for the [getting started guide](TODO).

-A version of this code is also hosted [on Glitch](TODO).
+> ✨ A version of this code is also hosted **[on Glitch 🎏](https://glitch.com/edit/#!/getting-started-discord)**.

 ## Project structure
 Below is a basic overview of the project structure:
@@ -25,10 +25,69 @@ Below is a basic overview of the project structure:

 ## Running app locally

+Before you start, you'll need to [create a Discord app](https://discord.com/developers/applications) with the proper permissions:
+- `applications.commands`
+- `bot` (with Send Messages and Use Slash Commands enabled)

-## Resources
+Configuring the app is covered in detail in [the getting started guide](TODO).
+### Setup project
+
+First clone the project:
+```
+git clone https://github.com/shaydewael/discord-getting-started.git
+```
+
+Then navigate to its directory and install dependencies:
+```
+cd discord-getting-started
+npm install
+```
+### Get app credentials
+
+Fetch the credentials from your app's settings and add them to a `.env` file (see `.env.sample` for an example). You'll need your app ID (`APP_ID`), server ID (`GUILD_ID`), bot token (`DISCORD_TOKEN`), and public key (`PUBLIC_KEY`).
+
+Fetching credentials is covered in detail in [the getting started guide](TODO).
+
+### Run the app
+
+After your credentials are added, go ahead and run the app:
+
+```
+node app.js
+```
+
+> ⚙️ A package [like `nodemon`](https://github.com/remy/nodemon), which watches for local changes and restarts your app, may be helpful while locally developing.
+
+### Set up interactivity
+
+The project needs a public endpoint where Discord can send requests. To develop and test locally, you can use something like [`ngrok`](https://ngrok.com/) to tunnel HTTP traffic.
+
+Install ngrok if you haven't already, then start listening on port `3000`:
+
+```
+ngrok http 3000
+```
+
+You should see your connection open:
+
+```
+Tunnel Status                 online
+Version                       2.0/2.0
+Web Interface                 http://127.0.0.1:4040
+Forwarding                    http://1234-someurl.ngrok.io -> localhost:3000
+Forwarding                    https://1234-someurl.ngrok.io -> localhost:3000
+
+Connections                  ttl     opn     rt1     rt5     p50     p90
+                              0       0       0.00    0.00    0.00    0.00
+```
+
+Copy the forwarding address that starts with `https`, in this case `https://1234-someurl.ngrok.io`, then go to your [app's settings](https://discord.com/developers/applications).
+
+On the **General Information** tab, there will be an **Interactions Endpoint URL**. Paste your ngrok address there, and append `/interactions` to it (`https://1234-someurl.ngrok.io/interactions` in the example).
+
+Click **Save Changes**, and your app should be ready to run 🚀
+
+## Other resources
 - Join the **[Discord Developers server](https://discord.gg/discord-developers)** to ask questions about the API, attend events hosted by the Discord API team, and interact with other devs.
- Read **[the documentation](https://discord.com/developers/docs/intro)** for in-depth information about API features
-
-
-
+- Read **[the documentation](https://discord.com/developers/docs/intro)** for in-depth information about API features.
+- Check out **[community resources](https://discord.com/developers/docs/topics/community-resources#community-resources)** for language-specific tools maintained by community members.