Day 24: Frontend vs Backend – Complete Beginner Guide for Web & Bug Bounty (Hindi)

🌐 Day 24: Frontend vs Backend

(Bug Hunting / Ethical Hacking Course – Day 24)

Aaj hum ek bahut important concept samjhenge 🔥

Website 2 main parts me divided hoti hai:

Frontend
Backend

Agar aap bug bounty ya web hacking karna chahte ho, to ye difference clear hona bahut zaruri hai.


🔹 Frontend Kya Hota Hai?

Frontend wo part hota hai jo user directly dekh aur use kar sakta hai.

Example:

✔ Buttons
✔ Forms
✔ Text
✔ Images
✔ Colors
✔ Layout

Frontend 3 technologies se banta hai:

  • HTML

  • CSS

  • JavaScript

Browser me jo aap dekhte ho — wahi frontend hai.

Example browser:
Google Chrome


🔹 Backend Kya Hota Hai?

Backend wo part hota hai jo server side par kaam karta hai.

User directly backend nahi dekh sakta.

Backend handle karta hai:

✔ Database
✔ Login system
✔ Data processing
✔ Authentication
✔ Business logic

Backend programming languages:

  • PHP

  • Python

  • Node.js

  • Java

Server example:

Web applications aksar Linux based servers par run hote hain jaise
Ubuntu


🔥 Simple Example Samjho

🛒 Example: Online Shopping Website

Frontend:

  • Product image

  • Add to cart button

  • Design

Backend:

  • Price calculation

  • Payment processing

  • Database me order store karna

User sirf frontend dekhta hai,
lekin real logic backend me hota hai.


🔥 Frontend vs Backend Comparison Table

FeatureFrontendBackend
Runs OnBrowserServer
Visible to UserYesNo
LanguagesHTML, CSS, JSPHP, Python, Node
Security LevelLowHigh
Main RoleUI/DesignLogic/Data

🔎 Hacker Perspective (Very Important)

🔥 Frontend Vulnerabilities

✔ Client-side validation bypass
✔ JavaScript manipulation
✔ Hidden fields edit karna
✔ DOM modification


🔥 Backend Vulnerabilities

✔ SQL Injection
✔ Authentication bypass
✔ IDOR
✔ Server misconfiguration

👉 Real hacking backend me hoti hai.


🔥 Important Concept: Client-Side vs Server-Side

Client-Side:

Browser me run hota hai
User modify kar sakta hai

Server-Side:

Server me run hota hai
User directly modify nahi kar sakta


🧪 Practice Activity

1️⃣ Kisi website par jao
2️⃣ Right Click → Inspect karo
3️⃣ HTML, CSS aur JS dekho
4️⃣ Form submit karo
5️⃣ URL observe karo

Socho:

Ye frontend tha ya backend?


🎯 Day 24 Summary

✔ Frontend = User interface
✔ Backend = Server logic
✔ Frontend browser me run hota hai
✔ Backend server me run hota hai
✔ Real vulnerabilities mostly backend me milti hain


⬅ Previous Day                       

                               Next Day ➡