| by Arround The Web | No comments

How to Deploy React App to AWS

React is a library in the JavaScript language for building fast and interactive user interfaces and is one of the more popular libraries for developing user interfaces. It uses independent, isolated and reusable components that are pieces of the user interface and composes them to build complex structures. This post will guide you through deploying React applications to AWS using EC2 instances.

Let’s start with how to deploy React application to AWS:

Deploy React App to AWS

To deploy the react application to AWS, create an EC2 instance from the EC2 console by clicking on the “Launch Instances” button:

Enter the name of the instance with the Amazon Machine Image selection for the EC2 instance:

Choose the instance type and create the private key pair by clicking on the “Create new key pair” link:

Type the name of the key pair file and select the file type and format to download it. After that, click on the “Create key pair” button at the bottom of the page to create the key pair file:

Allow HTTP and HTTPS traffic from the internet in the security groups. After that, simply review all the settings before clicking on the “Launch Instance” to create an EC2 instance:

After the instance creation, select it and click on the “Connect” button to connect to the EC2 instance:

Select the SSH client to connect to the instance and copy the command mentioned in the screenshot below:

Paste the command on the Command prompt or PowerShell and change the path of the private key pair file:

Once the user is connected to the EC2 instance use the following command to get the apt packages updated:

apt-get update

Running the above command will display the following output:

Install the Nginx server to deploy the react application after that verify its existence and restart the server using the following commands:

sudo apt-get install nginx -y
nginx -v
sudo systemctl restart nginx

These commands will install and start the Nginx services:

After that install the curl to create React application on the Nginx server by using the following command:

sudo apt-get install curl

Running this command will display the following output:

After that, use curl to download NodeJS using the following command:

curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash -

The following result will be displayed from the above command:

After the downloading is completed, install the NodeJS using the following command:

sudo apt-get install -y nodejs

This command will install the NodeJS to create the react application:

Use the following command to locate the folder in which the React application will be created:

cd /var/www/html/

The user is inside the folder to create the react application:

Create the application inside the folder using the following command:

npx create-react-app react-tutorial

Running this command will display the following output:

Use the following commands to start the npm and run the React application:

cd react-tutorial
npm start

Running this command will allow you to access the React application on web browser using the links from the below screenshot:

Your react application is running on the browser using the localhost or the AWS network:

You have successfully deployed React application to AWS:

Conclusion

React applications can be deployed using the AWS EC2 instance. Create the EC2 instance from the EC2 console page and then connect to it using the SSH client. Once you are inside the EC2 instance, download and install the Nginx server and NodeJS to deploy the react application to AWS. Inside the NodeJS create a react app that will be deployed using the Nginx server.

Share Button

Source: linuxhint.com

Leave a Reply