The architecture of this workload allows users to upload media assets and have them converted to different web-friendly media formats. The flow of the application is as follows:

1. End users access an authenticated web application that they can use to upload media assets.
2. The application is hosted on Amazon S3 and distributed via Amazon CloudFront.
3. When an user uploads a media asset, the application obtains a pre-signed upload URL from a GraphQL API managed by Amazon AppSync.
4. The AppSync API forwards the request to an AWS Lambda function that generates the pre-signed URL and stores the file metadata on Amazon DynamoDB.
5. Using the pre-signed url obtained from the API, the user uploads the asset directly to S3.
6. This action sends a notification to Amazon EventBridge.
7. The events are then filtered and routed to one or more SQS queues, from which they are picked up by Lambda functions.
8. Each type of media file is processed by a dedicated component that takes the original file, converts it, and saves the rendition back to S3.
9. The processing units update the status of each file in the DynamoDB table.

Workshop llink: https://catalog.workshops.aws/powertools-for-aws-lambda/en-US

See CONTRIBUTING for more information.

TODO: Note that the app is not yet fully functional on LocalStack and depends on a few PRs to be merged first, including a PR in the https://github.com/aws-amplify/amplify-js repo.

First, we bootstrap and deploy the infra CDK stack:

$ npm run bootstrap
$ npm run infra:deploy

We then need to generate a configuration file with exported params. Create a file frontend/src/aws-exports.tsx with the following content, and make sure to remove all ... with corresponding values of your local infra deployment:

import { GraphQLAuthMode } from '@aws-amplify/core/internals/utils';

const awsmobile = {
  Auth: {
    Cognito: {
      userPoolId: "...",
      userPoolClientId: "...",
      identityPoolId: "...",
      userPoolEndpoint: "http://localhost.localstack.cloud:4566",
      identityPoolEndpoint: "http://localhost.localstack.cloud:4566",
    },
  },
  API: {
    GraphQL: {
      endpoint: "https://localhost.localstack.cloud:4566/graphql/...",
      region: 'us-east-1',
      defaultAuthMode: 'userPool' as GraphQLAuthMode
    }
  }
}
export default awsmobile;

Next, we build and deploy the frontend application:

$ export AWS_PROFILE=localstack
$ npm run frontend:build
$ npm run frontend:deploy

Finally, we can open the app under http://website-000000000000-dev.s3.localhost.localstack.cloud:4566/index.html and start interacting with it.

See CONTRIBUTING for more information.

The documentation is made available under the Creative Commons Attribution-ShareAlike 4.0 International License. See the LICENSE file.

The sample code within this documentation is made available under the MIT-0 license. See the LICENSE-SAMPLECODE file.