0. Megjegyzés

Mielőtt belevágnánk a weblapkészítésbe, elő kell készítenünk a "műhelyünket". Bár egy weboldalt akár a legegyszerűbb Jegyzettömbben is meg lehetne írni, mi egy profi eszközt, a Visual Studio Code-ot (VS Code) fogjuk használni, ami rengeteget segít majd a kódolásban.

HTML fájl létrehozása lépésről lépésre:

1. Mappa létrehozása: Hozz létre egy új mappát a gépeden (pl. az Asztalon elso_weboldalam néven)!
2. Megnyitás VS Code-ban: Indítsd el a VS Code-ot, majd a bal felső sarokban kattints a File -> Open Folder... menüpontra, és válaszd ki az előbb létrehozott mappát!
3. Új fájl: A bal oldali panelen (Explorer) kattints az "Új fájl" (New File) ikonra, vagy használd a Ctrl + N billentyűkombinációt!
4. Névadás: A fájlnak add az index.html nevet! (Tipp: A webszerverek mindig az index nevű fájlt keresik először egy mappában, ez a weboldalak hivatalos "főbejárata".)

🚀 PRO Tipp: A felkiáltójel varázslat (Emmet) A VS Code-ban nem kell minden alkalommal kézzel begépelned egy HTML oldal kötelező, unalmas alapszerkezetét. Nyisd meg az index.html fájlt, üss be egyetlen felkiáltójelet (!), majd nyomd meg a Tab vagy az Enter gombot! A szerkesztő azonnal legenerálja neked a tökéletes kezdőkódot!

Hogyan nézzük meg, amit alkottunk? Keresd meg a VS Code bal oldali menüjében a Kiegészítők (Extensions - négyzet alakú ikon) fület. Keresd meg és telepítsd fel a Live Server nevű bővítményt (készítője: Ritwick Dey). Ha ez megvan, csak kattints jobb gombbal a kódodban bárhova, és válaszd az "Open with Live Server" opciót! A böngésződ megnyílik, és onnantól kezdve minden mentésnél (Ctrl + S) automatikusan frissíti az oldaladat.