Using aws amplify with quicksight

Question

Pulumi · Accepted Answer

AWS Amplify is a set of tools and services that enable mobile and front-end web developers to build secure, scalable full-stack applications, powered by AWS. Amazon QuickSight, on the other hand, is a scalable, serverless, embeddable, machine learning-powered business intelligence (BI) service built for the cloud.

To integrate AWS Amplify with Amazon QuickSight, you would generally use Amplify to build your application and authenticate users, and QuickSight to provide the BI and data visualization capabilities within that application. For example, you could use Amplify to create a web or mobile application that authenticates users via AWS Cognito and, once authenticated, those users could access dashboards or analytics powered by QuickSight.

In the code below, I'll demonstrate how to configure the necessary AWS resources using Pulumi. The Pulumi program will:

Provision an AWS Amplify app.
Create a QuickSight user.

Here is what each part of the program is doing:

Configure AWS provider references.
Create an AWS Amplify app. For Amplify, you would generally also configure a backend (like GraphQL with AWS AppSync, REST APIs with Amazon API Gateway, or file storage with Amazon S3), but for simplicity, this will just scaffold an empty Amplify app.
Create a QuickSight user that would be used within your application to access QuickSight dashboards or perform API operations in QuickSight.

Keep in mind that this does not build the entire application for you, it simply sets up the necessary AWS resources. To fully integrate QuickSight into an Amplify app, you would need additional steps such as setting up the QuickSight dashboard, embedding analytics in your app, and handling authentication and authorization appropriately.

import * as pulumi from '@pulumi/pulumi';
import * as aws from '@pulumi/aws';

// Configure AWS provider
// Assuming the Pulumi configuration is already set with the proper AWS region and credentials

// Provision an AWS Amplify app
const amplifyApp = new aws.amplify.App('myAmplifyApp', {
  name: 'demoAmplifyApp',
  // Replace with your own repository configuration
  repository: 'https://github.com/<your-account>/<your-repo>',
  // Assuming build and environment variables are set correctly
  buildSpec: `
    version: 1
    frontend:
      phases:
        preBuild:
          commands:
            - npm install
        build:
          commands:
            - npm run build
      artifacts:
        baseDirectory: /build
        files:
          - '**/*'
    `,
});

// Create a QuickSight user
const quicksightUser = new aws.quicksight.User('myQuicksightUser', {
  email: 'user@example.com',
  identityType: 'QUICKSIGHT', // Use 'IAM' for users authenticated through IAM
  userRole: 'READER', // Use 'AUTHOR' or 'ADMIN' based on the access level required
  // Replace '<aws-account-id>' with your AWS account ID
  awsAccountId: '<aws-account-id>',
  namespace: 'default',
}, {
  dependsOn: [amplifyApp], // Ensures Amplify app is provisioned before creating the user
});

// Export the Amplify app ID and QuickSight user ARN
export const amplifyAppId = amplifyApp.id;
export const quicksightUserArn = quicksightUser.arn;

What this code doesn't cover:

Complete setup of the backend services and functionality for the Amplify app.
The creation of QuickSight dashboards and datasets.
Detailed IAM permissions and policies, which would need to be configured to ensure proper access control.
Embedding QuickSight dashboards into your application. This usually involves generating a QuickSight embed URL with appropriate parameters and using it within an iframe or with the QuickSight embedding SDK.

After provisioning these resources, you should:

Build out your web or mobile frontend with AWS Amplify.
Create the necessary dashboards and datasets in Amazon QuickSight.
Add authentication to your Amplify app, typically with Amazon Cognito.
Integrate the QuickSight dashboard embed URLs into your app, making sure that the authenticated users have the necessary permissions to view or interact with the QuickSight resources.
Set up the necessary permissions and roles in AWS IAM to manage access between Amplify and QuickSight.

Please remember to replace placeholders such as URLs, account IDs, and email addresses with your actual information. The dependsOn property in QuickSight user resource ensures that the Amplify app is created before the QuickSight user, enforcing the correct order of creation.