GithubHelp home page GithubHelp logo

brightballo / final-exam Goto Github PK

View Code? Open in Web Editor NEW
2.0 4.0 1.0 563 KB

Deploying a react app and the socks app to EKS using Terraform and Helm charts on argocd and monitoring with prometheus and grafana combined with a CI/CD pipeline using Github Actions

HTML 11.68% CSS 6.31% JavaScript 21.38% Dockerfile 2.13% HCL 58.51%

final-exam's Introduction

image

Deploying a react app and the socks app to EKS using Terraform and Helm charts on argocd and monitoring with prometheus and grafana combined with a CI/CD pipeline using Github Actions

Prerequisites

  • AWS account
  • AWS CLI
  • Terraform
  • Helm
  • Kubectl
  • ArgoCD
  • Github account
  • Github Actions
  • Docker
  • NodeJS
  • NPM

Using the Infrastructure

  • The argocd ingress will be available at the following url: argocd.odeybright.me

  • the password for will be eU320p2Om7mEgwZG

  • The exam app will be available at the following url: http://app.odeybright.me

  • The socks app will be available at the following url: http://sockapp.odeybright.me

  • The grafana dashboard will be available at the following url: http://grafana.odeybright.me

  • The password for the grafana dashboard is nmhFkZHLZTaGgbzXxnikEAGsaHQih8MR0iqUxXJY

  • The prometheus dashboard will be available at the following url: http://prometheus.odeybright.me

  • The username for both the grafana and argocd dashboard is admin

  • The argocd_apps folder contains the deployment files for the exam app, the socks app and the monitoring stack (prometheus and grafana) and is plugged into the argocd deployment

  • The argocd_apps_2 folder contains the deployment files for the socks app and is plugged into the argocd deployment

  • The demo-app folder contains the code for the exam app and the Dockerfile for the exam app and is plugged into the Github Actions workflow

  • The terraform folder contains the terraform files for the infrastructure.

Deploying the infrastructure

  • Create a new directory and clone the repository
  • Create a new AWS account and create a new user with programmatic access
  • Configure the AWS CLI with the new user credentials
  • Create a new S3 bucket for the terraform state
aws s3api create-bucket --bucket <bucket-name> --region <region> --create-bucket-configuration LocationConstraint=<region>
  • configure the terraform backend in the main.tf file
terraform {
  backend "s3" {
    bucket = "<bucket-name>"
    key    = "terraform.tfstate"
    region = "<region>"
  }
}
  • Initialize the terraform backend
terraform init
  • run the terraform plan and apply
terraform plan
terraform apply
  • Create a new Github repository and push the code to the repository
  • Create a new Github Actions workflow and add the following code
name: CI/CD

on:
  push:
    branches: [ main ]

jobs:
    build:
        runs-on: ubuntu-latest
        steps:
        - uses: actions/checkout@v2
        - name: Set up QEMU
            uses: docker/setup-qemu-action@v1
        - name: Set up Docker Buildx
            uses: docker/setup-buildx-action@v1
        - name: Login to ghcr.io
            uses: docker/login-action@v1
            with:
            username: ${{ secrets.GHCR_USERNAME }}
            password: ${{ secrets.GHCR_PASSWORD }}
        - name: Build and push
            id: docker_build
            uses: docker/build-push-action@v2
            with:
            context: .
            push: true
            tags: ${{ secrets.ghcr.io }}/demo-app:latest
    ``` 
* Create a new DockerHub account and create a new repository
* Create a new secret in the Github repository with the DockerHub username and password
* locate the Dockerfile in the demo-app/ in the repository and change the image name to the DockerHub repository name
* Push the code to the Github repository and the workflow will start
* Create a new GHCR repository and push the image to the repository

```bash
docker tag socks-app:latest ghcr.io/<username>/socks-app:latest
docker push ghcr.io/<username>/socks-app:latest
  • Create a new secret in the Github repository with the GHCR username and password

  • Make sure the image name in the Dockerfile is correct

  • The terraform file labelled eks.tf will create the EKS cluster and the node group

  • The terraform file labelled argocd.tf will create the argocd deployment and the ingress

  • The deployment yamls located in the /argocd_apps/ directory will create the exam app, the socks app and the monitoring stack (prometheus and grafana) using helm only for the moitoring stacks.

  • The deployment files for the socks app are located in the /argocd_apps_2/ directory

  • The argocd ingress will be available at the following url: http://argocd./

  • The exam app will be available at the following url: http://exam-app./

  • The socks app will be available at the following url: http://socks-app./

  • The grafana dashboard will be available at the following url: http://grafana./

  • The prometheus dashboard will be available at the following url: http://prometheus./

  • Use the following command to get the argocd password

kubectl -n argocd get secret argocd-initial-admin-secret -o jsonpath="{.data.password}" | base64 -d
  • Use the following command to get the grafana password
kubectl get secret --namespace argocd grafana -o jsonpath="{.data.admin-password}" | base64 --decode ; echo
  • Use the following command to connect to the EKS cluster
aws eks --region  us-east-1 update-kubeconfig --name Altschool-staging

image

final-exam's People

Contributors

brightballo avatar timtech4u avatar m3rryqold avatar

Stargazers

Oluwasola Alufa avatar  avatar

Watchers

 avatar  avatar  avatar Ogunmola Rofiat avatar

Forkers

techebraheem

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.