Skip to content

Nx aws bcrypt layer example #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 5 commits into
base: bcrypt-layer-example
Choose a base branch
from
Open

Nx aws bcrypt layer example #3

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
0912141
move api to nx-aws-api
vespertilian Mar 20, 2021
0d8fa6d
move simple to nx-aws-frontend
vespertilian Mar 20, 2021
ae41cd1
move layer to nx-aws-layer
vespertilian Mar 20, 2021
1691320
move the layers to be prefixed with nx-aws
vespertilian Mar 20, 2021
7255b1c
fix re-naming issues and update readme
vespertilian Mar 21, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
64 changes: 45 additions & 19 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,54 +2,80 @@

This is a sample project for https://github.com/studds/nx-aws, powered by https://nx.dev

## Example app
### Example app

This repo currently provides a single simple example app, with front and backends. The frontend uses angular. The backend using AWS SAM, and is built using nx-aws.
This repo currently provides an example app highlighting how easy NX-AWS makes deploying frontend static sites and backend SAM applications from your mono-repo.

## Development server
The frontend (nx-aws-frontend) uses Angular (Could be React, nrwl NX has excellent support for React).

Frontend: `ng serve simple`
Backend: `ng serve api`
The SAM backend (nx-aws-api) depends on two lambda layers.
Copy link
Owner

@studds studds Mar 21, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In this example repo, I wonder if it's worth including both a simple example (app + api) and a complex example (with layers)? Possibly an example where a binary dep is included directly?

Copy link
Author

@vespertilian vespertilian Mar 25, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think that's a good idea if we have the bandwidth, but I think in the first case the more complex example is better you can always delete the complexity.

- One layer contains a custom function packaged into a layer with it's required dependencies
- One layer is just a package.json it contains bcrypt and is built correctly for the lambda node environment

## Build
The core SAM cloudfront file is in apps/nx-aws-api/template.yaml

Run `ng build simple --withDeps` build the project. [`withDeps`](https://nx.dev/latest/angular/cli/run-many#with-deps)
will automatically build dependencies, either explicit or
[implicit](https://nx.dev/latest/angular/getting-started/configuration#implicit-dependencies),
as well. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
![nx aws setup](./nx-aws-diagram.png "NX AWS setup")

### Development server

- Frontend: `ng serve nx-aws-frontend`
- Backend: ** **You need to deploy the app (layers) before this will work** ** `ng serve nx-aws-api`

*** TODO add comment explaining why you need to include the layers

## Test it out

1. Install the [AWS SAM CLI](https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/serverless-sam-cli-install.html)
2. Set up your [AWS command line tools with the correct credentials](https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/serverless-getting-started-set-up-credentials.html) to a test account.
3. Create an S3 bucket to hold the cloud formation config

### Build

4. `ng build nx-aws-frontend --withDeps --prod`

The [`withDeps`](https://nx.dev/latest/angular/cli/run-many#with-deps) flag will automatically build dependencies, either explicit or
[implicit](https://nx.dev/latest/angular/getting-started/configuration#implicit-dependencies). So it will build the frontend and backend code.

The build artifacts will be stored in the `dist/` directory.
We used the `--prod` flag for a production build so all the frontend code is minified.

![dependency graph](./nx-aws-dep-graph.png "Dependency Graph")

## Package and deploy

The backend needs separate package and deploy steps. Both package and deploy require the
[AWS SAM CLI to be installed](https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/serverless-sam-cli-install.html).
You'll also need to have AWS permissions configured, and to configure an S3 bucket where deploy artefacts can be
stored - in these examples, `my-build-artefacts`.
stored - in these examples, `s3-bucket-setup-step-3`.

`ng run api:package --withDeps --s3Bucket my-build-artefacts`

`ng run api:deploy --withDeps --s3Bucket my-build-artefacts`
5. `ng run nx-aws-api:package --withDeps --s3Bucket s3-bucket-setup-step-3`
6. `ng run nx-aws-api:deploy --withDeps --s3Bucket s3-bucket-setup-step-3`

The first time you deploy the backend stack will take a while, as it deploys a CloudFront distribution.

You can then deploy the frontend app. The frontend app refers to the backend api in `angular.json` to derive the deploy bucket.
*** TODO we should expand on this

`ng run nx-aws-frontend:deploy`

`ng run simple:deploy`
## Other nx command for you to try out if you have not already

## Running unit tests
### Running unit tests

Run `ng test my-app` to execute the unit tests via [Jest](https://jestjs.io).

Run `nx affected:test` to execute the unit tests affected by a change.

## Running end-to-end tests
### Running end-to-end tests

Run `ng e2e my-app` to execute the end-to-end tests via [Cypress](https://www.cypress.io).

Run `nx affected:e2e` to execute the end-to-end tests affected by a change.

## Understand your workspace
### Understand your workspace

Run `nx dep-graph` to see a diagram of the dependencies of your projects.

## Further help
### Further help

Visit the [Nx Documentation](https://nx.dev/angular) to learn more.
Loading