AWS CodePipeline

Hands-On

Demo

In this Demo, we will:-
1. Create an S3 Bucket for Deployment
2. Enable Static Website Hosting
3. Create GitHub Repository
4. Connect AWS to GitHub via CodeConnections
5. Build the CodePipeline Pipeline
6. Review and Launch
7. Test Continuous Deployment
8. Clean up all the resources

Agenda

Visual Representation

Create S3 bucket

code-pipeline-demo-378174

Block all public access - Unchecked

Create bucket

Static website hosting

Enable Static website hosting

index.html

error.html

Save changes

Bucket policy

Edit bucket policy

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::your-bucket-name/*"
        }
    ]
}

Create GitHub Repo

aws-codepipeline-s3-demo

Create a new repository

Create new file

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>AWS CodePipeline Demo</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h1>Welcome to My Website!</h1>
    <p>This site was deployed automatically using AWS CodePipeline.</p>
    <p>Version 1.0</p>
</body>
</html>

index.html

Commit changes

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Error</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h1>404 - Page Not Found</h1>
    <p>Oops! The page you are looking for does not exist.</p>
</body>
</html>

error.html

body {
    font-family: Arial, sans-serif;
    text-align: center;
    margin-top: 50px;
    background-color: #f0f2f5;
    color: #333;
}
h1 {
    color: #d84a0c;
}