harik8 · harik8 · Dec 12, 2025 · Dec 12, 2025 · Dec 12, 2025 · Dec 12, 2025
diff --git a/.github/workflows/main.yaml b/.github/workflows/main.yaml
@@ -0,0 +1,49 @@
+name: PUBLISH
+
+on: push
+
+permissions:
+  id-token: write # This is required for requesting the JWT
+  contents: read  # This is required for actions/checkout
+
+jobs:
+  S3_SYNC:
+    runs-on: ubuntu-latest
+
+    steps:
+    - name: Checkout repository
+      uses: actions/checkout@v4
+      with:
+        fetch-depth: 2
+
+    - name: AWS - Set AWS Credentials
+      uses: aws-actions/configure-aws-credentials@v5.1.1
+      with:
+        aws-region: ${{ vars.AWS_REGION }}
+        role-to-assume: ${{ secrets.AWS_IAM_GITHUB_OIDC_ROLE_ARN }}
+        role-session-name: gh_set_aws_credentials
+
+    - name: AWS - Assume Role
+      id: aws_assume_role
+      uses: aws-actions/configure-aws-credentials@v5.1.1
+      with:
+        aws-region: ${{ vars.AWS_REGION }}
+        role-to-assume: ${{ secrets.AWS_IAM_ASSUME_ROLE_ARN }}
+        role-session-name: gh_assume_role
+        role-chaining: true
+
+    - name: AWS - S3 sync
+      run: |
+        # Mask sensitive info from logs
+        set +e
+        OUTPUT=$(aws s3 sync ./src s3://${{ secrets.AWS_S3_HP_DOT_DEV_S3_BUCKET }}/static --delete 2>&1)
+        EXIT_CODE=$?
+        if [ $EXIT_CODE -ne 0 ]; then
+          echo "S3 upload failed"
+          echo "$OUTPUT" | \
+          sed 's/arn:aws:iam::[0-9]*:/arn:aws:iam::***:/g' | \
+          sed 's/arn:aws:sts::[0-9]*:/arn:aws:sts::***:/g' | \
+          sed 's/assumed-role\/[^/]*/assumed-role\/***\//g' | \
+          sed 's/arn:aws:s3:::[^"]*"/arn:aws:s3:::***"/g'
+        fi
+        exit $EXIT_CODE
diff --git a/README.md b/README.md
@@ -1 +1 @@
-# hari.karthigasu.io
+# hariprasad.dev
diff --git a/assets/img/Hari_Karthigasu.pdf b/assets/img/Hari_Karthigasu.pdf
diff --git a/assets/img/dp.png b/assets/img/dp.png
diff --git a/index.html b/index.html
diff --git a/src/icons/aws.png b/src/icons/aws.png
diff --git a/src/icons/cicd.png b/src/icons/cicd.png
diff --git a/src/icons/docker.png b/src/icons/docker.png
diff --git a/src/icons/golang.png b/src/icons/golang.png
diff --git a/src/icons/kubernetes.png b/src/icons/kubernetes.png
diff --git a/src/icons/python.png b/src/icons/python.png
diff --git a/src/img/dp-new.jpeg b/src/img/dp-new.jpeg
diff --git a/src/index.html b/src/index.html
@@ -0,0 +1,172 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <script src="https://code.iconify.design/1/1.0.5/iconify.min.js"></script>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
+    <meta name="description" content="Hari Karthigasu's personal portfolio website, a Cloud, DevOps, and Platform Engineer based in The Netherlands." />
+    <meta name="author" content="Hari Karthigasu" />
+    <title>Hari Prasad Karthigasu</title>
+    <script src="https://use.fontawesome.com/releases/v5.12.1/js/all.js" crossorigin="anonymous"></script>
+    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css" />
+    <link href="https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic" rel="stylesheet" type="text/css" />
+    <link href="/static/styles.css" rel="stylesheet" />
+</head>
+<body id="page-top">
+    <nav class="navbar navbar-expand-lg bg-secondary text-uppercase fixed-top" id="mainNav">
+        <div class="container">
+            <a class="navbar-brand js-scroll-trigger" href="#page-top">ஹரி கார்த்திகேசு</a>
+            <button class="navbar-toggler navbar-toggler-right text-uppercase font-weight-bold bg-primary text-white rounded" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
+                Menu <i class="fas fa-bars"></i>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarResponsive">
+                <ul class="navbar-nav ml-auto">
+                    <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded js-scroll-trigger" href="#">About</a></li>
+                    <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded js-scroll-trigger" href="#contents">Contents</a></li>
+                    <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded js-scroll-trigger" href="#stack">Tech</a></li>
+                    <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded js-scroll-trigger" href="#footer">Contact</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+    <header class="masthead bg-primary text-white text-center">
+        <div class="container d-flex align-items-center flex-column">
+            <img class="masthead-avatar mb-5 rounded-circle" src="/static/img/dp-new.jpeg" alt="Hari Karthigasu's profile picture" />
+            <div class="divider-custom divider-light">
+                <div class="divider-custom-line"></div>
+                <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
+                <div class="divider-custom-line"></div>
+            </div>
+            <p class="masthead-subheading font-weight-light mb-0">Hi, I'm Hari — a passionate Cloud, DevOps, and Platform Engineer based in The Netherlands. With over a decade of hands-on experience, I’ve worked on everything from traditional data centers to modern, scalable cloud.
+                I mainly work with AWS and follow DevOps practices, focusing on building solutions that are reliable, automated, and efficient. <br><br>
+                Since 2021, I’ve been part of the AWS Community Builders program, where I share what I learn through articles and videos.
+                I enjoy solving real-world problems and sharing the lessons I’ve learned <br><br> In my spare time, I enjoy biking, going for walks, and doing photography.
+            </p>
+        </div>
+    </header>
+
+    <section class="page-section bg-light" id="contents">
+        <div class="container">
+            <h2 class="page-section-heading text-center text-uppercase text-secondary mb-0">Contents</h2>
+            <div class="divider-custom">
+                <div class="divider-custom-line"></div>
+                <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
+                <div class="divider-custom-line"></div>
+            </div>
+            <h4 class="text-uppercase text-left text-secondary mt-5">Popular</h4>
+            <div class="row justify-content-center" id="popular-posts">
+                <div class="col-md-6 col-lg-4 mb-5">
+                    <div class="card h-100 shadow border-0">
+                        <div class="card-body d-flex flex-column">
+                            <h5 class="card-title"><u>VIDEO</u> - AWS SES Send HTML Template EMail.</h5>
+                            <p class="card-text">AWS SES Send HTML Template EMail.</p>
+                            <a href="https://www.youtube.com/watch?v=64Ut2HZbyWw" target="_blank" class="btn btn-primary mt-auto">View</a>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-md-6 col-lg-4 mb-5">
+                    <div class="card h-100 shadow border-0">
+                        <div class="card-body d-flex flex-column">
+                            <h5 class="card-title"><u>ARTICLE</u> - When multiple identical VPC CIDRs compete for an AWS Transit Gateway!</h5>
+                            <p class="card-text">When multiple identical VPC CIDRs compete for an AWS Transit Gateway!.</p>
+                            <a href="https://medium.com/p/10e086eddc70" target="_blank" class="btn btn-primary mt-auto">View</a>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-md-6 col-lg-4 mb-5">
+                    <div class="card h-100 shadow border-0">
+                        <div class="card-body d-flex flex-column">
+                            <h5 class="card-title"><u>ARTICLE</u> - Understanding self-assumption and scoped-down policy in AWS IAM</h5>
+                            <p class="card-text">Understanding self-assumption and scoped-down policy in AWS IAM.</p>
+                            <a href="https://dev.to/aws-builders/understanding-self-assumption-and-scoped-down-policy-in-aws-iam-2io" target="_blank" class="btn btn-primary mt-auto">View</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <h4 class="text-uppercase text-left text-secondary mt-5">Recent</h4>
+            <div class="row justify-content-center" id="devto-posts">
+                </div>
+        </div>
+    </section>
+
+    <section class="page-section" id="stack">
+        <div class="container text-center">
+            <h2 class="page-section-heading text-center text-uppercase text-secondary mb-4">Tech</h2>
+            <div class="divider-custom mb-4">
+                <div class="divider-custom-line"></div>
+                <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
+                <div class="divider-custom-line"></div>
+            </div>
+            <p class="lead tech-stack-line">
+                <img src="/static/icons/aws.png" alt="AWS" title="AWS" width="50" height="50" style="margin: 0 25px;" />
+                •
+                <img src="/static/icons/kubernetes.png" alt="Kubernetes" title="Kubernetes" width="50" height="50" style="margin: 0 25px;" />
+                •
+                <img src="/static/icons/cicd.png" alt="Jenkins" title="Jenkins" width="50" height="50" style="margin: 0 25px;" />
+                •
+                <img src="/static/icons/python.png" alt="Python" title="Python" width="50" height="50" style="margin: 0 25px;" />
+                •
+                <img src="/static/icons/golang.png" alt="Golang" title="Golang" width="50" height="50" style="margin: 0 25px;" />
+            </p>
+        </div>
+    </section>
+
+    <footer class="footer text-center">
+        <div class="container" id="footer">
+            <div class="row">
+                <div class="col-lg-4 mb-5 mb-lg-0">
+                    <h4 class="text-uppercase mb-4"></h4>
+                    <p class="lead mb-0"><br /></p>
+                </div>
+                <div class="col-lg-5 mb-5 mb-lg-0">
+                    <h4 class="text-uppercase mb-4">Find Me</h4>
+                    <a class="btn btn-outline-light btn-social mx-1" href="https://github.com/harik8/" aria-label="GitHub"><i class="fab fa-fw fa-github"></i></a>
+                    <a class="btn btn-outline-light btn-social mx-1" href="https://www.linkedin.com/in/hari-karthigasu/" aria-label="LinkedIn"><i class="fab fa-fw fa-linkedin-in"></i></a>
+                    <a class="btn btn-outline-light btn-social mx-1" href="https://www.youtube.com/@harikarthigasu" aria-label="YouTube"><i class="fab fa-fw fa-youtube"></i></a>
+                    <a class="btn btn-outline-light btn-social mx-1" href="https://medium.com/@harik8" aria-label="Medium"><i class="fab fa-fw fa-medium"></i></a>
+                    <a class="btn btn-outline-light btn-social mx-1" href="https://www.dev.to/harik8" aria-label="Dev.to"><i class="fab fa-fw fa-dev"></i></a>
+                    <a class="btn btn-outline-light btn-social mx-1" href="https://www.instagram.com/hari.praxad/" aria-label="Instagram"><i class="fab fa-fw fa-instagram"></i></a>
+                </div>
+                </div>
+        </div>
+    </footer>
+    <section class="copyright py-4 text-center text-white">
+        <div class="container"><small>Copyright © hariprasad.dev 2025</small></div>
+    </section>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>
+    <script src="assets/mail/jqBootstrapValidation.js"></script>
+    <script src="assets/mail/contact_me.js"></script>
+    <script src="js/scripts.js"></script>
+    <script>
+        fetch("https://dev.to/api/articles?username=harik8&per_page=6")
+            .then(response => response.json())
+            .then(data => {
+                const postsContainer = document.getElementById("devto-posts");
+                if (data.length > 0) {
+                    data.forEach(post => {
+                        const postHTML = `
+                            <div class="col-md-6 col-lg-4 mb-5">
+                                <div class="card h-100 shadow border-0">
+                                    <div class="card-body d-flex flex-column">
+                                        <h5 class="card-title">${post.title}</h5>
+                                        <p class="card-text">${post.description}</p>
+                                        <a href="${post.url}" target="_blank" class="btn btn-primary mt-auto">View</a>
+                                    </div>
+                                </div>
+                            </div>`;
+                        postsContainer.innerHTML += postHTML;
+                    });
+                } else {
+                    postsContainer.innerHTML = '<div class="col-12"><p class="text-center">No recent posts found.</p></div>';
+                }
+            })
+            .catch(error => {
+                console.error("Error fetching blog posts:", error);
+                const postsContainer = document.getElementById("devto-posts");
+                postsContainer.innerHTML = '<div class="col-12"><p class="text-center text-danger">Failed to load recent posts. Please try again later.</p></div>';
+            });
+    </script>
+</body>
+</html>
diff --git a/js/scripts.js → src/scripts.js b/js/scripts.js → src/scripts.js