AISkillWalaHar website asal mein kuch files hain: HTML (content), CSS (design) aur JavaScript (kaam/interaction). Browser (Chrome) in files ko padh ke page dikhata hai. Is course mein tum yahi teen bhashaayein seekhoge aur apni website internet pe daaloge. Iske liye laptop chahiye (koi bhi chalega).
1Teen bhashaayein, teen kaam
- HTML: kya dikhega: heading, paragraph, photo, button.
- CSS: kaisa dikhega: rang, font, jagah, layout.
- JavaScript (JS): kya karega: button dabane pe menu khulna, calculation, form check.
Ek ghar ki tarah socho: HTML deewarein, CSS paint aur furniture, JS bijli ke switch.
2Setup (free)
Ek code editor aur browser chahiye.
- Google Chrome install karo (agar nahi hai).
- code.visualstudio.com se VS Code (free) install karo.
- Desktop pe "my-website" naam ka folder banao.
- VS Code mein File, phir Open Folder se ye folder kholo.
- Naya file banao: index.html (naam bilkul aisa hi).
3Pehla page
index.html mein ye likho (VS Code mein ! likh ke Enter dabane se bhi poora dhaancha aa jaata hai):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>My first page</title>
</head>
<body>
<h1>Namaste, duniya!</h1>
<p>Ye meri pehli website hai.</p>
</body>
</html>
Save karo (Ctrl/Cmd + S), phir folder mein index.html pe double-click karo. Chrome mein page khulega. Badlaav karo, save karo, browser refresh (F5) karo.
Example: Maan lo: 10 minute ki pehli site
Maan lo Arjun ko lagta tha coding bahut mushkil hai. Usne VS Code install kiya, upar wala code likha aur browser mein apna naam bade akshar mein dekha. Phir usne apni pasand ke 3 gaane list mein daale. Pehle din hi use samajh aa gaya ki website "jaadu" nahi, simple text files hain.
Aam galtiyan
- File ka naam index.html.txt ho jaana (Windows mein file extensions dikhao).
- Save kiye bina refresh karna.
- Shuru mein hi framework (React) pe kood jaana.
Practice task
Setup karo aur index.html mein apna naam (h1) aur apne baare mein 2 paragraph likh ke browser mein kholo.
Jaldi se recap
- HTML = kya, CSS = kaisa, JS = kya karega
- VS Code + Chrome
- Folder → index.html
- Save → refresh
- VS Code mein ! + Enter = dhaancha
Every website is really a few files: HTML (content), CSS (design) and JavaScript (behaviour/interaction). The browser (Chrome) reads these files and shows the page. In this course you will learn these three languages and put your website on the internet. You need a laptop (any will do).
1Three languages, three jobs
- HTML: what shows: headings, paragraphs, photos, buttons.
- CSS: how it looks: colours, fonts, spacing, layout.
- JavaScript (JS): what it does: opening a menu on a button press, calculations, form checks.
Think of a house: HTML is the walls, CSS the paint and furniture, JS the light switches.
2Setup (free)
You need a code editor and a browser.
- Install Google Chrome (if you do not have it).
- Install VS Code (free) from code.visualstudio.com.
- Create a folder called "my-website" on the Desktop.
- In VS Code, open this folder with File, then Open Folder.
- Create a new file: index.html (exactly this name).
3Your first page
Write this in index.html (in VS Code, typing ! and pressing Enter also gives the whole skeleton):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>My first page</title>
</head>
<body>
<h1>Hello, world!</h1>
<p>This is my first website.</p>
</body>
</html>
Save (Ctrl/Cmd + S), then double-click index.html in the folder. The page opens in Chrome. Make a change, save, and refresh the browser (F5).
Example: Say: a first site in 10 minutes
Say Arjun thought coding was very hard. He installed VS Code, wrote the code above and saw his name in big letters in the browser. Then he added a list of his 3 favourite songs. On day one he understood that a website is not "magic", just simple text files.
Common mistakes
- The file ending up as index.html.txt (show file extensions on Windows).
- Refreshing without saving.
- Jumping straight into a framework (React) at the start.
Practice task
Set up, write your name (h1) and 2 paragraphs about yourself in index.html, and open it in the browser.
Quick recap
- HTML = what, CSS = how it looks, JS = what it does
- VS Code + Chrome
- Folder → index.html
- Save → refresh
- ! + Enter in VS Code = skeleton
Liked it? The full course is waitingAchha laga? Poora course tumhara intezaar kar raha hai
In the app this lesson also has a video lesson, a quiz, the AI tutor and your progress. Take the free 5-minute test to start.App mein is lesson ke saath video lesson, quiz, AI tutor aur tumhari progress bhi hai. Shuru karne ke liye 5 minute ka free test do.