Az myConfix egy asztali PC konfigurátor, amivel saját igényeinknek megfelelően állíthatjuk össze leendő számítógépünket. Felhasználóként regisztrációt követően egyedi számítógép-konfigurációkat állíthatunk össze a rendelkezésre álló hardverlista alapján. A kész összeállításokat elmenthetjük a fiókjukba, illetve megtekinthetjük, szerkeszthetjük és törölhetjük is őket.
A projekt klónozásához a következő parancsot adja ki a terminálban:
git clone https://github.com/Biestina/myConfix-fullstack-exam-project.gitLépjen be a projekt gyökérkönyvtárába:
cd myConfix-fullstack-exam-projectA projekt függőségeinek telepítéséhez adja ki a következő parancsot:
cd Client\Angular && npm i && ng build && cd ../.. && npm iA Docker telepítéséhez kövesse a hivatalos dokumentációt: Docker Desktop for Windows vagy Docker Desktop for Mac vagy Docker Desktop for Linux
A Docker Compose telepítéséhez kövesse a hivatalos dokumentációt: Docker Compose
Nyissa meg a Docker Desktop alkalmazást, és győződjön meg róla, hogy a Docker fut. A Docker Compose futtatásához a projekt gyökérkönyvtárában adja ki a következő parancsot:
npm run docker-composeMegjegyzés: A MongoDB adatbázishoz való csatlakozáshoz szükség lehet a projekt készítőjének közreműködésére a szerver beállításához.
Az alkalmazás megnyitásához a következő linket kell megnyitni a böngészőben: http://localhost:3000/login
Hozzon létre egy új felhasználót a "Sign up now!" linkre kattintva, vagy használja a következő adatokat:
email: t@ester.com
password: testerEgy felhasználó, aki különböző gépösszeállításokat menthet, illetve módosíthat a regisztrált fiókjában, valamint böngészhet a hardverek között. Tárolásra kerül az e-mail címe, felhasználóneve, jelszava, és a jogosultsági szerepköre.
Egy számítógép-összeállítás, amelyet regisztrált felhasználóként kezelhetünk, amennyiben rendelkezünk regisztrációval és felhasználói jogosultságokkal. Rendelkezik névvel, felhasználó-hivatkozással és alkatrészekkel (CPU, RAM, PSU stb.).
Egy számítógép-alkatrész, ami az oldal nyilvános hardverlistájának elemeként jelenik meg. Az alkalmazás 8-féle hardvertípust különböztet meg kategória alapján. (Gépház, Processzor, Videókártya, Alaplap, Monitor, Memória, Tápegység, Háttértár). Ezek alapján tudunk egyedi konfigurációt beállítani.
A felhasználó megnyitja az alkalmazást
- **GET /api végpont implementálása a főoldal megjelenítéséhez
A felhasználók böngészhetnek a hardverek között
- GET /api/hardwares végpont implementálása a hardverek lekéréséhez
- Hardverek listázása táblázatos formában
A felhasználó regisztrál és belép az alkalmazásba
- Regisztrációs képernyő megvalósítása
- GET /api/users végpont implementálása a létező felhasználók lekéréséhez
- POST /api/users regisztrációs végpont implementálása
- Login képernyő megvalósítása
- POST /api/login végpont implementálása
- JWT autentikáció implementáció, kliens oldali hozzáférés szabályozása autentikáció alapján
A felhasználó összeállít egy PC konfigurációt
- Builder képernyő implementálása
- GET /api/hardwares végpont implementálása az összeállításhoz szükséges alkatrészek lekérdezéséhez
- POST /api/configs/:userId/myconfigs végpont implementálása a konfiguráció véglegesítéséhez
A felhasználó megtekinti a mentett összeállításait
- My configs képernyő implementálása
- GET /api/configs/:userId/myconfigs/:configId végpont implementálása (felhasználó összeállításainak lekérdezése)
A felhasználó módosítja a kiválasztott konfigurációt
- Update képernyő implementálása
- PUT /api/configs/:userId/myconfigs/:configId végpont implementálása a konfiguráció módosításához
- DELETE /api/configs/:userId/myconfigs/:configId végpont implementálása a konfiguráció törléséhez
- My configs képernyő implementálása
A felhasználó létrehozhatja a felhasználói fiókját, e-mail és jelszó megadásával.
A felhasználó bejelentkezhet e-mail cím és jelszó megadásával.
A felhasználó táblázatos formában látja az adatbázisban szereplő hardvereket. A kiválasztott hardverhez tartozó "More" gomb megnyomásával egy felugró ablakban láthatóak a hardver további tulajdonságai.
A képernyő bal oldalán látható az összeállító űrlap. Minden alkatrész-kategóriához tartozik egy legördülő menü, amiben a felhasználó az ahhoz tartozó komponensek közül kiválaszthatja, melyiket szeretné beépíteni a konfigurációjába. Kategóriánként egy hardver választható. A képernyő jobb oldalán listázásra kerülnek a kiválasztott hardverek, de még nem mentődik el a lista. A "Build a new PC" gombra kattintva elmentjük az összeállítást, majd a My Configs képernyőre jutunk. (Csak belépés után érhető el.)
A bejelentkezett felhasználó látja kész összeállításait kártyák formájában. A kiválasztott összeállítás kártya-elemén található "Update" gomb megnyomásakor az alkalmazás átnavigál a konkrét konfiguráció szerkesztési felületére. (Csak belépés után érhető el.)
A felhasználó egy űrlap formájában látja az aktuális konfigurációját, amelyet szerkeszthet. Az "Update" gomb megnyomásával elmentődnek a változtatások, a "Delete" gombbal pedig törlődik az elem a listából. Az "Update", vagy "Delete" művelet véglegesítése után a felhasználó visszajut a My Configs képernyőre a módosított listájához.
| HTTP kérés | API végpont | Leírás |
|---|---|---|
GET |
api/hardwares | Hardverek lekérdezése |
GET |
api/hardwares/:id | Adott hardver lekérdezése |
GET |
api/configs/:userId/myconfigs | Konfigurációk lekérdezése |
POST |
api/configs/:userId/myconfigs | Konfiguráció létrehozása |
GET |
api/configs/:userId/myconfigs/:configId | Adott konfiguráció lekérdezése |
PUT |
api/configs/:userId/myconfigs:configId | Konfiguráció szerkesztése |
DELETE |
api/configs/:userId/myconfigs/:configId | Konfiguráció törlése |
GET |
api/users | Felhasználók lekérdezése |
POST |
api/users | Felhasználói regisztráció |
GET |
api/users/:id | Adott felhasználó lekérdezése |
POST |
api/login | Felhasználói bejelentkezés |
POST |
api/logout | Felhasználói kijelentkezés |
GET |
api/me | Felhasználó azonosítása |
POST |
api/refresh | Munkamenet frissítése |