docs: update readme for quickstart

.env.example

@@ -10,21 +10,9 @@ ROOT_USERS=62601275618889728
 ALLOWED_BOTS=
 
 # If 6600 or 6601 is taken, change this, and all other 6600/6601 references.
-PORT=6600
+PORT=6609
 UI_PORT=6601
 
-# This is probably right, unless you set a different port.
-OAUTH_REDIRECT_URI=http://localhost:6600/login-handler
-
 # Again, probably right. Do not put a trailing /
 UI_PUBLIC_URI=http://localhost:6601
-API_PUBLIC_URI=http://localhost:6600
+API_PUBLIC_URI=http://localhost:6609
-
-# Google Cloud Project ID -- This only needs to be set for production/public cloud
-GCP_PROJECT_ID=roleypoly-0000000
-
-# Unset this if you're planning to use public cloud Firestore as opposed to local
-# Or set this differently if you changed your local endpoint port.
-FIRESTORE_EMULATOR_HOST=localhost:6691
-
-REDIS_ENDPOINT=localhost:6692

README.md

@@ -14,23 +14,80 @@ Tame your Discord roles.
 
 Roleypoly is a distributed system built with TypeScript, React, Terraform, and Go.
 
-This app is heavily edge computing-based with the backend being deployed via Cloudflare Workers, UI server on Google Cloud Run with 6 regions, and the mention responder in Google Compute Engine.
+This app is heavily edge computing-based with the backend being deployed via Cloudflare Workers, UI server on Google Cloud Run with 8 regions, and the mention responder in Google Compute Engine.
 
-### Extra Docs
+### Extra Development Docs
 
-- 👷‍♀️ [Getting Started](docs/getting-started.md)
 - 🏭 [Infrastructure](docs/infrastructure.md)
 - 🧾 [User Stories](docs/user-stories.md)
 
 ### Quickstart
 
-This repo can be quickly setup with [VSCode Dev Containers](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers) or [GitHub Codespaces](https://github.com/codespaces). This will setup a fully featured Docker container for developing VSCode, including extensions.
+#### Option 1 🚀: E2E Dockerized Emulation
 
-If you'd like to not use either of those, a dev toolkit image can be pulled from `ghcr.io/roleypoly/dev-container:main`. This use case is not actively investigated, but with tinkering, will work. Feel free to document this process and open a PR :)
+This is the fastest way to start. You must be using MacOS or Linux (WSL2 is ok!) for this to be successful.
+
+- Setup `.env` using [`.env.example`][envexample] as a template and guide.
+  - When setting up your Discord Application, be sure to set `http://localhost:6609/login-callback` as the OAuth2 callback URL.
+- Run: `yarn install`
+- Run: `docker-compose up`
+  - This starts the UI and API servers in hot-reload dev/emulation mode. All changes to TS/TSX files should be properly captured and reloaded for you!
+- Develop you a Roleypoly!
+
+#### Option 2 🐱‍👤: Local Emulation
+
+- With pre-requisites:
+  - Node.js 14, Yarn
+- Setup `.env` using [`.env.example`][envexample] as a template and guide.
+  - When setting up your Discord Application, be sure to set `http://localhost:6609/login-callback` as the OAuth2 callback URL.
+- Run: `yarn install`
+- Run both: `yarn ui` and `yarn worker`
+  - This starts the UI and API servers in hot-reload dev/emulation mode. All changes to TS/TSX files should be properly captured and reloaded for you!
+- Develop you a Roleypoly!
+
+#### Option 3 🐄🤠: Wrangler (No emulation)
+
+This is probably extremely painful and requires you to have a Cloudflare account.
+
+- With pre-requisites:
+  - Cloudflare Account
+  - Node.js 14, Yarn
+  - `npm i -g @cloudflare/wrangler`
+    - Do `wrangler init`, `wrangler login`, etc...
+- Setup Wrangler for the project
+
+  - Change `account_id` to your Cloudflare Account ID in `wrangler.toml`
+  - Add a `dev` environment to `wrangler.toml`, using [`.env.example`][envexample] as a reference for how values should be set
+
+    - When setting up your Discord Application, be sure to set `http://localhost:8787/login-callback` as the OAuth2 callback URL.
+
+    ```toml
+    [env.dev]
+
+    [env.dev.vars]
+    BOT_CLIENT_ID = ...
+    UI_PUBLIC_URI = "http://localhost:6601"
+    API_PUBLIC_URI = "http://localhost:8787"
+    ROOT_USERS = ...
+    ```
+
+  - `wrangler secret put BOT_TOKEN -e dev`
+  - `wrangler secret put BOT_CLIENT_SECRET -e dev`
+  - Setup KV Namespaces -- Please follow the instructions listed after the command runs.
+    - `wrangler kvnamespace create -e dev KV_SESSIONS --preview`
+    - `wrangler kvnamespace create -e dev KV_GUILD_DATA --preview`
+    - `wrangler kvnamespace create -e dev KV_GUILDS --preview`
+
+- Setup `.env` using [`.env.example`][envexample] as a template and guide.
+- Run `yarn install`
+- Run both `wrangler dev -e dev` and `yarn ui`
+  - This starts the UI and API servers in hot-reload dev mode. All changes to TS/TSX files should be properly captured and reloaded for you!
+- Develop you a Roleypoly
+  - And get a beer or heated plant because oh no.
 
 ### Developing Design System Components
 
-For working with the [Roleypoly Design System](https://ui.roleypoly.com)...
+For working with the [Roleypoly Design System](https://ui.roleypoly.com), use the below steps as reference. Code lives in `src/design-system` among elsewhere.
 
 Run:
 
@@ -38,9 +95,9 @@ Run:
 - `yarn storybook` to open storybook
 - `yarn test` to test
 
-### Developing App UI
+### Developing Web UI
 
-For working with the Next.js frontend components...
+For working with the Next.js frontend components, use the below steps as reference. Code lives in `src/pages` among elsewhere.
 
 Run:
 
@@ -48,10 +105,14 @@ Run:
 - `yarn ui` to run Next.js dev server
 - `yarn test` to test
 
-### Developing Backend Components
+### Developing API Components
 
-For working with Backend systems, you need Wrangler, and a setup script to help wtih config stuff :)
+For working with the API, use the below steps as reference. Code lives in `src/backend-worker`.
 
-- `yarn setup-wrangler` to setup wrangler.toml
+Run:
-- `wrangler dev -e dev` to start a local preview deployment
+
+- `yarn` to install deps
+- `yarn worker` to start an emulated worker
 - `yarn test` to test
+
+[envexample]: .env.example