Webprogramozás tanfolyam

1. óra • Verziókezelés a Git Alapjaival

Megtanítja az init, add, commit és push munkafolyamatokat a kódváltozások nyomon követésére. Biztosítja, hogy a hallgatók a kezdetektől fogva képesek legyenek menteni és visszaállítani a munkájukat.

2. óra • A Kódszerkesztő Beállítása

Telepít és konfigurál egy modern kódszerkesztőt alapvető bővítményekkel. Közvetlenül lehetővé teszi a hatékony kódolást a tanfolyam során.

3. óra • Fájlrendszerek és Projektszerkezet

Elmagyarázza a mappahierarchiákat, fájlelnevezési konvenciókat, valamint a relatív és abszolút elérési utakat. Megelőzi a hibás hivatkozásokat és a rendezetlen projekteket.

4. óra • A Böngésző Fejlesztői Eszközeinek Használata

Bemutatja az Elemek, Konzol és Hálózat paneleket az élő oldalak vizsgálatához. Hibakeresési szokásokat épít ki, amelyeket minden későbbi fejezetben használni fognak.

1. óra • HTML Űrlapok és Bemeneti Típusok

Űrlapokat épít címkékkel, beviteli mezőkkel, legördülő listákkal, szövegterületekkel és beküldő gombokkal. Lerakja a későbbi fejezetekben tárgyalt felhasználói adatgyűjtés alapjait.

2. óra • Hivatkozások, Képek és Média

Elmagyarázza a horgonycímkéket, képattribútumokat és beágyazott média elemeket. Összekapcsolja az oldalakat és az erőforrásokat egy összefüggő, böngészhető dokumentummá.

3. óra • Listák, Táblázatok és Adatszerkezetek

Megtanítja a rendezett, rendezetlen és definíciós listákat, valamint a hozzáférhető táblázatjelölést. Felkészíti a hallgatókat a strukturált adatok helyes bemutatására.

4. óra • HTML Dokumentum Anatómiája

Részletezi a DOCTYPE, head és body szakaszokat és azok szükséges metaadatait. Kialakítja azt a vázat, amelyet minden HTML fájl a tanfolyam során követni fog.

5. óra • Szemantikus HTML5 Elemek

Bemutatja a header, nav, main, article, section, aside és footer elemeket. Javítja a hozzáférhetőséget és a keresőmotorok általi értelmezést.

1. óra • A CSS Dobozmodell

Elmagyarázza a tartalom, kitöltés, szegély és margó rétegeket, valamint a box-sizing viselkedését. Feloldja azt a leggyakoribb elrendezési zavart, amellyel a kezdők találkoznak.

2. óra • CSS Szintaxis és Szelektorok

Leírja a szabálykészleteket, deklarációkat, osztály, ID és elemszelektorokat. Kialakítja a célzási mechanizmust minden további stílusozási munkához.

3. óra • Háttérképek, Szegélyek és Árnyékok

Alkalmaz háttérképeket, színátmeneteket, szegélystílusokat és dobozárnyékokat. Vizuális mélységet és csiszolást ad az oldal összetevőinek.

4. óra • Színek, Tipográfia és Egységek

Megtanítja a hex, RGB és HSL színértékeket, valamint a betűtípus tulajdonságait és CSS-egységeit. Lehetővé teszi az egységes vizuális tervezési döntéseket egy projekten keresztül.

1. óra • Pozicionálás és Z-Index

Leírja az abszolút, fix és tapadó pozicionálást, valamint a halmozási kontextust. Lehetővé teszi a fedőrétegeket, tapadó fejléceket és modális párbeszédablakokat.

2. óra • Reszponzív Tervezés és Médialekérdezések

Alkalmaz töréspontokat és folyékony egységeket az elrendezések különböző képernyőméretekhez való igazításához. Mobil-első terveket hoz létre, amelyek bármilyen eszközön működnek.

3. óra • CSS Grid Alapok

Meghatározza a rács sablonokat, sorokat, oszlopokat és gap tulajdonságokat kétdimenziós elrendezésekhez. Lehetővé tesz olyan összetett oldalszerkezeteket, amelyek Flexboxszal nem érhetők el.

4. óra • Megjelenítési Módok és Normál Folyam

Áttekinti a block, inline és inline-block megjelenítési értékeket és a dokumentumfolyamot. Megadja az alapot annak megértéséhez, hogy mikor van szükség Flexboxra vagy Gridre.

1. óra • Ciklusok és Iteráció

Megtanítja a for, while és for...of ciklusokat ismétlődő műveletek végrehajtásához adatokon. Felkészíti a hallgatókat a tömbök és gyűjtemények hatékony feldolgozására.

2. óra • Változók, Adattípusok és Operátorok

Bemutatja a let, const, primitív típusokat, valamint az aritmetikai és összehasonlító operátorokat. Lerakja az adatkezelés alapját minden JavaScript kódhoz.

3. óra • Tömbök és Objektumok

Leírja a tömb metódusokat és objektum literálokat strukturált adatok tárolásához és kezeléséhez. Közvetlenül támogatja a DOM manipulációt és az API adatkezelést a későbbi fejezetekben.

4. óra • Függvények és Hatókör

Meghatározza a függvény deklarációkat, kifejezéseket, nyílfüggvényeket és a változók hatókörét. Lehetővé teszi az újrafelhasználható, moduláris kódblokkokat egy projekten keresztül.

1. óra • Eseménydelegálás és -terjedés

Elmagyarázza a buborékolást, megfogást és delegálási mintákat a hatékony eseménykezeléshez. Megelőzi a memóriaszivárgásokat és leegyszerűsíti a dinamikus lista interakciókat.

2. óra • A DOM Kiválasztása és Bejárása

Használja a querySelector, getElementById és szülő/gyermek bejárási metódusokat. Lehetővé teszi bármely elem pontos célzását egy élő oldalon.

3. óra • DOM Csomópontok Létrehozása és Eltávolítása

Új elemeket épít a createElement segítségével, és dinamikusan beszúrja vagy eltávolítja őket. Lehetővé teszi a listák megjelenítését, modális ablakok létrehozását és dinamikus felületi mintákat.

4. óra • Elemek és Tartalom Módosítása

Megváltoztatja a szöveget, HTML-t, attribútumokat és CSS-osztályokat a kiválasztott elemeken. Látható oldalfrissítéseket hoz létre a böngésző újratöltése nélkül.

1. óra • Promise-ok és Láncolás

Promise-okat hoz létre és láncol a .then() és .catch() segítségével szekvenciális aszinkron feladatokhoz. Lecseréli a beágyazott visszahívásokat olvasható, lineáris kódra.

2. óra • API-adatok Megjelenítése a DOM-ban

Leképezi a letöltött JSON tömböket dinamikusan generált HTML-elemekre. Teljessé teszi a teljes adatletöltés-megjelenítés folyamatot egy működő projektben.

3. óra • Adatok Letöltése a Fetch API-val

GET és POST kéréseket küld REST API-knak, és elemzi a JSON válaszokat. Lehetővé teszi a valós idejű adatok megjelenítését külső szolgáltatásokból.

4. óra • Async/Await Szintaxis

Promise láncokat ír át async függvények és await kifejezések segítségével. Tisztább, szinkronnak tűnő kódot hoz létre összetett aszinkron munkafolyamatokhoz.

1. óra • JavaScript Funkciók Megvalósítása

DOM-manipulációt, eseménykezelést és API-integrációt ad a projekthez. A statikus vázat egy teljesen interaktív alkalmazássá alakítja.

2. óra • Telepítés Élő Tárhelyre

A kész projektet közzéteszi egy statikus tárhelyplatformon Git-alapú telepítés segítségével. Létrehoz egy megosztható URL-t a portfólióhoz és állásjelentkezésekhez.

3. óra • Az Alkalmazás Tesztelése és Hibakeresése

Fejlesztői eszközöket, konzolnaplózást és manuális teszteseteket használ a hibák megtalálásához és javításához. Biztosítja, hogy az alkalmazás helyesen működjön a telepítés előtt.

4. óra • A HTML és CSS Alap Építése

Szemantikus jelölést és reszponzív elrendezést épít az alkalmazás vázához. Az összes korábbi HTML és CSS készséget egy egységes kódbázisban alkalmazza.