Host Your React App on AWS Amplify Studio

Setup the GitHub Repository

We have to create an account on GitHub or if we have then simply create a repo for the project and clone it in our system. To make the process fast you can download GitHub Desktop and clone your repo.
 

Note: When you take a pull, it will create a new folder name as your Repo you can simply copy and paste your code or setup in your existing folder.
Now we have pasted the code in a folder and we have to push it.

Now we pushed the code let's open our console.

Set up the Deployment - Host React App

Choose your app in the console and click on Hosting Environment and choose Git Hub and click on Connect Branch button.

Now we have to authorize the permission of Git Hub. Your repository and its branch will reflect after permission is granted.

Here we pushed our code in the Main branch so we will choose main and click on the Next button.

After this new interface will code in which you have to enable Enable full-stack continuous deployments (CI/CD), and app environment and create a new role in AWS.

Click on Next.

Now click on Save and Deploy this is the Review section check it correctly.

After this Build Section will open and show the status of Build Deployment it may take some time.

There are 3 Steps Provision, Build and Deploy. It will mark as green once any step is completed.

or to see full status you can simply click on it and watch it.

Now the build is a success you can simply go to the URL and see your app.

It's Working Now,

Now it is deployed,
We have connected our GitHub account to the main branch, and modifications will automatically initiate a build and deployment in the main branch.

Conclusion - Host React App on Amplify

Hosting your React app on Amplify is a kind of process that allows you to utilize the power of AWS services for deployment. By following the steps outlined in this article, you can now host your React app successfully on hosted AWS Amplify.