

# Task 2: Manage Users
<a name="module-two"></a>


|  |  | 
| --- |--- |
| **Time to complete** | 15 minutes  | 
| **Requires** | A text editor. Here are a few free ones: [See the AWS documentation website for more details](http://docs.aws.amazon.com/hands-on/latest/build-serverless-web-app-lambda-amplify-bedrock-cognito-gen-ai/module-two.html) | 
| **Get help** |  [See the AWS documentation website for more details](http://docs.aws.amazon.com/hands-on/latest/build-serverless-web-app-lambda-amplify-bedrock-cognito-gen-ai/module-two.html)  | 

## Overview
<a name="overview"></a>

Now that you have a React web app, you will configure an authentication resource for the app using AWS Amplify Auth, powered by Amazon Cognito. Cognito is a powerful user directory service that manages user registration, authentication, account recovery, and more. 

You will use the AWS Management Console to enable access to Amazon Bedrock and Claude 3 Sonnet foundation model, which the app will use to generate recipes. 

## What you will accomplish
<a name="what-you-will-accomplish"></a>

In this tutorial, you will: 
+ Set up Amplify Authentication 
+ Set up access to Claude 3 Sonnet from Anthropic 

## Implementation
<a name="implementation"></a>

### Step 1: Set up Amplify Auth
<a name="set-up-amplify-auth"></a>

The app uses email as the default login mechanism. When the users sign up, they receive a verification email. In this step, you will customize the verification email that is sent to users. 

1. Modify the resource file

   On your local machine, navigate to the **ai-generated-recipes**/**amplify/auth/resource.ts** file and **update** it with the following code. Then, **save** the file. 

   ```
   import { defineAuth } from "@aws-amplify/backend";
   
   export const auth = defineAuth({
     loginWith: {
       email: {
         verificationEmailStyle: "CODE",
         verificationEmailSubject: "Welcome to the AI-Powered Recipe Generator!",
         verificationEmailBody: (createCode) =>
           `Use this code to confirm your account: ${createCode()}`,
       },
     },
   });
   ```  
![The file structure of the ai-recipe-generator project, highlighting the resource.ts file inside the auth folder. This is part of a tutorial for building a serverless web app with generative AI, specifically demonstrating where to modify the resource file.](http://docs.aws.amazon.com/hands-on/latest/build-serverless-web-app-lambda-amplify-bedrock-cognito-gen-ai/images/serverless-gen-modify-resource-file.png)

1. View the customized email

   The following image is an example of the customized verification email.  
![A customized verification email](http://docs.aws.amazon.com/hands-on/latest/build-serverless-web-app-lambda-amplify-bedrock-cognito-gen-ai/images/customized-email.png)

### Step 2: Set up Amazon Bedrock Model Access
<a name="set-up-amazon-bedrock-model-access"></a>

Amazon Bedrock enables users to request access to a variety of Generative AI models. In this tutorial, you will need access to Claude 3 Sonnet from Anthropic. 

1. Open the Bedrock console

   **Sign in** to the AWS Management console in a new browser window, and **open** the AWS Amazon Bedrock console at  [https://console.aws.amazon.com/bedrock/](https://console.aws.amazon.com/bedrock/). 

   **Verify** that you are in the ****N. Virginia us-east-1**** region, and choose **Get started**.   
![The Amazon Bedrock console showing the welcome screen to build and scale generative AI applications with foundation models (FMs), featuring a 'Get started' button as part of a serverless web app tutorial (Module 2).](http://docs.aws.amazon.com/hands-on/latest/build-serverless-web-app-lambda-amplify-bedrock-cognito-gen-ai/images/serverless-gen-bedrock-console-welcome.png)

1. Select the Claude model

   In the **Foundation models** section, choose the **Claude model**.   
![The Amazon Bedrock overview interface showing supported foundation models, including AI21 Labs Jamba-Instruct, Amazon Titan, Anthropic Claude, Cohere Command, Meta Llama 3, Mistral AI Mistral, and Stability AI Stable Diffusion.](http://docs.aws.amazon.com/hands-on/latest/build-serverless-web-app-lambda-amplify-bedrock-cognito-gen-ai/images/serverless-gen-foundation-models-cda.png)

1. Request access to Claude 3 Sonnet

   Scroll down to the **Claude models** section, and choose the **Claude 3 Sonnet** tab, and select **Request model access**. 
**Note**  
If you already have access to some models, then the button will display **Manage model access**.  
![The Claude models selection interface for Anthropic's Haiku, Sonnet, and Opus models, displaying options such as Claude 3 Opus, Claude 3 Sonnet, Claude 3 Haiku, and Claude 2.1. The image highlights the 'Request model access' button and shows a notification stating that the account does not currently have access to this model.](http://docs.aws.amazon.com/hands-on/latest/build-serverless-web-app-lambda-amplify-bedrock-cognito-gen-ai/images/serverless-gen-claude-models-selection.png)

1. Request model access

   In the Base models section, for **Claude 3 Sonnet**, choose **Available to request,** and select **Request model access**.   
![The 'Base models' selection panel from the AWS Management Console, displaying options for base model providers (AI21 Labs, Amazon, Anthropic) and access status. The panel highlights model access options such as 'Unavailable' and 'Available to request' with an example for Claude 3 Sonnet, as seen in a tutorial for building serverless web apps with generative AI.](http://docs.aws.amazon.com/hands-on/latest/build-serverless-web-app-lambda-amplify-bedrock-cognito-gen-ai/images/serverless-gen-base-models-selection-panel.png)

1. Choose Next

   On the **Edit model access** page, choose **Next**.   
![The 'Edit model access' screen in an AWS GenAI tutorial, showing options to select and request access to different foundational models such as Claude 3 Sonnet. The Claude 3 Sonnet model is selected and the Next button is highlighted.](http://docs.aws.amazon.com/hands-on/latest/build-serverless-web-app-lambda-amplify-bedrock-cognito-gen-ai/images/fug-serverless-gen-edit-model-access-dffce-1.png)

1. Submit request

   On the **Review and Submit** page, choose **Submit**.   
![The 'Edit model access' screen in an AWS GenAI tutorial, showing options to select and request access to different foundational models such as Claude 3 Sonnet. The Claude 3 Sonnet model is selected and the Next button is highlighted.](http://docs.aws.amazon.com/hands-on/latest/build-serverless-web-app-lambda-amplify-bedrock-cognito-gen-ai/images/fug-serverless-gen-edit-model-access-dffce-1.png)

## Conclusion
<a name="conclusion"></a>

You have configured Amplify for authentication and customized the verification email, and enabled access to Amazon Bedrock and Claude 3 Sonnet. 