IQ. search Medium a +> Get unlimited access to the best of Medium for less than $1/week. Become a member Jenkins CI/CD pipeline with GitHub for Deploying React Docker application on EC2 instance. (BX Kishan Madhesiya - Follow Tmin read - Aug? ©) Listen (") Share + More Project 1: Creating an EC2 instance (Ubuntu) Log in to the AWS Console Select EC2 services Click on Launch Instance Enter name: jenkins-server Select Ubuntu (22.04)Instance type: t2.micro (free tier eligible) Create new key pair: Name: jenkins-server Key pair type: RSA Private key file format: .pem Click on Create button, It will automatically download the PEM file in your system. Select jenkins-server in the key pair. Now in a Network setting Select SSH, HTTPS, and HTTP. Click on Launch Instance. It will take some time to create and launch your instance. > eens > bowmasstnntne Instance summary for -015924a581cfa7A7« (jenkin-servet) no (2) Cenc] Crmtacesae +] Caton © 1 VOMsDee nde Griese) asissce ro] snrasaaetoss er commer, osssarasewets Project 2: Connecting EC2 instance over SSHGoto jenkins-server EC2 instance. Click on the Connect button. Select SSH Client Connect to instance in. Connect to your instance i-015924a55 1cf2747c (jenkins-server) using any of these options ECZInstance Connect | Session Manager | SSHclient | EC2 serial console Instance ID (Bi-0159240551¢fa7d7¢ (jenkine-server) 1. Open an SSH client 2. Locate your private key file. The key used to launch this instance is jenkins-serverpem 3. Run this command, if necessary, to ensure your key isnot publicly viewable. 1B) chmod 400 jenkins-server pem 4. Connect to your instance using its Public DNS: (&¢2-15-233-224-7.ap-south-1.computeamazonaws.com Example ESAS fenkinsSerVerpeme uountum@ecd=13-235°224-7apSORHT COMPLE AMEZOAAWSCOM © Note: in most cases, the quessed user name is correct. However, ead your AMI usage instructions to check if the AMI owner has changed the default AM! user name, Copy the Example marked line as shown above. and Open Terminal in your system. and go to the location of your Pem file in the terminal. cd Downloads (in my case) Run chmod 400 jenkins-server.pem (Linux) then paste ssh -i “jenkins-server.pem” ubuntu@ec2-13-233-224-7.ap-south- 1.compute.amazonaws.com You will be successfully logged in to your Ubuntu server.SCOR ee eat Now run ssh-keygen command, This will generate public and private keys in the machine. Your identification has been saved in /home/ubuntu/ssh/id_rsa Your public key has been saved in /home/ubuntu/.ssh/id_rsa.pub Project 3: Installation of Jenkins and Docker. Goto: https://www,jenkins.io/doc/book/installing/linux/#debianubuntu And follow the installation instructions. Or run the below commands sudo apt update sudo apt install openjdk-17-jre curl -fsSL_ https: //pkg.jenkins. io/debian-stable/jenkins.io-2023.key | sudo ty /usr/share/keyrings/jenkins-keyring.asc > /dev/null echo deb [signed-by=/usr/share/keyrings/jenkins-keyring.asc] \ https: //pkg.jenkins.io/debian-stable binary/ | sudo tee \ /etc/apt/sources. List.d/jenkins.list > /dev/nult sudo apt-get update sudo apt-get install jenkins sudo apt install apt-transport-https ca-certificates curl software-propertiecurl echo sudo -fsSL https: //download.docker.com/Linux/ubuntu/gpg | sudo gpg --dearmor "deb [arch=§(dpkg ~-print-architecture) signed-by=/usr/share/keyrings/d apt update apt-cache policy docker-ce sudo sudo sudo sudo apt install docker-ce systemctl start docker systemctl status docker chmod 666 /var/run/docker.sock Now check Docker and Jenkins versions as shown below pelos ee ae ei Pee ea eel) Docker version 20.10.25, build 20.10.25-Qubuntul~22.04.1 a Now change the security group to allow 8080 and 8081 Goto AWS EC2 instance (jenkins-server) Click on the Security tab Click on the security group (shown below image) spose we nae leet sroumeenane 2 ve 0000 ached sr rare aes ve e200" lercrdGClick on Edit Inbound Rules (shown in below image). Inbound rales 3) @ Pra a 1> @ sposaremssarisn... Wt rs ve we Click on Add Rule and allow 8080 and 8081 (shown in below image). teinrenmain ee ne tet Ree ae onan aaa osssemersns ts 7) 0) [awn + [a ae [oases % Tr = — = [poco — we ae — as And save the Rules. Now go to your EC2 instance (jenkins-server) Copy the public IP and open the below URL in the browser. hittp://13.233.224.7:8080 (13.233.224.7 is my public ip)Unlock Jenkins In the terminal of your ec2 instance run : sudo -i cat /var/lib/Jenkins/secrets/initialAdminPassword errr PLT seer orl a Ee CAC ASL Yeu EU Pesce UL ocerins) ureters xorea jenkins.model.Jenkins.crumbSalt master. key re eA Ae Ue u tury etos eae Urest eC eee Peo tpeet ee eee) Copy the password and paste it into Jenkins URL in the browser. Customize Jenkins Install suggested Select plugins ta pluginsAfter login, you will be able to see the above page. Now Click on Install Suggested Plugins. All required plugins will be downloaded as shown in the below image. Now Jenkins will ask us to create the First Admin User. ong Sana Create First Admin User Enter the details in the required fields and click on Save and Continue button.Instance Configuration Click Save and Fi ish and Start using Jenkins. Welcome to Jenkinst Project 4: Create a demo react js project and GitHub repo. Open your terminal and run the below command: npx create-react-app react-docker This will create a reactjs project in your system. Now go to the project root directory| cd react-docker Create .dockerignore file and add **/node_modules in the same file. Now create Dockerfile and paste the below code # Fetching the latest node image on apline linux FROM node:alpine AS builder # Declaring env ENV NODE_ENV production # Setting up the work directory WORKDIR /app # Installing dependencies COPY ./package.json ./yarn.lock ./ RUN yarn # Copying all the files in our project COPY.. # Building our application RUN yarn run build # Fetching the latest nginx image FROM nginx # Copying built assets from builder COPY — from=builder /app/build /usr/share/nginx/html # Copying our nginx.conf COPY . /nginx/nginx.conf /ete/nginx/conf.d/default.conf Now create a directory/folder nginx and create a file nginx.conf in the nginx folder paste the below code in nginx.conf server { listen 80;server_name localhost; root /usr/share/nginx/html; index index.html index.htm; include /ete/nginx/mime.types; gzip on; gzip_min_length 1000; gzip_proxied expired no-cache no-store private auth; gzip_types text/plain text/css application/json application/javascript application/x- javascript text/xml application/xml application/xml+rss text/javascript; location / { try_files $uri Suri/ /index. html; } } Now login to your GitHub account and create a repo react-docker Push the react-docker project to your git repo. (Follow the instructions of the github) git remote add origin https://github.com/kishanmadhesiya/react-docker.git git branch -M main git push -u origin main Project 5: Create a Jenkins pipeline and configure it with GitHub Webhook From Jenkins Dashboard, Click on New ItemDashboard People Build History Manage Jenkins 082 @ & My Views and Enter the project name: react-docker Select freestyle project and click on the OK button. ‘=e on =You will be redirected to the Configuration page. Enter Description General tnd we Daca od be spot partied 7 In the Source Code Management section Select GIT and paste the repo URL. Eg: https://github.com/kishanmadhesiya/react-docker.git and Select credentials. If the credentials are blank then you need to create using Add button. Source Code Management easton ¢ In Branches to Build enter your branch name.Banc Speier blnforany) a) Revostry rons t ou) Now in Build Steps Select Execute shell Bull Steps And paste the below commands and Save. docker build -t react-docker . docker run -d -p 80:80 react-dockerBuild Steps the Et of woable erent vb Now open your project on the Jenkins portal and click on Build Now. Dashboard > reactdocker © status

Changes Workspace Build Now TH Delete Project @ Rename Build History trend v Now go to the Jenkins project Dashboard and click on Configure (Shown above). In Build Triggers options select GitHub hook trigger for GitScm polling and Save. Now open your GitHub account, go to your project repo and click on SettingsClick on Webhooks and Add WebHooks. a 8 © cule Otawe M1 puegee © Actors El pcs lve © Sassy tS magne Sage whoo == In Payload URL add http: //{your-jenkins-url}:{port}/github-webhook/ (In my case http:/ 115:8080/github-webhook/) Content type: application/json Which events would you like to trigger this webhook? : Select Let me select individual events. Now Select Pull Requests and Pushes. Mark as Active and click on Add Webhook. Jenkins Docker CiCd Pipeline AWS Automation21) erate mtr a been > Ocal Otmm NL Atmame Cen Bron Doth CO Seny eta ana cms Webhooks / Manage webhaok a 7 | stent tnt ado pti te Doe span Sne Sia ia 2 ate ~ | es cote I 2 cary i © wedemner P ontrin Oseteemetig se in + eens pet eecsrergroeerraraney5 {© Kishan Madhesiya N hi 5.4 ji sh the ch: ‘ith heck Jovi gnake any changes pagT elect Push the changes on Github, and chec! the Jenkins roject dashboard, You will find that, it will automatically create a In this article, we will work on Jenkins Declarative Pipelines, before proceed | will hnild denlavinathe.came.on.unur-seruer with Docker aws —S Ss Sign up for AWS Explore Free Tir products witha fost mati ew AWS acount. : (eee Tole et nana ce, — D ae oe a © etowmieas rors ~ ©& Kishan Madhesiya Create AWS Free Account for Testing or Learning Open the AWS signup URL: https://portal.aws.amazon.com/billing/signup Sminread - Aug6 Hs Q oo ( See all from Kishan Madhesiya Recommended from Medium{. Amazon RDS MySQL DataBase 4 Amazon EKS B& cumnur Mesut Akkaya Working with Microservices-14: Creating Amazon RDS MySQL database for Kubernetes cluster in the... We continue our Production Pipeline. In this section, we will use Amazon RDS instead of MySQL pod and service during the Production stage... Tmin read - Aug 16 7@ Fuzait Anmes Create and Host a Wordpress Website on AWS EC2 with your own domain name aunch an instance Step t: Amin read» Jun 14 Lists Coding & Development Mstories - 133 saves The New Chatbots: ChatGPT, Bard, and Beyond 19stories . 99 saves New_Reading_List TAstories - 87 saves Now in Al: Handpicked by Better Programming 266 stories » 110 saves Updates _ Alls ast Seiea res@ Aman Pathak in Devops.dev Deployed Java application using Maven, Sonarqube, Jfrog Artifactor, Jenkins, ArgoCD and finally. How to build, test, Code Analysis, Upload build Artifacts, build docker Image, Push docker Image and Deploy the Java-based Application? Qminread - May 19 com - istered docker & kitama Build and Deploy a ReactJS App to AWS EC2 with Docker, NGINX, and Automate with GitHub Actions. In today’s digital landscape, master the art of building, deploying and automating ReacS Apps using Docker, NGINX and GitHub actions on. 1Ominread - 6daysago® ssanjanathamke Day 24 Task: Complete Jenkins CI/CD Project Let's make a beautiful CI/CD Pipeline for your Node JS Application Amin read » Mar 8 He Q we HOW TO INSTALL & AWS CL@ navidohoaghaitar How to create Ec2 instance and AMI with automated Apache server via AWS console and AWS CLI This article provides a step-by-step guide to create an EC2 instance, update all packages, install and start Apache webserver using a... 6minread - May 15 ( See more recommendations