Streamline Your Development Workflow with AWS Amplify’s Deployment Environment

As a software team, it’s crucial to have a streamlined process for testing and deploying new features. With AWS Amplify, deploying and testing your application becomes easy by creating separate environments for pull requests and ensuring seamless integ…


This content originally appeared on DEV Community and was authored by Oluwatimilehin Odubola

As a software team, it's crucial to have a streamlined process for testing and deploying new features. With AWS Amplify, deploying and testing your application becomes easy by creating separate environments for pull requests and ensuring seamless integration into the main software branch.

Development team can generate separate testing environments where work can be evaluated before going live without affecting production.

In this article, we will explore using AWS Amplify to deploy a React application and setting up a deployment environment for pull requests.

Prerequisite

  • Make sure to have Node/NPM installed on your computer. To install, click here for a guide.

  • Verify we have Node.js installed by using the following terminal command

  • Basic understanding of JavaScript / ReactJs
    Understanding of Version Control systems i.e. Github, Gitlab, Bitbucket, etc.

  • An AWS account where you can access Amplify

To complete this course, you will need a React application hosted on a remote repository. To expedite the process, I will assume that you already have a React project hosted on your preferred source code repository hosting site. In this case, we will be using GitHub.

If not, you can take a look at create-react-app docs and push to a remote GitHub repository.

Hosted React app on GitHub

Now that we're done with housekeeping, so let's hop over to AWS Amplify to connect to our git repository and launch the application.

On the Amplify dashboard, we are going to be clicking on - "Amplify Hosting Option"

AWS Amplify dashboard

After which, we will connect our source code repository, as stated earlier, I am using Github, so I will be selecting Github and giving it the necessary permissions to the code repository. 

source code repository selection

Granting AWS Amplify necessary permission

Once the necessary permissions are granted, Amplify will display a list of permitted project repositories. From here, we can select the application we want to deploy, choose the branch, and set any necessary environment variables. After that, we can click on Save & Deploy to initiate the deployment process.

AWS Amplify  settings page

Now Amplify will start building and after a couple of minutes, you'll be presented with the deployed app link. Now, If you modify your code and push it into the master branch, it will rebuild and re-deploy your app automatically.

Completed Deployment portal page

Now, let's configure Amplify to work with branches created on the repository, so we can have a deployment link before merging a pull request. To do this, click on Preview located on the right side of the options panel and enable it by selecting Enable Preview.

Previews Page

Once, that is done, we can test by creating a new branch, making some code changes, and raising a PR against the main. 

New Brach deployed

As demonstrated, AWS Amplify enables the creation of a new deployment link for PR branches, allowing for testing in a separate environment before merging with the main branch. This tool can greatly enhance your development process, and I hope this article has been helpful in showcasing its capabilities.

If you have any questions or contributions, please let me know in the comments below. Don't forget to like and share. Thank you for reading!


This content originally appeared on DEV Community and was authored by Oluwatimilehin Odubola


Print Share Comment Cite Upload Translate Updates
APA

Oluwatimilehin Odubola | Sciencx (2023-05-08T16:25:24+00:00) Streamline Your Development Workflow with AWS Amplify’s Deployment Environment. Retrieved from https://www.scien.cx/2023/05/08/streamline-your-development-workflow-with-aws-amplifys-deployment-environment/

MLA
" » Streamline Your Development Workflow with AWS Amplify’s Deployment Environment." Oluwatimilehin Odubola | Sciencx - Monday May 8, 2023, https://www.scien.cx/2023/05/08/streamline-your-development-workflow-with-aws-amplifys-deployment-environment/
HARVARD
Oluwatimilehin Odubola | Sciencx Monday May 8, 2023 » Streamline Your Development Workflow with AWS Amplify’s Deployment Environment., viewed ,<https://www.scien.cx/2023/05/08/streamline-your-development-workflow-with-aws-amplifys-deployment-environment/>
VANCOUVER
Oluwatimilehin Odubola | Sciencx - » Streamline Your Development Workflow with AWS Amplify’s Deployment Environment. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2023/05/08/streamline-your-development-workflow-with-aws-amplifys-deployment-environment/
CHICAGO
" » Streamline Your Development Workflow with AWS Amplify’s Deployment Environment." Oluwatimilehin Odubola | Sciencx - Accessed . https://www.scien.cx/2023/05/08/streamline-your-development-workflow-with-aws-amplifys-deployment-environment/
IEEE
" » Streamline Your Development Workflow with AWS Amplify’s Deployment Environment." Oluwatimilehin Odubola | Sciencx [Online]. Available: https://www.scien.cx/2023/05/08/streamline-your-development-workflow-with-aws-amplifys-deployment-environment/. [Accessed: ]
rf:citation
» Streamline Your Development Workflow with AWS Amplify’s Deployment Environment | Oluwatimilehin Odubola | Sciencx | https://www.scien.cx/2023/05/08/streamline-your-development-workflow-with-aws-amplifys-deployment-environment/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.