Informatikai rendszerek építése (2021/22. II. félév)

• Tanszéki weboldal
• BProf gyakorlat
• Beadandó információk

1. hét

Szoftveres követelmények ismertetése, telepítése, ismerkedés az Angular keretrendszerrel.

• Szoftverkövetelmények
• Laborgépeken szükséges beállítások
• What is Angular?
• Getting started with Angular

2. hét

Node Package Manager használata. Bootstrap telepítése, grid rendszer. Sztring interpoláció és strukturális direktívák (*ngIf, *ngFor) az Angular keretrendszerben.

Adatok:

• Jelentkezők listája

Forráskódok:

• Állásjelentkezések nyilvántartása - [DEMO]

Dokumentációk, egyéb anyagok:

• TypeScript Playground
• Bootstrap
• Emmet abbreviations (+Emmet in VSCode)

3. hét

Angular komponensek létrehozása (ng generate), komponensek közötti együttműködés (@Input és @Output dekorátorok, EventEmitter osztály használata).

Forráskódok, tananyagok:

• Komponensek együttműködése - feladatok
  • Szavazó felület - [DEMO]
  • Szemantikus verziószámozás - [DEMO]

Dokumentációk, egyéb anyagok:

• Angular Components Overview
• Sharing data between child and parent components
• Semantic Versioning 2.0.0

4. hét

Angular komponensek további gyakorlása (lásd 3. hét).

5. hét

HTTP kérések kezelése Angular-ban. Az Angular Router.

Forráskódok, tananyagok:

• HTTP protokoll
• JSONPlaceholder (Fake JSON API)
• Közösségi alkalmazás - [DEMO]

Dokumentációk, egyéb anyagok:

• DummyJSON (Fake JSON API komplexebb adatstruktúrával)
• Routing in SPAs
• Common Routing Tasks in Angular

6. hét

Aszinkron végrehajtás JavaScript-ben. Angular keretrendszer további gyakorlása.

Forráskódok, tananyagok:

• Aszinkron végrehajtás
• előző heti feladat befejezése

Dokumentációk, egyéb anyagok:

• Promise Basics + async/await

7. hét

Adatbázis-kezelés TypeORM segítségével. Webshop példa kezdeti felületének kialakítása.

Adatok:

• Termékadatbázis

Forráskódok, tananyagok:

• Webshop alkalmazás terve
• TypeORM gyakorlat (Dr. Nehéz Károly anyaga)

Dokumentációk, egyéb anyagok:

• TypeORM dokumentáció

8. hét

TypeORM további gyakorlása. HTTP API készítése Express.js segítségével. Webshop példa backendjének létrehozása.

Forráskódok, tananyagok:

• Szerver létrehozása, Express alapok
• Kezdő backend projekt
• Webshop projekt (szerda 8:00)
• Webshop projekt (szerda 10:00)

Dokumentációk, egyéb anyagok:

• Express.js Documentation

9. hét

Webshop példa fejlesztése. CRUD műveletek implementálása, karbantartható projekt struktúra kialakítása szerveroldalon.

Forráskódok, tananyagok:

• Webshop projekt (szerda 8:00)
• Webshop projekt (szerda 10:00)

Dokumentációk, egyéb anyagok:

• Postman Portable

10. hét

Webshop példa továbbfejlesztése. Szerver- és kliensoldal illesztése. Reaktív form-ok az Angular-ban.

Forráskódok, tananyagok:

• Webshop projekt (szerda 8:00)
• Webshop projekt (szerda 10:00)

11. hét

Webshop példa továbbfejlesztése. Adatfelvitel, hibakezelés kliens- és szerveroldalon. 1:1, 1:N, N:M kapcsolatok TypeORM entitások között.

Forráskódok, tananyagok:

• Webshop projekt (szerda 8:00)
• Webshop projekt (szerda 10:00)

Dokumentációk, egyéb anyagok:

• TypeORM - Relations

12. hét

Konzultáció a beadandó feladatokkal kapcsolatban.

13-14. hét

Féléves feladatok beadása. Javítások és pótlások.

Plusz anyagok

• Valósidejű diagram készítése ApexCharts-al - [DEMO]

Elérhetőség

Kiss Áron, tanszéki mérnök
ME-GÉIK Informatikai Intézet

E-mail: kiss.aron@uni-miskolc.hu