Budapest University of Technology and Economics, Faculty of Electrical Engineering and Informatics

    Belépés
    címtáras azonosítással
    vissza a tantárgylistához   nyomtatható verzió    

    Kliensalkalmazások

    A tantárgy angol neve: Client Applications

    Adatlap utolsó módosítása: 2024. november 22.

    Budapesti Műszaki és Gazdaságtudományi Egyetem
    Villamosmérnöki és Informatikai Kar
    Üzemmérnök-informatikus szak, BProf képzés
    specializációtárgy
    Szoftverfejlesztés specializáció
    Tantárgykód Szemeszter Követelmények Kredit Tantárgyfélév
    VIAUBB03 4 2/2/0/v 5  
    3. A tantárgyfelelős személy és tanszék Somogyi Ferenc Attila,
    4. A tantárgy előadója

    Név

    Beosztás

    Tanszék

    Albert István

    mérnöktanár

    Automatizálási és Alkalmazott Informatikai Tanszék

    Gincsai Gábor

    		tanársegéd

    Automatizálási és Alkalmazott Informatikai Tanszék

    Gazdi László

    tanársegéd

    Automatizálási és Alkalmazott Informatikai Tanszék

    Dr. Somogyi Ferenc

    adjunktus

    Automatizálási és Alkalmazott Informatikai Tanszék

    5. A tantárgy az alábbi témakörök ismeretére épít

    Objektum orientált programozás alapjai Java és C# nyelveken.

    6. Előtanulmányi rend
    Kötelező:
    Training.Code=("5N-A9") ÉS

    Szakirany("BPINszoftfejl", _)

    A fenti forma a Neptun sajátja, ezen technikai okokból nem változtattunk.

    A kötelező előtanulmányi rend az adott szak honlapján és képzési programjában található.

    7. A tantárgy célkitűzése

     

    A tárgy célja, hogy a hallgatók megismerjék a kliensoldali alkalmazások fejlesztésének módszereit és meghatározó technológiáit különös tekintettel a vékony kliensekre (webes és mobil kliensek). A tárgy külön figyelmet fordít arra, hogy a technológiai lehetőségeken túl a hallgatók gyakorlati problémákkal és megoldásokkal is találkozzanak a félév során.

    A főbb célok a következők:

    · A web működésének (architektúra, kommunikáció, erőforrások és webalkalmazások) és alapvető fogalmainak megértése. (alkalmazás szint: problémamegoldás ismeretek alkalmazásával, példák, feladatok önálló megoldása - K3)

    · A HTML, CSS, JavaScript nyelvek és ezek együttműködésének haladó szintű ismerete. (K3)

    · A TypeScript nyelv megismerése. (megértés szint: magyarázatok, összefüggések ismerete, esetek felismerése, besorolása - K2)

    · A React keretrendszer működésének megértése. (K2)

    · Android alapú mobilkliens alkalmazások fejlesztési módszereinek és technológiának a megismerése. (K3)

    · Modern Android alkalmazások architekturális és felhasználói felületi tervezése. (K3)

     


     

    8. A tantárgy részletes tematikája


    Az előadások tematikája:

    Előadás

    Előadás anyaga

    1.

    Bevezetés – kliensoldali fejlesztés helye, szerepe. Vékony- és vastagkliens technológiák összehasonlítása. Az alapvető webes architektúra, kliens-szerver működés, HTTP alapú kommunikáció. Backend as a Service (BaaS) fogalma. HTTPS használata.

    2.

    Bevezetés a web alapvető technológiáiba: HTML, CSS, Bootstrap.

    3.

    A JavaScript nyelv, eseménykezelés JavaScript-ben. A HTML DOM feldolgozása. Sorosítás JSON formátumban. jQuery könyvtár és használata.

    4.

    Haladó JavaScript konstrukciók (globális változók, closure-ök, ECMA szabványok, modulkezelés). Űrlapok szerepe és működése. LocalStorage és SessionStorage fogalma.

    5.

    JavaScript adatkezelés, adatkötés, input validáció (bevezetés az Angular keretrendszer működésébe). TypeScript alapok.

    6.

    TypeScript nyelvi elemek, fejléc fájlok, osztályok, interfészek, anonim függvények. Fordítási folyamat (transpiling), statikus típusosság, modulrendszer

    7.

    React (alapok). Tree reconciliation. Kompozíció minta, komponens alapú fejlesztés. React fa. Osztály és függvény komponens. Props. Komponens életciklusa. Kompozíció, komponensek egymásba ágyazása. Statikus és feltételes gyerekek, listák. Feltételes attribútumok, class és classList.

    8.

    React (haladó) – state és useState. stable identity és closure kérdések. Aszinkron állapotkezelés. Eseménykezelés. Felhasználói bemenet, input és társai. Props/state/mixed alapú render (controled, uncontroled). DOM-ban tárolt állapot. Validáció. Reducers.

    9.

    Modern mobil alkalmazások életciklusa az Android szemszögéből. Android alkalmazás komponensek és ezek szerepe, valamint tipikus használati esetek. Több képernyős alkalmazások tervezése és megvalósítása. Általános állapot mentése életciklus váltás kezelésére.

    10.

    Mobil alkalmazások felhasználói felületének tervezése és megvalósítása. Felhasználói felülettel kapcsolatos erőforrások bemutatása, erőforrás minősítők. Moduláris felületek készítése, liisták kezelése.

    11.

    Perzisztens adattárolás elveinek bemutatása mobil környezetben. Kulcs-érték alapú adattárolási lehetőségek. Relációs adatkezelés, adat szűrés, keresés és rendezés. Aszinkron feladatvégrehajtás lehetőségei: szálak, korutinok, Flow-k. Felhasználói felület értesítése aszinkron végrehajtás esetén.

    12.

    A modern mobil alkalmazások felhasználói felületének tervezése és megvalósítása Jetpack Compose keretrendszerrel. Recomposition fogalma, alapelvei. Modern Android architektúrák. 

    13.

    Mobil platformokon támogatott rövid és hosszú távú hálózati kommunikációs technológiák használata. HTTP kapcsolatok kezelése. Futásidejű engedélyek. A BroadcastReceiver, a Service és a ContentProvider komponensek használata.

    14.

    A félév összefoglalása. Egyéb kitekintés: multiplatform mobilfejlesztés – HTML5 alapú technológiák (Electron, Cordova)

    A gyakorlatok részletes tematikája:

    Az első héten nem tartunk géptermi gyakorlatot.

    Gyakorlat

    Gyakorlat anyaga

    1.

    -

    2.

    Hatékony fejlesztőeszközök megismerése (Visual Studio Code). Böngészők használata (Developer Toolbar). Hálózati kommunikáció figyelő eszközök (Fiddler).  Cél a HTTP kommunikáció átlátása, HTML dokumentum megjelenítése, hivatkozások letöltése.

    3.

    HTML gyakorlat: HTML5, CSS dokumentumok szerkesztése. Haladó CSS technikák, grid rendszerek, flexbox elrendezés. CSS keretrendszerek (Bootstrap).

    4.

    HTML DOM manipuláció JavaScript és jQuery segítségével, dinamikus weboldal fejlesztése AJAX technológiával.

    5.

    Programozás TypeScript nyelven, a fordítás folyamatának áttekintése.

    6.

    React alapok, komponensek és hierarchiájuk, adatátvitel komponensek között (props), állapotkezelés (useState). Listák kezelése és renderelése.

    7.

    React haladó állapotkezelés, események, komponensek életciklusa, felhasználói input, feltételes renderelés, validáció. Routing támogatás React Router segítségével.

    8.

    1. Házi feladat bemutatása.

    9.

    Alkalmazás életciklus gyakorlása több képernyőből álló alkalmazás fejlesztése esetén.  Életciklus váltások megfelelő kezelése, állapot mentés.

    10.

    Összetett felhasználói felületek tervezése és megvalósítása  mobil környezetben.

    11.

    Perzisztens adattárolás alapú alkalmazás fejlesztése, listák kezelése.

    12.

    Hálózati kommunikáció alapú alkalmazás tervezése és megvalósítása.

    13.

    2. Házi feladat bemutatása.

     

    14.

    Pót házi feladat bemutatása.

     

    9. A tantárgy oktatásának módja (előadás, gyakorlat, laboratórium)

    Az előadás keretében a főbb témaköröket, koncepciókat, technológiákat mutatjuk be.

    A számítógépes termekben tartott gyakorlatokon az előadáson elhangzottakat gyakoroljuk konkrét példákon keresztül. A gyakorlatok egy része vezetett, ennek célja, hogy közösen, a gyakorlatvezetővel együtt találják ki a hallgatók a megoldást, amelyet a gyakorlatvezető végül részletesen megmutat. Vannak önálló feladatok is, ezek megoldása a hallgatók feladata, de a gyakorlatvezetőtől lehet segítséget kérni, ha valaki elakad.

    10. Követelmények

     

    A szorgalmi időszakban:

    • A tárgyhoz 2 házi feladat (részteljesítmény értékelés) tartozik, az első webes témakörben, a második mobilfejlesztés témakörben. Az első feladat bemutatásának határideje a 8. heti, a másodiké a 13. heti gyakorlat alkalom. A házi feladatokra 18 és 12 pont kapható, amelyeknek egyenként 50%-át el kell érni.
    • A házi feladat beszedéseken túl, 10 érdemi számítógépes gyakorlatot tartunk. A webes gyakorlatoknál 2, a mobilos gyakorlatoknál 1 hiányzás lehetséges, tehát legalább 4 webes és legalább 3 mobilos gyakorlaton jelen kell lenni.
    • A gyakorlatokra összesen 10 pont kapható (gyakorlatonként maximum 1 pont), ebből  legalább 5 pontot kell elérni. A pontok a gyakorlaton elvégzett vezetett és önálló feladatok alapján járnak.
    • A tárgyból zárthelyit nem tartunk.

    A félév végi aláírás feltételei:

    • Mindkét házi feladat sikeres bemutatása és legalább 50-50% elérése.
    • Legalább 4 webes és 3 mobilos gyakorlaton való részvétel és összesen 5 pont elérése a maximális 10 pontból.

    A vizsgaidőszakban:

    • A vizsgaidőszakban írásbeli vizsgát tartunk, amely 60 pontos, ebből legalább 30 pontot el kell érni a sikerességhez.

    Az osztályzat megállapításának módja:

    • 1. Házi feladat: max. 18 pont
    • 2. Házi feladat: max. 12 pont
    • Gyakorlatok: max. 10 pont
    • Vizsga: max. 60 pont

     

    88– 100: jeles

    75 – 87: jó

    62 – 74: közepes

    50 – 61: elégséges

    0 – 49: elégtelen


     

    11. Pótlási lehetőségek

    A két házi feladat közül az egyik házi feladat pótlólagos leadása a pótlási időszakban kijelölt időpontig lehetséges.

     

    Gyakorlatok pótlására nincs lehetőség.

    12. Konzultációs lehetőségek

    Folyamatosan, az előadókkal, vagy gyakorlatvezetőkkel előre egyeztetett időpontban.

    13. Jegyzet, tankönyv, felhasználható irodalom

    ·        Christopher Nance: TypeScript Essentials, 2014, Packt Publishing, ISBN: 978- 1783985760

    ·        Alex Banks, Eve Porcello, Learning React: Modern Patterns for Developing React Apps- Second Edition, 2020, O'Reilly Media, Inc., ISBN: 978-1492051725

    ·        Forstner Bertalan, Ekler Péter, Kelényi Imre, Bevezetés a mobilprogramozásba, SZAK Kiadó Kft., ISBN: 9789639863019

    ·        Ekler Péter, Fehér Marcell, Forstner Bertalan, Kelényi Imre, Android-alapú szoftverfejlesztés, SZAK Kiadó Kft., ISBN: 9789639863279

    ·        Bruce Lawson, Remy Sharp, Introducing HTML5 2nd, New Riders, ISBN: 9780321784421

    ·        Elisabeth Robson, Eric Freeman, Head First HTML with CSS & XHTML, O’Reilly, ISBN: 9780596101978

    ·        David Flanagan, JavaScript: The Definitive Guide, 6th Edition, O’Reilly, ISBN: 9780596805524

    ·        Jonathan Chaffer, Karl Swedberg, Learning jQuery 3rd, O’Reilly, ISBN: 9781849516549

    14. A tantárgy elvégzéséhez átlagosan szükséges tanulmányi munka

    Kontaktóra

    56

    Készülés előadásokra

    7

    Készülés gyakorlatra

    14

    Készülés laborra

    0

    Készülés zárthelyire

    0

    Házi feladat elkészítése

    33

    Önálló tananyag-feldolgozás

    0

    Vizsgafelkészülés

    40

    Összesen

    150
    15. A tantárgy tematikáját kidolgozta

    Név:

    Beosztás:

    Tanszék, Int.:

    Asztalos Márk PhD

    docens

    Automatizálási és Alkalmazott Informatikai Tanszék

    Dr. Ekler Péter

    docens

    Automatizálási és Alkalmazott Informatikai Tanszék

    Dr. Forstner Bertalan

    docens

    Automatizálási és Alkalmazott Informatikai Tanszék

     Dr. Somogyi Ferenc

    		 adjunktus

     Automatizálási és Alkalmazott Informatikai Tanszék

     Albert István mérnöktanár

     Automatizálási és Alkalmazott Informatikai Tanszék

     Gazdi László tanársegéd

     Automatizálási és Alkalmazott Informatikai Tanszék

     Gincsai Gábor
    		 tanársegéd

     Automatizálási és Alkalmazott Informatikai Tanszék