CyberSEO Pro plugin for WordPress

Deploy React App in 10 minutes with AWS Amplify and Route 53

Read Time:1 Minute, 43 Second

Hi there,

Let’s learn how to deploy a react app with AWS Amplify. In this guide we would need the following:

  1. A React App.
  2. Git Provider (Github, Bitbucket, Gitlab, AWS CodeCommit, etc).
  3. Custom Domain (This is optional).

Obviously to deploy an app we need to have an app to deploy 😄.

After logging in to your AWS console search and click on AWS Amplify

Deploy React App in 10 minutes with AWS Amplify and Route 53

On the Amplify home screen click on get started.

Getting started with AWS AWS amplify

You would now need to choose between amplify build or amplify hosting, choose the latter.

Get started amplify hosting

You have the option of selecting one of the git providers listed, There is also an option to use to upload code without a Git provider, but for the sake of this tutorial, we would be using GitHub.

AWS ampify git provider image

Clicking on GitHub will redirect you to GitHub for you to authorize AWS Amplify on your GitHub account, if that process is successful, you would see a screen like this

Image description

select the repository and then a default branch from the list and click next.
You would see a configuration screen, with a preview of the recommended changes, you don’t need to do anything you can go ahead and click next to continue.

AWS ampify configure page

On the review page, click save and deploy

AWS ampify review page

In the next few minutes, we would have our app completely deployed on the app homepage, the page would be similar to the screen below and we would also have a random URL generated on amplifyapp domain.

amplify complete deployment page

To add a custom domain, click on the domain management on the left side of the AWS Amplify dashboard, and then click on add domain as seen in the screenshot below.

add custom domain

Add your domain using route 53, if that process was completed successfully, you should be able to find your domain in the search bar, do the simple configuration and save.

Image description

Wait for a few minutes for SSL to install on that domain. Congratulation, we have just deployed a react App with Amplify.

Source: https://dev.to/aws-builders/deploy-react-app-in-10-minutes-with-aws-amplify-and-route-53-24om

What were some of the toughest technologies and concepts for you to grasp along the way? Previous post What were some of the toughest technologies and concepts for you to grasp along the way?
How to check if your libraries are vulnerable? Next post How to check if your libraries are vulnerable?

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.