diff --git a/.env.example b/.env.example index e1f7bc1..6d3b3de 100644 --- a/.env.example +++ b/.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 - -# 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 +API_PUBLIC_URI=http://localhost:6609 diff --git a/README.md b/README.md index 43b6b82..8eba69b 100644 --- a/README.md +++ b/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 -- `wrangler dev -e dev` to start a local preview deployment +Run: + +- `yarn` to install deps +- `yarn worker` to start an emulated worker - `yarn test` to test + +[envexample]: .env.example