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.