Deploy with Opta IaC: publish and scale your web app to the cloud in minutes with IaC.

In this tutorial, I will be showing you step-by-step guides on how to quickly deploy your app to the cloud in minutes with IaC (Infrastructure-as-a-code) using Opta IaC.

Infrastructure as code involves using code to manage the cloud infrastructure that will run your applications. It removes the manual process of setting up infrastructure to support and scale your projects.

Let's Get Started!

We will create a simple React application, dockerize it, and deploy it to AWS using Opta IaC. Sounds cool, right?

Prerequisites

• Node
• Install Docker on your computer
• An AWS account. You can signup for free here

Create The React Application

Let us create the react application using create-react-app. Open Terminal and run the command.

npx create-react-app opta-react-deploy

Type Y to proceed. This will pull the react framework and install all its dependencies.

npx create-react-app react-opta-deploy
cd react-opta-deploy
npm start

These commands create the default React application name, change the directory to the folder, and start the application. When this happens, you should see the screen below or you visit. localhost:3000

Deploy to Docker

Deploying your application to Docker ensures a stable environment to run your code all the time, allows for components reusability, and can share dockerfile among developers to improve quick spin-up of projects with improved performance.

To deploy to Docker, ensure the Docker desktop app is currently running on your computer.

Open your code in your code editor. Go to the root and create a file, name it Dockerfile without extension, and has the same name as Dockerfile

Enter the code below:

FROM node: alpine
WORKDIR /app
COPY package.json ./
COPY package-lock.json ./
COPY ./ ./
RUN npm i
CMD ["npm", "run", "start"]

The first line pulls in Node, which we will use in running our application. Then we set the working directory to /app. Afterward, we copy package.json and package-lock.json to the /app working directory.

The RUN npm i runs the installation of node modules associated with the project into the Docker.

Then the last line runs npm run start , which is the command that will run the application and opens it in the browser.

Once this Dockerfile has been created and has these commands. Go to Terminal, ensure you're in the root directory of the project, then run the command:

docker build -f Dockerfile -t opta-react-deploy.

This command builds the react application into Docker still using the name opta-react-deploy. It will create a docker image that can run our application.

Then run the command below to run the docker image in the Docker container:

docker run -it -p 4001:3000 client

The command above exposes react port 3000 and maps it to port 4001 on Docker. After running this command, it will spin up the react application on port 4001. Visit http://localhost:4001, and you'll find your application there.

React application running on Docker

Now Let's Deploy to AWS using Opta.

Opta is a more straightforward IaC framework designed for Startups. It has all the cloud and security best practices, so your team never needs to worry about DevOps.

Terraform powers Opta under the hood — so you're never locked into a proprietary system and can always drop down to the Terraform layer when needed.

Setup Prerequisites

To deploy using Opta, you'll need the following prerequisites:

• Opta command-line tool
• Install Terraform from your Terminal
• AWS CLI

Install Opta command-line tool using the following command:

/bin/bash -c "$(curl -fsSL https://docs.opta.dev/install.sh)"

Install Terraform by running this command from your Terminal:

brew tap hashicorp/tap
brew install hashicorp/tap/terraform

Install AWS CLI with the command:

curl "https://awscli.amazonaws.com/AWSCLIV2.pkg" -o "AWSCLIV2.pkg"
sudo installer -pkg AWSCLIV2.pkg -target /

Go to the root folder of your React application and create a file named application.yaml This is the file that holds the configuration to deploy to AWS.

Type in the following YAML script

# application.yaml
name: develop # name of the environment
org_name: XXXXXX
providers:
    aws:
    region: us-east-1
    account_id: XXXXXX #Your 12 digit AWS account id
modules:
    - type: base
    - type: k8s-cluster
    - type: k8s-base

For org_nameVisit your AWS Console and copy the organization name to replace it with the XXXX

Same with account_id. It's your 12-digit ID from your AWS console.

These configs let Opta know where to deploy to

Authorize Opta to Deploy to AWS

You will need to grant permission to Opta to deploy to the specified AWS. In addition, you will need to retrieve the AWS Access Key ID and Secret Access Key.

Login to your AWS Console with root access and visit the URL:

https://us-east-1.console.aws.amazon.com/iam/home

If you have already created an Access Key, you will need to create a fresh one to access the Secret Access Key, which is only shown once at creation.

Create an Access Key, and a window pops up like so:

The Access Key ID is shown, but you must click Show to reveal the Secret Access Key.

Go to your Terminal and export the Access Key ID and Secret Access Key to the environment so that when you run the Opta command, it will pick it up. Like so:

export AWS_ACCESS_KEY_ID=your_access_key_id
export AWS_SECRET_ACCESS_KEY=your_secret_access_key

Alternatively, you can also create a .aws directory in your computer user's root, change to that directory and create a credential file (no extension), like this:

cd ~
mkdir .aws
cd .aws
touch credentials

Then paste the following code into it and replace your_access_key_id and your_secret_access_key with your Access Key and Secret Key, respectively.

[default]
aws_access_key_id = your_access_key_id
aws_secret_access_key = your_secret_access_key

You're Almost Done

Then, run the following code to deploy your React application to AWS using Opta.

opta apply -c application.yaml

This process will take approximately 12–15 minutes to complete, and it will setup:

• base
• k8s-cluster
• k8s-base

Once this process is done, you should see:

Opta updates are complete!

Viola 🎉! You have successfully deployed your app to AWS in easy steps.

How to Generate Terraform Code with Opta

How Cloud consultants use Opta to easily manage their workflows

Cleaning Up

It is worthy of note that this process incurs a charge of $5 per day on your AWS account. If you are running this for testing purposes, ensure you delete the resources by running the command:

opta destroy -c application.yaml

Should you experience any issues or unexpected errors at any point, feel free to reach out to Opta’s contributors on the slack channel here

Resources

Opta

Opta