updated the complete application

DevRelSquad-blogs · Oct 29, 2024 · 924ced2 · 924ced2
1 parent 5a57d1e
commit 924ced2
Show file tree

Hide file tree

Showing 5 changed files with 109 additions and 5 deletions.
diff --git a/README.md b/README.md
@@ -1,5 +1,81 @@
-# automate-github-actions-using-rest-api
-This is a sample node.js project for which github actions cicd workflow file is automated using the github rest apis
+# Automate Github Actions Using GitHub REST API
+This project is a demonstration of automating a GitHub Actions CI/CD pipeline using the GitHub REST API, integrated into a simple Node.js web application. The application includes a button to trigger the CI/CD pipeline directly from the frontend, providing an interactive way to manage the workflow.
 
+## Features
+- **GitHub Actions Integration :** Uses GitHub REST API to trigger a workflow directly from the application.
+- **Interactive UI :** A button on the web interface initiates the CI/CD pipeline.
+- **REST API Usage :** Demonstrates how to call the GitHub REST API from within a Node.js server.
+- **CORS Enabled :** Ensures the frontend can communicate with the backend on the same server.
 
-- `server.js`: This file will serve an HTML page and include an endpoint to trigger the GitHub Actions workflow.
+## Project Structure
+```bash
+demo-ci-cd-app/
+├── .env                 # Environment variables (GitHub token)
+├── .github/
+│   └── workflows/
+│       └── main.yml     # GitHub Actions workflow file
+├── public/
+│   └── index.html       # Frontend HTML file
+├── server.js            # Node.js server file
+├── package.json         # Node.js project configuration
+└── README.md            # Project documentation
+└── node_modules         # Project dependencies
+```
+
+## Installation
+### Step 1: Clone the Repository
+
+```bash
+git clone https://github.com/YOUR_USERNAME/demo-ci-cd-app.git
+cd automate-github-actions-using-rest-api
+```
+
+### Step 2: Install Dependencies
+
+```bash
+npm install
+```
+
+### Step 3: Set Up Environment Variable
+Create a .env file in the root directory:
+
+```bash
+GITHUB_TOKEN=your_personal_access_token
+# Replace your_personal_access_token with your GitHub Personal Access Token (with repo and workflow permissions).
+```
+
+### Step 4: Configure GitHub Actions Workflow:
+
+Go to the `.github/workflows/main.yml` file and ensure it has the following setup:
+
+```yaml
+name: CI/CD Pipeline
+
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - main
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout Code
+        uses: actions/checkout@v2
+
+      - name: Display Message
+        run: echo "CI/CD Pipeline is triggered successfully!"
+```
+
+### Step 5: Start the Server:
+
+```bash
+node server.js
+```
+
+### Access the Application
+
+- Open your browser and go to http://localhost:3000.
+- Click on the Trigger CI/CD Pipeline button. This will make a POST request to the GitHub API to start the workflow.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -11,6 +11,7 @@
   "license": "ISC",
   "dependencies": {
     "axios": "^1.7.7",
+    "cors": "^2.8.5",
     "dotenv": "^16.4.5",
     "express": "^4.21.1"
   }

diff --git a/public/index.html b/public/index.html
@@ -7,7 +7,7 @@
     <title>Demo CI/CD App</title>
 </head>
 <body>
-    <h1>Demo CI/CD Application</h1>
+    <h1>Demo CI/CD Applications</h1>
     <button onclick="triggerWorkflow()">Trigger CI/CD Pipeline</button>
     <p id="status"></p>
 

diff --git a/server.js b/server.js
@@ -2,19 +2,23 @@
 const express = require('express');
 const axios = require('axios');
 const path = require('path');
+const cors = require('cors');
 require('dotenv').config();
+console.log('GitHub Token:', process.env.GITHUB_TOKEN);
 
 const app = express();
 const PORT = 3000;
 
+app.use(cors());
+
 // Serve static HTML files
 app.use(express.static(path.join(__dirname, 'public')));
 
 // Endpoint to trigger GitHub Actions workflow
 app.post('/trigger-workflow', async (req, res) => {
   try {
     const response = await axios.post(
-      `https://api.github.com/repos/aman1905/automate-github-actions-using-rest-api/actions/workflows/main.yml/dispatches`,
+      `https://api.github.com/repos/YOUR_USERNAME/automate-github-actions-using-rest-api/actions/workflows/main.yml/dispatches`,
       { ref: "main" },
       {
         headers: {