Select your cookie preferences

We use essential cookies and similar tools that are necessary to provide our site and services. We use performance cookies to collect anonymous statistics, so we can understand how customers use our site and make improvements. Essential cookies cannot be deactivated, but you can choose “Customize” or “Decline” to decline performance cookies.

If you agree, AWS and approved third parties will also use cookies to provide useful site features, remember your preferences, and display relevant content, including relevant advertising. To accept or decline all non-essential cookies, choose “Accept” or “Decline.” To make more detailed choices, choose “Customize.”

Skip to main content
Build a Basic Web Application

Task 2: Build a Serverless Function

In this task, you will use AWS Amplify and AWS Lambda to build a serverless function.

Introduction

Overview

Now that you have a React web app, you will use AWS Amplify and AWS Lambda to configure a serverless function. This function is invoked after a signed-up user confirms their user account. AWS Lambda is a compute service that runs your code in response to events and automatically manages the compute resources, making it the fastest way to turn an idea into a modern, production, serverless applications.

Key concepts

Serverless function: Piece of code that will be executed by a compute service, on demand.

Implementation

5 minutes

A text editor. Here are a few free ones:

Set up an Amplify Function

1. Create files

On your local machine, navigate to the profilesapp/amplify/auth folder.

Create a new folder inside the amplify/auth folder and name it post-confirmation.

Create the files named resource.ts and handler.ts inside the folder.

Screenshot of a sample file structure for a basic web application tutorial, showing folders such as amplify, auth, and data, with TypeScript files like handler.ts and resource.ts highlighted under post-confirmation in the auth folder.

2. Update the resources file

Update the amplify/auth/post-confirmation/resource.ts file with the following code to define the postConfirmation function. Then, save the file.

import { defineFunction } from '@aws-amplify/backend'; 
export const postConfirmation = defineFunction({ 
  name: 'post-confirmation',
});
Screenshot showing the file structure for a web application project, highlighting the update to 'resource.ts' in the amplify/auth/post-confirmation directory. Used in the 'Build a Basic Web Application' tutorial.

3. Update the handler file

Update the amplify/auth/post-confirmation/handler.ts file with the following code to define the function’s handler. Then, save the file.

import type { PostConfirmationTriggerHandler } from "aws-lambda"; 
export const handler: PostConfirmationTriggerHandler = async (event) => { 
  return event;
};
Screenshot showing the folder structure of a web application project, highlighting the 'handler.ts' file in the 'amplify/auth/post-confirmation' directory. This illustrates the step to update the handler file as part of building a basic web application tutorial.

Conclusion

You have defined a Lambda function using Amplify.