Lab
A Cloud Guru

Deploying and Updating a Web Application with a CI/CD Pipeline Using AWS CodeStar

As a budding DevOps engineer, you want to use a variety of AWS services to smooth your development pipeline. Specifically, you want to set up an AWS native CI/CD workflow. In this hands-on lab, we look at how to use AWS CodeStar to automate the setup of a CodeStar project, including AWS CodeCommit, AWS CodeDeploy, and AWS CodePipeline.

Try for free Contact sales

Path Info

Level

Beginner

Duration

1h 0m

Published

Nov 20, 2019

Challenge

Create a CodeStar Project
1. Navigate to the AWS CodeStar console page.
2. Click Start a project.
3. In the Create service role dialog box, select Yes, create role.
4. In the Filter text box toward the upper left, type "Website".
5. Select the HTML 5 Website card option to create a CodeStar project based on a website.
6. For the Project name, enter "Lab Project".
7. Notice the Project ID and the Repository name have been auto-filled for you.
8. Select AWS CodeCommit as your repository type and click Next.
9. Click Create Project.
10. When prompted, click Amazon EC2 Management Console link to create an EC2 key pair.
11. Return to the CodeStar console, press the refresh button located to the right of the Select a Key Pair dropdown menu, select the key you just made, check the box to acknowledge you have the key, and click Create Project.
12. When prompted, enter your name as the Display Name and an email address (can be fake) in the Email text box.
13. Click Next.
14. For Pick how you want to edit your code, select AWS Cloud9.
15. Click Next.
16. Accept the default options for the Cloud9 environment, and click Next.
Challenge

Review the Deployed Website
1. Within the CodeStar project page, click the link in the Application endpoints card.
2. The web page we deployed should now load.
Challenge

Deploy a Change to the Website
1. From the CodeStar project page, from the AWS Cloud9 environments card, click See my environments.
2. From the card that shows the Cloud9 environment, click Open IDE.
3. When Cloud9 loads, navigate to the folder lab-project > lab-project > webpage, and load the file index.html.
4. Locate some text within the HTML that is displayed on the page (e.g., "Congratulations") and change this text to something else (e.g., "This lab is great!").
5. Save the file index.html.
6. In the Bash console panel at the bottom of the Cloud9 IDE, enter the following commands:
```
cd ~/environment/lab-project/
git add .
git commit -m "This is my change."
git push
```
7. Navigate to the CodeStar project console page, where you should now see CodePipeline deploying the changes you made.
8. Navigate back to the application endpoint (if the tab was already open, refresh it), and see the changes you made to the website.

Author

A Cloud Guru

The Cloud Content team comprises subject matter experts hyper focused on services offered by the leading cloud vendors (AWS, GCP, and Azure), as well as cloud-related technologies such as Linux and DevOps. The team is thrilled to share their knowledge to help you build modern tech solutions from the ground up, secure and optimize your environments, and so much more!

What's a lab?

Hands-on Labs are real environments created by industry experts to help you learn. These environments help you gain knowledge and experience, practice without compromising your system, test without risk, destroy without fear, and let you learn from your mistakes. Hands-on Labs: practice your skills before delivering in the real world.