[Post] The Stack Part 3 (#18)

* Add draft post
* Add ui-app and ui-internal writeup
* Cover deployments in part 3
* Add missing import
* Fix response page path
* Add rewrite handler
* Fix edge-function
* Fix incorrect file ending

Author: Tehnix

posts/2023-10-07-the-stack-part-1.md

@@ -92,6 +92,7 @@ Now that we are ready, a high-level overview of the steps we will be taking are:
 The first screen you'll meet wants you to review various infomration and pricing as well as choose a few defaults. We are going to change some of the values:
 
 - **Region deny setting**: Choose `Enabled` for this. We want to make sure that Control Tower is governing our accounts and resources.
+- We will need `us-east-1` for certain "global" resources, so we'll add that to the list of allowed regions along with your desired region.
 
 #### Step 2
 

posts/2023-10-07-the-stack-part-2.md

@@ -28,6 +28,7 @@ Otherwise, let's jump in!
   - [Trigger the Workflows](#trigger-the-workflows)
   - [Manual alternative: Bootstrapping our Accounts](#manual-alternative-bootstrapping-our-accounts)
   - [Manual alternative: Deployments](#manual-alternative-deployments)
+- [Bonus: Just](#bonus-just)
 - [Next Steps](#next-steps)
 
 
@@ -314,7 +315,7 @@ Our deployment flow gets a bit more complicated. We're building for the future h
 We will be building up the following flow, illustrated in the diagram below:
 
 <div style="text-align:center;">
-<a href="/resources/images/the-stack-part-2-deployment-flow.png" target="_blank" rel="noopener noreferrer"><img src="/resources/images/the-stack-part-2-deployment-flow.png" loading="lazy" alt="Deployment flow" title="Deployment flow" width="100%%" /></a>
+<a href="/resources/images/the-stack-part-2-deployment-flow.png" target="_blank" rel="noopener noreferrer"><img src="/resources/images/the-stack-part-2-deployment-flow.png" loading="lazy" alt="Deployment flow" title="Deployment flow" width="100%" /></a>
 </div>
 
 This is what is called a "staggered deployment", but across our environments:
@@ -436,7 +437,7 @@ We could have been using using build `matrix`'s again, but that would mean that
 Voila 🎉 We've now set the skeleton for the deployment flow we pictured earlier:
 
 <div style="text-align:center;">
-<a href="/resources/images/the-stack-part-2-deployment-flow.png" target="_blank" rel="noopener noreferrer"><img src="/resources/images/the-stack-part-2-deployment-flow.png" loading="lazy" alt="Deployment flow" title="Deployment flow" width="100%%" /></a>
+<a href="/resources/images/the-stack-part-2-deployment-flow.png" target="_blank" rel="noopener noreferrer"><img src="/resources/images/the-stack-part-2-deployment-flow.png" loading="lazy" alt="Deployment flow" title="Deployment flow" width="100%" /></a>
 </div>
 
 **Part 2: Reuseable workflow**
@@ -532,7 +533,7 @@ Push your project to GitHub. You now have access to the workflows and can trigge
 If you haven't done it already, let's run the `Deployment: Bootstrap` workflow first, to set up CDK on all accounts. Alternatively, jump to the section [Manual alternative: Bootstrapping our Accounts](#manual-alternative-bootstrapping-our-accounts) for how to do this manually.
 
 <div style="text-align:center;">
-<a href="/resources/images/the-stack-part-2-trigger-bootstrap-workflow.png" target="_blank" rel="noopener noreferrer"><img src="/resources/images/the-stack-part-2-trigger-bootstrap-workflow.thumbnail.png" loading="lazy" alt="Manually trigger the bootstrap workflow" title="Manually trigger the bootstrap workflow" width="80%%" /></a>
+<a href="/resources/images/the-stack-part-2-trigger-bootstrap-workflow.png" target="_blank" rel="noopener noreferrer"><img src="/resources/images/the-stack-part-2-trigger-bootstrap-workflow.thumbnail.png" loading="lazy" alt="Manually trigger the bootstrap workflow" title="Manually trigger the bootstrap workflow" width="80%" /></a>
 </div>
 
 Next up, before we initiate the deployment it's recommended to be logged into your Domain Registrar that controls the DNS of your domain, so that you can quickly update your name servers to point to the Hosted Zone that we will be creating. This is necessary to DNS validate our ACM certificates.
@@ -611,6 +612,81 @@ $ DOMAIN="app.example.com" bun run cdk deploy --concurrency 4 'Cloud' 'Cloud/**'
 The `DOMAIN` environment variable is required here, since we need to know what domain we should use for the Hosted Zone.
 
 
+## Bonus: Just
+
+It might seem overkill right now, but we will eventually have many different commands across many folder locations in our mono-repo setup. To make this a bit easier to work with, we can use the tool [Just](https://github.com/casey/just) to help us out.
+
+From `just`'s README:
+
+> `just` is a handy way to save and run project-specific commands
+
+From [the installation instructions](https://github.com/casey/just#packages) we can install it via:
+
+```bash
+# macOS:
+$ brew install just
+# Linux with prebuilt-mpr (https://docs.makedeb.org/prebuilt-mpr/getting-started/#setting-up-the-repository):
+$ sudo apt install just
+# Prebuilt binaries (assuming $HOME/.local/bin is in your $PATH):
+$ curl --proto '=https' --tlsv1.2 -sSf https://just.systems/install.sh | bash -s -- --to $HOME/.local/bin
+```
+
+This allows us to set up a `justfile` in the root of our project, which we can then use to define shortcuts to our commands. For example, we can define a shortcut to run our CDK commands:
+
+```makefile
+# Display help information.
+help:
+  @ just --list
+
+# Setup dependencies and tooling for <project>, e.g. `just setup deployment`.
+setup project:
+  just _setup-{{project}}
+
+_setup-deployment:
+  #!/usr/bin/env bash
+  set -euxo pipefail
+  cd deployment
+  bun install
+
+# Deploy the specified <stack>, e.g. `just deploy Cloud`, defaulting to --all.
+deploy stack='--all':
+  #!/usr/bin/env bash
+  set -euxo pipefail
+  cd deployment
+  bun run cdk deploy --concurrency 4 --require-approval never {{ if stack == "--all" { "--all" } else { stack } }}
+
+# Run tests for <project>, e.g. `just test deployment`.
+test project:
+  just _test-{{project}}
+
+_test-deployment:
+  #!/usr/bin/env bash
+  set -euxo pipefail
+  cd deployment
+  bun test
+
+_test-synth:
+  #!/usr/bin/env bash
+  set -euxo pipefail
+  cd deployment
+  bun run cdk synth --all
+```
+
+We can now run our commands via `just`:
+
+```bash
+# Setup our dependencies:
+$ just setup deployment
+# Run tests:
+$ just test deployment
+# Synthesize our CDK stack:
+$ just test synth
+# Deploy our CDK stack:
+$ just deploy # or just deploy Cloud
+```
+
+
+
 ## Next Steps
 
 Next up is to add our first Frontend! Follow along in Part 3 of the series (will be posted soon).