Az Oktatóvideók.hu bemutatja – Webes alkalmazások fejlesztése iPhone-ra

Sziasztok! Talán már láttátok, hogy az oldalunk egyik hirdetője Kovács Bence, az Oktatóvideók.hu fejlesztője. Itt az oldalon is többször hozzászólt már a témákhoz, sőt Budapesten az iPhone 4 premierjén még bűvészkedett is nekünk. Fő profilja azonban olyan segédanyagok készítése videó formájában, melyekkel játszi könnyedséggel lehet elsajátítani a weboldalak készítésének minden csínját-bínját. Nyilvánvaló, hogy beleszeretett az új iPhone 4 készülékébe – ez teljesen természetes, megértem őt – ezért úgy döntött, hogy készít egy kifejezetten iPhone-ra való oktatóanyagot.

A tegnapi napon el is készült az oktatóanyag első része, mely a “Webes alkalmazások fejlesztése iPhone-ra” címet viseli. Ez a tananyag a sorozat első része, úgymond az alapokat tartalmazza. Az oktatóanyag főleg azoknak készült, akik iPhone-ra optimalizált weblapokat, vagy iPhone-on futtatható webes alkalmazásokat szeretnének készíteni. Természetesen az iPhone-ra készült weblapok az iPod Touch készülékeken is ugyanúgy működnek, tehát a felhasználók tábora világszerte hatalmas! A sorozat első részében, mint említettem az alapokkal foglalkozik. A tananyag feldolgozása után olyan tetszetős weblapokat tudsz majd készíteni, amelyek látszólag nem különböznek az iPhone-ra készült valódi alkalmazásoktól!

Bence kifejezetten azoknak ajánlja ezen oktatóanyagot, akik szeretnék, ha a weblapjuk iPhone (és iPod Touch) készülékekről böngészve egyszerű, letisztult, ám mégis nagyon látványos formában jelennének meg, illetve azoknak, akik internetkapcsolat nélkül is használható webes alkalmazásokat szeretnének készíteni az említett készülékekre.

Az első részben az alábbi tematika található meg. Íme az előadások címe és a hozzájuk kapcsolódó videók időtartama:

– 1. lecke: Az iPhone-t használó látogatók átirányítása (7:30)
– 2. lecke: iPhone-ra készült weblapok tesztelése számítógépen (12:12)
– 3. lecke: Weblapok tesztelése az iPhone készüléken (7:24)
– 4. lecke: Az iPhone képernyőjére optimalizált weblap készítése (4:25)
– 5. lecke: Weblapok futtatása teljes képernyős módban (5:14)
– 6. lecke: Saját indító ikon készítése (6:11)
– 7. lecke: Az induló képernyő beállítása (3:39)
– 8. lecke: A fejléc (status bar) beállításai (7:21)
– 9. lecke: Weblap átalakítása hagyományosról iPhone stílusúra (22:09)
– 10. lecke: Beviteli mezők speciális billentyűzetekkel (14:39)
– 11. lecke: Különleges linkek az iPhone beépített alkalmazásaihoz (11:59)
– 12. lecke: Weblap-elemek mozgatása az ujjunkkal (12:45)
– 13. lecke: A készülék elforgatásának érzékelése (11:09)
– 14. lecke: Offline webes alkalmazások készítése (20:42)
– “One more thing”: 3 kép mozgatása korlátozott területen (10:19)

Én a tegnapi napon megkaptam a tiszteletpéldány és be kell valljam olyan dolgokat mutatott meg Bence a videóban, amiről fogalmam sem volt. Tudjátok, hogy hogyan kell asztali PC-n vagy Mac-en a Safari böngészőben iPhone készüléket emulálni? Hogyan kell saját ikont készíteni a weblaphoz, melyet akár az iPhone képernyőjére is le lehet menteni? Ha a válasz nem, akkor mindenképp javasolt az oktatóvideó beszerzése.

Ja és “One more thing” – Bence most egy olyan kedvezményt is felajánlott az oldal látogatói részére, amennyiben az első regisztrációkor megadjuk az IPHONE promóciós kódot, az első vásárlásból mindenki 10%-os kedvezményt kap. Nyilván ez nem csak ezen oktatóanyagra, hanem más oktatóvideókra is vonatkozik (PhP, Flash, HTML, stb.).

A fentebb taglalt oktatóanyag, amúgy 1024×768-as felbontásban tekinthető meg, digitálisan letölthető, de felárért CD-n vagy DVD-n is megrendelhető. A összes videó hossza amúgy 2 óra 27 perc, valamint megtalálható benne az összes felhasznált html fájl is, mint segédanyag.

Bence feltöltött egy bemutató videót is a YouTube-ra, mely alapján mindenki eldöntheti, hogy megvásárolja-e a tananyagot. A közeljövőben várható, hogy Bence ötletei alapján az ihungary.hu oldal is megújul, várható, egy kifejezetten iPhone-ra szánt változat is.

De addig is javaslom látogassatok el az Oktatóvideók.hu oldalra és gyorsan töltsétek le, a most mindösszesen 4.900 Ft-ért megvásárolható tananyagot. Ja és ne felejtsétek el regisztrációkor beírni a kódot: IPHONE.

Az oktatóanyag letöltéséhez erre fáradjatok. Hivatalos oldal: Oktatóvideók.hu

Tetszett a bejegyzés? Lájkold, csiripeld, oszd meg!

A szerző

Tanulmányaim és a közgáz befejezése után gazdasági informatikusként végeztem, majd 2004-től 2012-ig a Magyar Telekomnál (T-Home, T-Mobile) dolgoztam. Jelenleg szabadúszó webfejlesztőként és dizájnerként tevékenykedem. Szívesen foglalkozom PHP és WordPress programozással, fejlesztéssel, weboldalak üzemeltetésével.

28 hozzászólás

  1. Büszke - 2010.10.28. 14:26
  2. tameszol - 2010.10.28. 14:26

    Ez nagyon hasznos kis dolog, mert éppen iphone-programfejlesztéssel szeretnék foglalkozni!Lesz több változat is?

    Az lenne a kérdésem, hogy 0 programozási "előélettel" meg lehet-e gyorsan(1-2hónap tanulni), mert minden más háttér megvan hozzá(mac gép, grafikához szükséges eszközök és tudás).

    Ha bárkinek lenne kedve csatlakozni kérem írjon!:)

    • KeleMan - 2010.10.28. 14:36

      Igen, Bence tervezi, hogy több részes lesz a sorozat. A jelenlegi az első rész, az alapok!

  3. Bence - 2010.10.28. 14:41

    Ez az anyag a WEBES fejlesztésről szól, tehát ehhez nem kell Mac, sem programozói tudás… csak alapfokú HTML, JavaScript és CSS ismeret szükséges! :-)

    Az offline webes alkalmazások (webapps) látszólag igazi (native) iPhone programok, valójában csak iPhone-stílusban készült weblapok…

    A következő részben a Sencha Touch nevű webes alkalmazásfejlesztő technikát fogom bemutatni (év vége felé, vagy 2011 elejére várható).

  4. tameszol - 2010.10.28. 16:58

    Azt hittem sűrűbben jönnek ki a videók:) kis telhetetlen vagyok:D Én a játtékszíttésre lennék kíváncsi illetve szöveges(quiz),stb programokra.

  5. Bence - 2010.10.28. 17:18

    Amit meg tudsz oldani HTML + JavaScript + CSS segítségével, azt mind belepakolhatod a webes alkalmazásodba. Sőt még offline, JavaScript alapú adatbázis-kezelésre is van megoldás, erről is szó lesz a folytatásban! Szóval nagyon sok lehetőség van ebben a témában, csak ki kell használni! :-)

  6. tameszol - 2010.10.28. 17:53

    Sajnos nem nagyon értek a programozáshoz még most ismerkedem vele.

    Képzeld SDK-ban csináltam 2 quiz "játékot" is, youtube videók szerint és el is indítja az iphone simulator(sdk nem talál hibát) viszont csak felugrok az ablak aztán ki is lép az alkalmazásból.

    Tudod mi lehet a gond? Mert így sajnos nem tudok továbblépni sem.

  7. p94 - 2010.10.28. 18:27

    a saját programjainkat nem lehet hozzáadni az iTunes storehoz? :D

  8. Bence - 2010.10.28. 19:13

    Az Apple kilistáz néhány webspp-ot, de nem tudom hogy lehet oda felkerülni…

    Viszont láttam már webes alkalmazásokat áruló webshopot, szóval meg lehet oldani az árusítást! :-)

  9. Bence - 2010.10.28. 19:14

    webspp = webapp

  10. p94 - 2010.10.28. 19:25

    és ha beregisztrálok Apple IOS Developernek? onnan elvileg egyenesen App Storeba lehet rakni

  11. Bence - 2010.10.28. 19:36

    Mi itt két különböző dologról beszélünk…

    Az AppStore-ban konkrétan iPhone-ra készített programok vannak, azok nem webes alkalmazások!

    Ez a cikk a webes alkalmazások készítéséről szól, nem a "valódi" iPhone alkalmazásokról. A webes alkalmazást ugyanúgy egy ikonnal lehet indítani, van nyitóképernyő, és az egész teljes képernyőn fut… szinte nem is lehet megkülönböztetni a valódi iPhone alkalmazástól. Viszont a webes alkalmazáshoz nem kell iPhone-ra programozni, nem kell hozzá Mac… Aki tud weblapot készíteni, az az oktatóanyagom alapján elkezdhet iPhone-ra optimalizált weblapokat, vagy iPhone-on futtatható webes alkalmazásokat készíteni. Ez a gyönyörűsége a "webapp"-oknak, nagyon egyszerű őket elkészíteni, mégis nagyon sokmindent lehet velük megcsinálni! :-)

    A következő részben ezt tanuljuk: http://www.sencha.com/products/touch/demos.php

  12. iMind - 2010.10.28. 22:04

    Tameszol, szerintem kezd ezzel:

    ez alap dolgokat mutatja be:
    http://lilakavics.fw.hu/pdf_hun/BecomeAnXcoder.pd
    ill. utána ez:
    http://lilakavics.fw.hu/pdf_hun/ObjectiveCRuntime

  13. Kis Dániel - 2010.10.28. 23:18

    Iphone 4 bumperek:

    e.mail: danielkis26[kukac]yahoo.com

  14. zsmb - 2010.10.28. 23:31

    csak szerintem borzalmas a hang? 1 percnél tovább nem tudtam nézni a videót

  15. Bence - 2010.10.28. 23:57

    Keleman a cikkben is említi, és én is írtam a YouTube-on kommentben: a YouTube-os videó hangja valamiért eltorzult… Az eredeti 1024×768-as videók hangja normális! :-)

  16. p94 - 2010.10.29. 12:27

    ehhez a cd-t csak online lehet megvenni?

  17. p94 - 2010.10.29. 12:28

    elnézést EZT A CD-t…máshogy akartam kezdeni.

  18. Bence - 2010.10.29. 12:33

    A webshopomban lehet megrendelni (www.oktatovideok.hu).
    Választhatod a letöltést is, de kérheted a postázását is lemezen (ez utóbbi +500 Ft-ba kerül).

    (A YouTube hangot igyekszem kijavítani még ma! Más progival kell mp4-be kódolnom…)

    • KeleMan - 2010.10.29. 13:56

      Bence frissítette a YouTube videót, immár a hang is megfelelő.

  19. adhie - 2010.10.30. 15:41

    Én azt szeretném megkérdezni hogy a videóban amikor az iPhone-teszt megy, akkor az olyan hogy rákötöd a telót a gépre és akkor a képernyőn mutatja hogy mit csinálsz? Mert ha igen írjátok légyszi itt meg ennek a proginak a nevét mert énnekem is most van olyan melóm, hogy kifejezetten iPhone-ra de azért projektoron sokkal jobb lenne demózni a megrendelőnek.

  20. Bence - 2010.10.30. 16:13

    Kell hozzá egy jailbreakelt iPhone, és a DisplayRecorder nevű program. Az tud webszerverként futni, WiFi-n küldi a képet a számítógépre.

    A gépen két megoldás van: én az iDemo nevű programot használom (fizettem érte), mert annak jobb a felülete, és el is lehet forgatni a készüléket! Ingyenes megoldás is van: a Safari böngészőbe beírod azt az IP címet amit a DisplayRecorder ad meg neked a webserver elindításakor, és akkor ott jelenik meg az iPhone képe egy iPhoe keretben. Azt viszont nem lehet elforgatni…

    Szóval röviden:

    iPhone: jailbreak + DisplayRecorder

    szgép: iDemo vagy Safari

  21. adhie - 2010.10.30. 16:32

    Fú dejó köszönöm szépen. Nah akkor írok is a főnöknek hogy nem kell screenshotokból prezentációt csinálni. Nagyon sokat segítettél, köszi.

  22. iPalmay - 2010.10.30. 18:23

    Bence!

    Tegnap megrendeltem s CIB-ről át is utaltam (azt azonnal meg kellett kapnod) a 4900 Ft-ot. Mikorra várhatom a linket a video letöltésére?

    Köszi szépen, Üdv!

  23. Bence - 2010.10.30. 22:24

    Bekerült a letöltési központodba! :-)

  24. iPalmay - 2010.10.30. 22:30

    Nagyon köszönöm !

  25. tameszol - 2010.10.31. 16:44

    Bence én nagyon gondolkodom hogy megvegyem az anyagod, hogy webappokat készítsek, a kérdésem már csak az lenne tőled, hogy én mivel pénzkeresés céljából kezdeném ezt az egészet, megéri-e, ilyenfajta appokat készíteni?

  26. Bence - 2010.11.01. 12:05

    Egyre nagyobb igény lesz az iPhone-ra készített webapp-ok fejlesztésére, és a weblapok iPhone-ra való optimalizálására. Egy aktuális példa: http://index.hu/info/2010/10/18/mobiltender/

    Csak rajtad múlik, hogy a megszerzett tudást mire és hogyan használod fel! :-)

Szólj hozzá Te is!