आज आप क्या सीखेंगे?

  • Web Development क्या होता है?
  • Frontend vs Backend
  • AI कैसे help करता है coding में
  • HTML का introduction
  • पहला webpage बनाना

Web Development क्या है?

Web Development का मतलब होता है websites और web applications बनाना। Example:

  • Amazon → eCommerce website
  • YouTube → Video platform
  • आपका Tech Deals Blog → Web Project

Web Development के 3 Parts

1. Frontend (UI / Design)

जो user देखता है: Colors, Buttons, Layout

<h1>Hello World</h1>

2. Backend (Logic / Server)

जो user नहीं देखता: Data processing, Login system, API

3. Database

Data store होता है: Users, Products, Orders

AI Web Development में कैसे मदद करता है?

AI आपकी speed 10x बढ़ा सकता है। आप AI से ये सब कर सकते हो:

  • Code generate
  • Error fix
  • UI design
  • Content writing

Example Prompt

Create a simple HTML page with header, paragraph and button.

HTML क्या है?

HTML = HyperText Markup Language. यह website का structure बनाता है।

Basic HTML Structure

<!DOCTYPE html>
<html>
<head>
  <title>My Website</title>
</head>
<body>

  <h1>Hello World</h1>
  <p>This is my first website</p>

</body>
</html>

Important HTML Tags

TagUse
<h1>Heading
<p>Paragraph
<a>Link
<img>Image
<button>Button

Practical: आपका पहला Webpage

  1. Notepad / VS Code खोलो
  2. File बनाओ: index.html
  3. यह code paste करो:
<!DOCTYPE html>
<html>
<head>
  <title>My First Website</title>
</head>
<body>

  <h1>👋 Hello, I am Shobhit</h1>
  <p>I am learning Web Development with AI 🚀</p>

  <button>Start Now</button>

</body>
</html>

File open करो browser में — 🎉 आपका पहला webpage ready है।

Mini Task (Important)

इस page को modify करो:

  • अपना नाम डालो
  • एक image add करो
  • एक link add करो
<img src="image.jpg" width="200">
<a href="https://google.com">Go to Google</a>

Pro Tips (Day 01)

  • रोज practice करो (1–2 घंटे)
  • AI से पूछने में शर्म मत करो
  • Copy मत करो → समझो

Day 01 Summary

  • Web Development basics
  • HTML structure
  • AI का use
  • First webpage बनाना

Next (Day 02)

Advanced HTML (Forms, Lists, Tables) और real-world layout सीखेंगे।

Call to Action

अगर आप serious हो: Comment / note करो \"Day 01 Done ✅\"

और ready हो जाओ next level के लिए 🔥

Want next lecture? Type: \"Day 02\"