Bootstrap workshop– Modern webdesign gyorsan, hatékonyan
Képzés kód:
Bootstrap workshop– Modern webdesign gyorsan, hatékonyan - Időpontok és jelentkezés
Első oktatási nap: 2025. október 13., további oktatási napok: 14.
A jelentkezési határidő már lejárt. Ha szeretnél jönni, még leadhatod a jelentkezésedet és igyekszünk helyet biztosítani.
Zártcsoportos képzésre jelentkezem
Jelentkezés időpont nélkül
Tanuld meg, hogyan készíthetsz modern, reszponzív weboldalakat a Bootstrap segítségével! Ez a tréning végigvezet a keretrendszer alapjain, a layout kialakításán, a grid rendszer működésén, valamint a navigáció, űrlapok, tartalom és vizuális elemek beépítésén. Megtanulod, hogyan alkalmazz hasznos utility osztályokat (pl. margók, igazítás, tördelés), és hogyan alakíts ki egységes, esztétikus megjelenést különböző képernyőméretekhez. A képzés végére képes leszel saját, professzionális kinézetű és mobilbarát weboldalakat készíteni gyorsan és hatékonyan.
Ajánljuk mindenkinek, webfejlesztéssel ismerkedik vagy foglalkozik és szeretne modern, reszponzív weboldalakat készíteni gyorsan és hatékonyan. Különösen hasznos lehet webdesignereknek, frontend fejlesztőknek és azoknak, akik már ismerik a HTML és CSS alapjait, és szeretnék ezeket Bootstrap segítségével egy szinttel magasabbra emelni. Ideális választás azoknak is, akik gyakorlati megközelítésű tréningen keresztül szeretnék elsajátítani a strukturált, mobilbarát webes felületkészítés eszközeit.
- CSS és HTML ismeretek
Amennyiben még nem ismered a weboldalak készítéséhez szükséges CSS és HTML nyelveket a HTML és HTML 5 technológiák tanfolyamunkat ajánljuk.
A Bootstrap napjaink egyik mainstream, webes UI keretrendszere. Minden HTML elemhez tartalmaz alap stílus definíciókat, így biztosítva a böngészőfüggetlen weboldalmegjelenést. Ezen kívül táblázatokat, dialógus ablakokat, tooltipeket, és egyéb modern UI elemeket is tartalmaz. Biztosítja a webfejlesztők, webdesignerek számára, hogy az általuk felépített weboldal minden platformon (desktop, tablet, mobil) és a különböző kijelzőkön a megfelelő módon jelenjen meg.
Tanfolyamunkon a Bootstrap 5-ös verziójával dolgozunk.
A képzés elvégzése után képes leszel:
- Bootstrap segítségével gyorsan és hatékonyan felépíteni modern, reszponzív weboldalakat.
- Strukturált, jól tagolt layoutot kialakítani előre definiált grid rendszerrel.
- Egyszerűen használni a Bootstrap beépített komponenseit (navbar, lábléc, űrlapok, alert-ek stb.)
- Összeállítani látványos, de letisztult felhasználói felületeket minimális CSS írással.
- Testreszabni a megjelenést utility osztályokkal (színek, margók, méretek, szövegformázás stb.)
- Érvényesíteni és formázni űrlapokat beépített eszközökkel.
- Gondoskodni arról, hogy a weboldalad minden eszközön – asztali gépen, tableten, mobilon – jól jelenjen meg.
- Használni reszponzív képeket, videókat és egyéb elemeket különböző nézetekhez igazítva.
- Megérteni, hogyan működik a Scrollspy, a Flexbox és más modern layout technikák a Bootstrapen belül.
- Önállóan elindítani egy új frontend projektet Bootstrap alapokra építve.
Tematika:
1. BEVEZETÉS
1.1. Bootstrap ismertetése
1.2. Áttekintés, mit nyújt a Bootstrap
1.3. Projekt kialakítása
2. LAYOUT FELÉPÍTÉSE
2.1. Szekciók
2.2. Bootstrap komponensek hozzáadása
3. GRID KIALAKÍTÁSA
3.1. Grid osztályok, lehetőségek
3.2. Szabályok
3.3. Igazítási lehetőségek
3.4. Sortörés
4. NAVIGÁCIÓ, LÁBLÉC, ALERT ÉS TARTALOM
4.1. Navbar kialakítása
4.2. Navigáció Scrollspy alkalmazásával
4.3. Ikonok
4.4. Lábléc létrehozása
4.5. Formok kialakítása és form validáció
4.6. Progress bar, progress indikátor
5. UTILITY FUNKCIÓK
5.1. Flexbox
5.2. Tördelés
5.3. Keretek
5.4. Margó és tagolás
5.5. Lebegő elemek
5.6. Fix elemek
5.7. Szöveg formázása
5.8. Szöveg kiemelése
5.9. Szöveg méretének csökkentése
5.10. Listák
5.11. Szélesség és magasság
5.12. Beviteli és megjelenítő mezők formázása
6. RESZPONZÍV WEBFELÜLET LÉTREHOZÁSA
6.1. Hogyan épül fel egy reszponzív weboldal?
6.2. Megjelenés különböző platformokon
6.3. A weboldal elemei: viewport, grid, képek, videók
Bootstrap workshop– Modern webdesign gyorsan, hatékonyan - Mentoraid lesznek
Rendezett oktatás, felkészült oktatóval, figyelemfelkeltően a lényeget bemutatva, gyakorlatorientáltan. Nem volt 'felesleges' elmélet vagy mellébeszélés.
Rigó Balázs