🚀 How I Built & Deployed a Real DevOps Project from Scratch (AWS → GitHub → Netlify)

A few weeks ago, I decided to stop only learning DevOps theory and finally build a real end-to-end project.

Not a tutorial project.
Not a local demo.
A real cloud → CI/CD → live website pipeline.

Today, my app is live on the internet 🌍 and this is the full story.

---

🎯 The Challenge I Gave Myself

I wanted to simulate how real companies work.

Instead of:
“Build React app → run locally”

I wanted:
Developer → Cloud → GitHub → CI/CD → Production

So I set a goal:

Build a React application using AWS infrastructure and deploy it with an automated pipeline.

---

☁️ Step 1 — Building My Own AWS Cloud Environment

Before writing any code, I created real AWS networking.

This was my first time building infrastructure from scratch.

I created:

• Custom VPC (10.0.0.0/16)
• Public Subnet (10.0.1.0/24)
• Internet Gateway
• Route Table with public internet route
• Security Group (SSH + HTTP access)

Finally, I launched an Ubuntu EC2 instance inside this VPC.

At this point I had my own mini cloud environment 😄
This is the moment DevOps stopped being theory and started feeling real.

---

💻 Step 2 — Developing Inside the Cloud (EC2)

Instead of coding locally, I connected to EC2 using SSH and turned it into my development machine.

I installed:

• NodeJS
• Git
• NPM

Then I created a React application directly on the server.

Yes… I was literally coding inside AWS ☁️

---

🎮 Step 3 — Building a Real React Application

I didn’t want a simple “Hello World”.

So I built a KBC-style AWS Quiz App.

Features I added

🔐 Login page (demo credentials)
⏱ Timer per question
📊 Progress bar
🏆 Score tracking
🌙 Dark / Light theme toggle
💾 High score saved in browser
🔀 Questions shuffle every session
🔄 Restart quiz functionality

At this point, the project started feeling like a real product.

---

🐙 Step 4 — Turning It Into a Professional GitHub Project

Next, I moved the project to GitHub.

This step taught me a lot:

• Initialized Git repo on EC2
• Created GitHub repository
• Generated Personal Access Token
• Pushed project securely
• Wrote a professional README
• Added architecture diagrams
• Added LICENSE & screenshots folder

My repository finally looked like a real developer project.

---

🔄 Step 5 — Creating a CI/CD Pipeline with Netlify

This was the most exciting step.

I connected my GitHub repo to Netlify.

Now every time I push code:

1️⃣ Dependencies install automatically
2️⃣ React app builds automatically
3️⃣ Site deploys automatically
4️⃣ Website goes live 🌍

No manual hosting.
No manual uploads.
Real CI/CD pipeline.

This moment felt amazing.

---

🌍 The Final Result

My application is now live and accessible worldwide.

From zero → AWS → CI/CD → Production 🚀

👉 Live Demo
https://6988f216c9b850f7db01d08b--tiny-begonia-c0a233.netlify.app/

---

🏗️ Architecture Overview

DevOps Pipeline

Developer → AWS EC2 → GitHub → Netlify → Users

AWS Infrastructure

VPC → Public Subnet → EC2 → Internet Gateway

This simple architecture helped me understand the real deployment flow.

---

💡 What This Project Taught Me

This project changed how I see DevOps.

I learned:

• How AWS networking works
• How to develop inside EC2
• How GitHub authentication works
• How CI/CD pipelines deploy apps
• How frontend apps go live globally

Most importantly:

👉 DevOps is best learned by building real projects.

---

🚀 What’s Next?

Next upgrades I plan:

• Custom domain setup
• Backend API on AWS
• Database integration
• Full-stack deployment pipeline

This is just the beginning.

---

GitHub: https://github.com/IrfanPasha05
If you’re starting DevOps, my advice:

Stop waiting. Start building.

Hands-on projects teach more than any course ever will 💯