aws-amplify-stepfunctions-example

Note

This sample was originally published on the AWS Front-End Web & Mobile blog in the post Integrate AWS Step Functions with AWS Amplify using Amplify custom resources. The original version used the AWS Amplify CLI to create the custom resource. The current version uses Amplify Gen 2 instead.

In this sample, we'll demonstrate how to integrate custom resources with AWS Amplify Gen 2 using the AWS Cloud Development Kit (CDK). We'll create a Step Functions workflow as an Amplify custom resource and connect it to an existing Amplify-managed GraphQL API.

What you will learn

• How to create a Step Functions workflow as an Amplify custom resource using the AWS CDK.
• How to connect our custom resource to an existing Amplify-managed GraphQL API.

What you will build

The proposed solution consists of the following elements:

• Our sample web application is a customer feedback form built using Vite and Amplify UI.
• Submitting the feedback form will trigger a Step Functions express workflow created as an Amplify custom resource via an AWS AppSync API managed by Amplify.
• The Step Function workflow will detect the sentiment of the submitted feedback using Amazon Comprehend’s DetectSentiment API.
• Next, the workflow will store the feedback and detected sentiment in an Amplify-managed Amazon DynamoDB table.
• If a non-positive sentiment is detected, the workflow will trigger a notification to a customer support email address using the Amazon Simple Notification Service (Amazon SNS).
• Depending on the result of the sentiment analysis, our web application will display different confirmation messages to the customer.

The Step Functions workflow looks like this:

From the perspective of the user of our web application, the result will look like this:

Deploy the sample

To deploy the sample, you need to have Node.js 18.x or later installed on your machine.

Clone the repository and navigate to the aws-amplify-stepfunctions-example directory:

git clone https://github.com/aws-samples/aws-amplify-stepfunctions-example.git
cd aws-amplify-stepfunctions-example

Install the dependencies:

npm ci

Fill in your email address in the amplify/backent.ts file to receive the notification emails:

new CustomResources(
    backend.createStack('customResources'),
    'customResources',
    {
        data: {
            apiId: backend.data.apiId,
        },
        notification: {
-             emailAddress: "hello@email.com" // Fill in your email address
        }
    }
);

Deploy the sample:

npx ampx sandbox

After the deployment is complete, you can start the development server:

npm run dev

Security

See CONTRIBUTING for more information.

License

This library is licensed under the MIT-0 License. See the LICENSE file.