DevOps Project-8

Project Description

The project involves deploying a react application on AWS Elastic BeanStalk using GitHub Actions. Git Hub actions allows you to perform CICD with GitHub Repository integrated.

Setting Up AWS Elastic Beanstalk:

1. 

   Create an Application: Start by creating an application on AWS Elastic Beanstalk.

2. Configure Environment:

   

   

3. Select Docker as the platform for your application.

   • Choose an existing service or create a new one.

   • 

     Create an IAM role with permissions (AWSElasticBeanstalkWebTier, AWSElasticBeanstalkWorkerTier, AWSElasticBeanstalkMulticontainerDocker) for Elastic Beanstalk.

4. Network Configuration:

   • Choose the Default VPC.

   • 

     Select instance subnets.

   • Use the default security group.

   • 

     Utilize a t3.medium instance type.

5. Default Settings: Proceed with default settings and submit your configuration.

6. 

   Environment Setup: After clicking "Submit," wait for the environment to be set up.

7. 

   Access Deployed App: To access your deployed app, navigate to the "Domain" section and use the provided URL. This link directs you to your live React app on AWS Elastic Beanstalk.

8. 

   Check Instance Status: Ensure that the instance is running.

   

9. GitHub Integration:

   • Retrieve the source code from GitHub.

   • 

     Enable CI/CD using GitHub Actions.

CI/CD Configuration with GitHub Actions:

1. Dockerfile Check: Verify the Dockerfile, ensuring it contains the necessary instructions for building the app.

    FROM node:14-alpine as builder
    WORKDIR /app 
    COPY package.json . 
    RUN npm install 
    COPY . .     
    RUN npm run build
   
    FROM nginx 
    EXPOSE 80 
    COPY --from=builder /app/build /usr/share/nginx/html
   

2. CI/CD Pipeline Configuration:

   • Locate and move the "deploy-react.yml" file under ".github/workflows." OR create a new file "mail.yml" with the same content.

   • 

     Update the file with relevant parameters, such as branch name, application name, environment name, AWS access key, AWS secret access key, and region.

    name: Deploy react application in BeanStalk
    on:
      push:
        branches:
          - "main"
    jobs:
      deploy: 
        runs-on: ubuntu-latest
        steps:
          - name: Checkout source code
            uses: actions/checkout@v2

          - name: Generate deployment package
            run: zip -r deploy.zip . -x '*.git*'

          - name: Deploy to EB
            uses: einaregilsson/beanstalk-deploy@v21
            with:
              aws_access_key: ${{ secrets.AWS_ADMIN_ACCESS_KEY_ID }}
              aws_secret_key: ${{ secrets.AWS_ADMIN_SECRET_ACCESS_KEY_ID }}
              application_name: reactapp
              environment_name: Reactapp-env
              version_label: ${{ github.sha }}
              existing_bucket_name: elasticbeanstalk-us-east-1-<your-AWS account ID>
              region: us-east-1
              deployment_package: deploy.zip

1. AWS Credentials:

   • Add your AWS access key and AWS secret access key as secrets in the GitHub repository settings.

     

2. GitHub Action Trigger:

   • Trigger the GitHub Action CI/CD pipeline by pushing changes to the "main" branch.

3. 

   Deployment Verification: Check and verify the successful deployment of instances.

4. 

   Environment Link Confirmation: Confirm the Elastic Beanstalk environment link for your React application.

By following these steps and incorporating the provided code snippets, you ensure a streamlined setup and deployment process for your React application on AWS Elastic Beanstalk with integrated CI/CD using GitHub Actions.

---

Thanks for following the project. See you in the next one.