WebtanárKöszöntelek, én Kovács Bence vagyok.
Fő profilom a webes oktatás, emellett hobbi szinten bűvész és mentalista is vagyok, verseket írok, illetve mobil alkalmazásokat fejlesztek (iOS és Android)...
Magyarországon ELSŐKÉNT, 2002-ben kezdtem el oktatóvideókat készíteni, főként a webes programozás témakörében. Azóta több, mint 70 oktatóanyagot készítettem el, melyekkel többezer hallgatót tudtam segíteni a tanulásban és a munkaszerzésben. Régebben az oktatovideok.hu és a csak1ezres.hu címeken működött az oktatóvideós portálom, 7 éve használom a webtanar.hu domain nevet.
Az oktatóanyagaim egyik része az abszolút kezdőknek szól, akik még csak most ismerkednek a webes fejlesztéssel. Haladóbb szintű és speciális témaköröket érintő oktatóanyagokat is készítek, ezeket főként a gyakorlattal és tapasztalattal rendelkező webmestereknek ajánlom.
Remélem, hogy neked is segíteni tudok a tanulásban, esetleg a munkaszerzésben is!
Kellemes és hasznos tanulást kívánok! :-)
webmesterek online iskolája
|
|
Modern webfejlesztés - AKCIÓS csomag
Köszöntelek a Modern webfejlesztés kurzuson, én Kovács Bence vagyok. Magyarországon elsőként, 2002-ben kezdtem el oktatóvideókat készíteni, főként a webes programozás témakörében. Azóta kb. 70 kurzust készítettem el, melyekkel többezer hallgatót tudtam a tanulásban és a munkaszerzésben segíteni.
Ez a kurzus egy akciós csomag, amely három alapkurzust foglal magába.
Az első kurzus a CSS3 – modern webdizájn címet kapta. A CSS3-mal való ismerkedést teljesen az alapoktól kezdjük, de azért feltételezem, hogy már rendelkezel alapfokú HTML ismeretekkel - ha netán mégsem, akkor iratkozz fel a HTML alapok című kurzusomra! A CSS alapjainak átismétlése után áttekintjük a CSS3 népszerű új funkcióit (úgymint lekerekítések, árnyékolás, színátmenetek használata stb.), majd megismerkedünk az animációk és transzformációk használatával. A kurzus végén néhány gyakorló feladattal foglaljuk össze és próbáljuk ki a tanultakat.
A második kurzus a HTML 5-tel foglalkozik. A HTML5 a modern webfejlesztés alapköve, minden webmester számára kötelezően ajánlott az ismerete és használata. Az oktatóanyagban megismerkedünk a HTML5 új szerkezeti elemeivel, az űrlapok és a multimédiás tartalmak kezelésének új lehetőségeivel.
A harmadik kurzus a Bootstrap – reszponzív weblapok készítése címet viseli. Manapság, amikor a legtöbben már mobiltelefonon és táblagépen nézegetik a weblapokat, a webmestereknek nagy hangsúlyt kell fektetniük a reszponzivitásra – vagyis arra, hogy a weblap minden készüléken szépen jelenjen meg. Ez a kurzus megismerteti veled a reszponzív weblapkészítés eszközeit. Foglalkozunk a Bootstrap rács-szerkezetével, különféle navigációs megoldásokkal, a reszponzív űrlapok készítésével és egyéb hasznos eszközökkel, melyekkel könnyedén tudsz majd modern, reszponzív weblapokat készíteni.
A videókon lépésről lépésre láthatod majd a forráskód szerkesztését, az elkészült kódokat a segédfájlok között találod majd meg. Érdemes minden lecke után a gyakorlatban is kipróbálni a látottakat!
Most pedig nézd meg az ingyenes leckéket, és ha hasznosnak tartod, vásárold meg az akciós csomagot! Remélem, hogy hamarosan tanítványomként köszönthetlek! :-)
-
1.Bevezető
-
1. lecke
Hova és hogyan írhatjuk be a CSS kódot
-
2.A korábbról már ismert CSS parancsok áttekintése
-
2. lecke
Háttérszín és háttérkép beállítása
-
3. lecke
Szövegformázás
-
4. lecke
Keretek és margók
-
5. lecke
Listák formázása
-
6. lecke
Méretezés, megjelenes, pozícionálás
-
7. lecke
Pszeudo osztályok és elemek használata
-
3.A CSS 3 újdonságai
-
8. lecke
Új lehetőségek a formázandó elemek kiválasztására
-
9. lecke
Doboz elemek sarkának lekerekítése
-
10. lecke
Szövegek és doboz elemek árnyékolása
-
11. lecke
Keretek - színek helyett képeket használunk
-
12. lecke
Saját betűtípusok használata (TTF, OTF, WOFF)
-
13. lecke
Egyenes vonalú színátmenetek
-
14. lecke
Körkörös színátmenetek
-
15. lecke
Színkeverés (RGB és HSL) és áttetszőség
-
4.Animációk
-
16. lecke
Animáció létrehozása - kulcskockák időtartama
-
17. lecke
Több tulajdonság animálása: késleltetés, ismétlés
-
18. lecke
További beállítási lehetőségek
-
19. lecke
Az animáció megállítása és elindítása (JavaScript)
-
20. lecke
Egy kis gyakorlás: 3 gomb rezegtetése kattintásra
-
5.Transzformációk (2D)
-
21. lecke
Mozgatás
-
22. lecke
Elforgatás
-
23. lecke
Átméretezés
-
24. lecke
Megdöntés
-
25. lecke
Egy kis gyakorlás: 2D-a animáció
-
6.3D-s transzformációk
-
26. lecke
Elforgatás a térben
-
27. lecke
A perspektíva beállítása
-
28. lecke
Mozgatás térben
-
29. lecke
Átméretezés, a Z-tengely módosítása
-
30. lecke
Kétoldalú terület megforgatása
-
31. lecke
Minden böngészőben ugyanúgy futnak az animációk
-
7.További CSS3 technikák
-
32. lecke
Css tulajdonságok megváltoztatása jQuery-vel
-
33. lecke
Átmenetek használata
-
34. lecke
Css osztályok hozzáadása és eltávolítása jQueryvel
-
35. lecke
Kétoldalú forgatás megoldása IE-ben
-
36. lecke
Elemek egymás alá- és fölérendelése Z-tengelyen
-
8.Egy kis gyakorlás
-
37. lecke
Feladat: területek egymás alá mozgatása 3d-ben
-
38. lecke
Feladat: könyv oldalainak lapozása 3D-ben
-
9.HTML5 - Bevezető
-
39. lecke
A HTML5 története, előnyei és támogatása
-
40. lecke
A HTML5 újításai a 4-es változathoz képest
-
10.A weblap szerkezete
-
41. lecke
A weboldal szerkezetének leírása új HTML5 elemmel
-
42. lecke
Megoldás a kompatibilitási problémákra
-
11.Űrlapok újdonságai
-
43. lecke
Szöveges mezők új paraméterei, beállításai
-
44. lecke
Kötelező szövegformátumok megadása
-
45. lecke
Külső elemek hozzárendelése az űrlaphoz
-
46. lecke
Az űrlap vezérlése új paraméterekkel
-
47. lecke
A jó öreg legördülő lista helyett: adatlista
-
48. lecke
Szám típusú mezők kezelése
-
49. lecke
Dátum és idő típusú mezők kezelése
-
50. lecke
Telefonszám, email cím, URL és kereső mező
-
51. lecke
Színválasztó
-
52. lecke
Műveletek eredményének megjelenítése az OUTPUTtal
-
12.Multimédia
-
53. lecke
Videók beillesztése és lejátszása
-
54. lecke
A videó vezérlése JavaScript-tel
-
55. lecke
Feliratsáv megjelenítése
-
56. lecke
Több feliratsáv kezelése, vezérlés JavaScript-tel
-
57. lecke
A feliratok pozícionálása és formázása
-
58. lecke
Audió (zene és hang) lejátszása
-
13.Rajzolás a vászonra
-
59. lecke
A HTML5 vászon előkészítése
-
60. lecke
Téglalap rajzolása
-
61. lecke
Szín és vonalvastagság beállítása
-
62. lecke
Egyenes vonalú és körkörös színátmenetek
-
63. lecke
Vonal és körív rajzolása
-
64. lecke
Szövegek elhelyezése a vászonra
-
65. lecke
A HTML5 vásznon elvégezhető egyéb műveletek
-
14.Webes alkalmazások készítése mobil eszközökre
-
66. lecke
Webapp készítése Android-os készülékekhez
-
67. lecke
Webapp készítése iOS-t futtató Apple eszközökhöz
-
15.Bootstrap - Bevezetés, alapok
-
68. lecke
A Bootstrap keretrendszer letöltése, használata
-
69. lecke
A weblapunk rács-szerkezetének kialakítása
-
16.A Bootstrap beépített megjelenítési lehetőségei
-
70. lecke
Szövegek megjelenítése
-
71. lecke
Táblázatok megjelenítési lehetőségei
-
72. lecke
Képek és beágyazott videók reszponzív megjelenítés
-
73. lecke
Figyelemfelkeltő szövegek, fejlécek
-
74. lecke
Bezárható értesítési blokkok megjelenítése
-
75. lecke
Gombok
-
76. lecke
Gombcsoportok és vízszintes (legördülő) menük
-
77. lecke
Ikonok használata
-
78. lecke
Címkék és szám-jelvények
-
79. lecke
Folyamatjelző sávok
-
17.Navigációs megoldások
-
80. lecke
Oldalválasztó gombcsoportok és lapozó gombok
-
81. lecke
Listacsoportok
-
82. lecke
Panelek
-
83. lecke
Lenyíló menük
-
84. lecke
Lenyíló és összecsukható (harmónika) panelek
-
85. lecke
Füles szerkezetű lapok (tab-ok) navigációja
-
86. lecke
Menüszerkezet gombokkal
-
87. lecke
Menüsor készítése
-
18.Űrlapok
-
88. lecke
Űrlapok készítése
-
89. lecke
Az alapvető űrlap-elemek áttekintése
-
90. lecke
Az űrlap-elemek különböző állapotai
-
91. lecke
Az űrlap-elemek méretezése
-
19.Egyéb hasznos funkciók
-
92. lecke
Kép-lapozó (carousel) készítése
-
93. lecke
Üzenetablak készítése (bármilyen HTML tartalommal)
-
94. lecke
Súgószöveg (tooltip) készítése
-
95. lecke
A súgószövegek egyedi formázása
-
96. lecke
Scrollspy - a gördítésre reagáló menüsor
-
97. lecke
Affix - gördítés után fixálható menüsor