Unit 10: Web-Based Application Development

1. Internet Basics,
2. Introduction to Web Development,
3. Node.js and Git,
4. HTML, CSS, JQuery,
5. JavaScript and HTTP (forms),
6. Sessions and HTTP,
7. Javascript & Document Object Model – DOM,
8. Extensible Markup Language – XML,
9. Document Type Definition – DTD Dreamweaver,
10. PHP HyperText PreProcessor – PHP SQL & MySQL,
11. Integrating PHP and MySQL,Database Interaction

🌐 1. Internet Basics (इंटरनेट की मूल बातें)

• इंटरनेट एक global नेटवर्क है जो कई कंप्यूटरों और सर्वरों को जोड़ता है।
• यह HTTP, IP Address, DNS, Web Browsers, और URLs जैसी चीज़ों पर काम करता है।
• इंटरनेट पर वेबसाइट, ईमेल, वीडियो कॉल, सोशल मीडिया जैसी सेवाएँ मिलती हैं।

---

🕸️ 2. Introduction to Web Development (वेब विकास का परिचय)

• Web Development का मतलब है वेबसाइट या वेब एप्लिकेशन बनाना।
• दो भाग होते हैं:
  • Frontend (Client-side): जो यूजर देखता है (HTML, CSS, JS)
  • Backend (Server-side): जो सर्वर पर प्रोसेस होता है (PHP, Node.js, DB)

---

🟢 3. Node.js and Git

🔸 Node.js:

• JavaScript का runtime environment है।
• इससे आप server-side पर JavaScript चला सकते हैं।

🔸 Git:

• एक version control system है।
• कोड को track करने, changes को save करने और टीम में collaboration के लिए प्रयोग होता है।

---

📝 4. HTML, CSS, jQuery

🔹 HTML (HyperText Markup Language):

• वेब पेज की structure बनाने के लिए।

🔹 CSS (Cascading Style Sheets):

• वेब पेज को design/format देने के लिए।

🔹 jQuery:

• JavaScript का simplified रूप। DOM को आसानी से control करता है।

---

💻 5. JavaScript and HTTP (Forms)

• JavaScript ब्राउज़र में logic लागू करने के लिए।
• Forms यूज़र इनपुट लेने के लिए होते हैं (login, signup आदि)।
• HTTP Methods:
  • GET: डेटा प्राप्त करना
  • POST: डेटा भेजना

---

🔐 6. Sessions and HTTP

• HTTP एक stateless protocol है यानी यूज़र की पहचान भूल जाता है।
• इसलिए हम Sessions और Cookies का उपयोग करते हैं यूज़र की जानकारी (जैसे लॉगिन स्टेटस) बनाए रखने के लिए।

---

📄 7. JavaScript & DOM (Document Object Model)

• DOM एक ट्री स्ट्रक्चर है जो HTML पेज को represent करता है।
• JavaScript DOM का उपयोग करके HTML elements को change, add, delete कर सकता है।

---

🧩 8. XML (Extensible Markup Language)

• XML एक markup language है जो डेटा को structure के साथ store और transport करता है।
• इसका उपयोग APIs और Web Services में होता है।

---

📘 9. DTD (Document Type Definition) & Dreamweaver

🔸 DTD:

• XML document का structure define करता है — कौन से elements होंगे, कैसे होंगे।

🔸 Dreamweaver:

• Adobe का एक tool है जिससे आप visually वेबसाइट बना सकते हैं (WYSIWYG editor)।

---

🐘 10. PHP (PHP: Hypertext Preprocessor)

• Server-side scripting language है।
• HTML के साथ मिलकर dynamic webpages बनाने के लिए उपयोग होती है।
• फ़ॉर्म डेटा प्रोसेस करने, डेटा बेस से interact करने के लिए use होता है।

---

🗄️ 11. SQL & MySQL

🔹 SQL (Structured Query Language):

• डेटाबेस से डेटा निकालने, डालने, बदलने, और हटाने के लिए उपयोग होता है।

🔹 MySQL:

• एक relational database management system है जो SQL का उपयोग करता है।

---

🔗 12. Integrating PHP and MySQL (PHP और MySQL का एकीकरण)

• PHP का उपयोग करके हम MySQL से data fetch, insert, update, delete कर सकते हैं।

🔹 उदाहरण:

---

📦 13. Database Interaction (डेटाबेस के साथ इंटरैक्शन)

• PHP, JavaScript (AJAX), Node.js आदि से हम database के साथ interact कर सकते हैं।
• CRUD ऑपरेशन (Create, Read, Update, Delete) सबसे common interaction हैं।

---

✅ संक्षेप सारांश (Summary Table):

टॉपिक	उद्देश्य/कार्य
HTML	Structure बनाना
CSS	Styling देना
JavaScript	Interaction और logic
jQuery	JS को आसान बनाना
Node.js	JS को server पर चलाना
Git	कोड ट्रैक करना
PHP	Server-side scripting
MySQL	Data store करना
Sessions	यूज़र को पहचान कर रखना
DOM	HTML structure को JS से control करना
XML/DTD	Structured डेटा ट्रांसफर करना
Dreamweaver	Visual वेबसाइट डिज़ाइन टूल
Database Integration	PHP से DB को जोड़ना