Templates

Signup form with phone OTP verification with Amazon Cognito template

Verify your users' phone number sending them a one-time-password (OTP) and sign them up with Amazon Cognito.

Templates
Signup form with phone OTP verification with Amazon Cognito

About this template

This signup form with Amazon Cognitoincludes:

  1. An initial form step that requires the full name, email and password.
  2. A flow that checks if the email is available.
  3. A second form step that requires the phone number.
  4. A flow that generates an OTP and sends it via SMS.
  5. A third step that requires the verification code.
  6. And lastly, a flow that verifies the OTP, creates the account and issues a token to automatically log the user in.

How to configure this template

Requirements

1. An Amazon Cognito account.

2. An IAM user with an Arengu Cognito connection. Learn how to create it.

3. A Cognito user pool with email enabled as a sign-in option. Learn how to create it

  • Collect the User pool ID for use in the flow "Lookup" and "Sign up" actions.

4. Enable Lambda triggers in your User pool to use Custom Auth challenges. Learn how to create them.

  • Collect the JWT_SECRET_KEY value for use in the "JSON web token" action.

5. An initialized Amplify web SDK where you will embed the form.

6. A redirect URL.

This template uses a test-only action to send SMS. Consider replacing it with your own SMS provider (eg. Twilio) before using it in production to avoid limitations.

User pool ID

ID collected after creating the user pool:

Use this ID to replace the Arengu flow actions "Lookup" and "Sign up" User pool ID values:

JWT_SECRET_KEY

Use the value collected when creating the Lambda triggers in the flow action "Sign JSON web token":

Redirect URL

In the Arengu form editor, select the Ending screen and enter the Redirect URL to send the users after you log them in.

A native experience for your brand

Style our forms following your brand guidelines and embed them into your frontend framework with a single line of code.

Explore the docs

Integrate this template with your own stack

Send your data back and forth between Arengu and your favourite apps.

Getting started with Arengu

Arengu allows you to build all your user flows connected to your current stack, and avoids coding all the UI, complex integrations, validations or logic from scratch. Try it for free and start building faster and scaling your application needs as they grow.